Streamlining layouts between category, calendar, table view

  • Philipp
  • Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
5 years 11 months ago #112259 by Philipp
Hi there,

so, I have got the timeline view styled just a I want it to, as it is is supposed to be the main way of presenting our events. I have arranged the tables view (the single event) in a way that it is not painful to look at, quite similar, but that's ok.

Now I am looking at the calendar view that opens whenever you have two events on the same day - and it just looks completely different from both the category and the table (singe) view.

Now I fear I already know the answer to this one, but just to make sure: Is there a workflow for this that is somehow simpler than to try to apply the styles from the categories (built with divs) onto the calendar view (built as a table but different from the single view)?

Getting rid of the calendar view altogether would also be a great option, but I think this used not to be possible...

Any luck?

Many thanks, Philipp

Please Log in or Create an account to join the conversation.

More
5 years 11 months ago #112267 by James Riley
Maybe you could do it this way: You can add additional CSS selectors into your CSS rule-sets by separating the selectors with a comma.

For example, if you have:
Code:
.some-wrapper-div-class {background-color:#123456;}
you could make the table that performs the same structural function as this div appear the same by doing this:
Code:
.some-wrapper-div-class, .the-calendar-table {background-color:#123456;}

It'll still take some work and you might need to write specific rulesets for some element of the table, but it will reduce duplicating some of your already written CSS code.

James Riley .: EventBooking user since 2014 ::: JoomDonation user since 2016 :.
.: grfx & web design / IT / AV @ St. Therese Institute of Faith and Mission, Bruno, SK, Canada :.

Please Log in or Create an account to join the conversation.

  • Philipp
  • Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
5 years 11 months ago #112272 by Philipp
Hello James,

many thanks, as always, for your helpful comments. Of course, this is how I would try to do it. It is extra complicates as the complete setup of the views is different: event title is a <h2> in the timeline view but a <h4> in the calendar view...

Thanks, Philipp

Please Log in or Create an account to join the conversation.

More
5 years 11 months ago #112274 by James Riley
For the h2 vs h4, as long as are are trying to change the font-size, you might just be able to stack the 2 selectors anyway:

h2.eb-even-title-container, h4.whatever-the-class-is {color:#123456;}
(note that the h2 in the Timeline layout has a type in the class name -- "even" instead of "event"... )

Or if you are changing font-size, then you might need to enter a second rule, either 1) exclusively for the h4 with whatever you want in common with the h2 copied into the declaration portion of the rule-set, or; 2) to reset a couple values of the h4 back to where you want them after the "combo" rule-set altered them.

James Riley .: EventBooking user since 2014 ::: JoomDonation user since 2016 :.
.: grfx & web design / IT / AV @ St. Therese Institute of Faith and Mission, Bruno, SK, Canada :.

Please Log in or Create an account to join the conversation.

Moderators: Tuan Pham Ngoc