Improve compatibility with Projects plugin

[ksdavidc]

Is your feature request related to a problem? Please describe.
see here , where conflict with Projects plugin appears.
in a nutshell, Time Ruler insert max-width css that messes alignment of the headers in the Projects plugin page.
screenshot shows the relevant css classes

Describe the solution you'd like
TO be able to use both plugins without conflict

Describe alternatives you've considered
Not sure...
it appears the .container in the #calendar-container div is the culprit, though I can't see where that appears in the time ruler. Perhaps greater specificity in the css (aka #calendar-container instead of .calendar) would work?

As a very hacky fix, I have used a css snippet:

.projects-container .container {
  width: 100%;
}
@media (min-width: 640px) {
.projects-container  .container {
max-width: unset;
  }
}
@media (min-width: 768px) {
.projects-container  .container {
max-width: unset;
  }
}
@media (min-width: 1024px) {
.projects-container   .container {
max-width: unset;
  }
}
@media (min-width: 1280px) {
.projects-container   .container {
max-width: unset;
  }
}
@media (min-width: 1536px) {
.projects-container  .container {
max-width: unset;
  }
}

to override your settings, but I have not been able to determine what effect these settings are intended to produce, so I am not sure "unset" is the right setting or doesn't break something.

Additional context
video shows effect of toggling the max-width messes alignment of headers.

Screen.Recording.2024-06-27.at.5.56.39.AM.mov