|
Nijen
|
March 11, 2015 at 5:46 am
The datetime module, as it is out of the box takes up way too much space especially if the event has recurring date times. I am providing an example of what it looks like now and a photoshopped image of how I want it to look.
The datetime module is activated via the General Settings Templates tab and looks like this: Screenshot.
Since this takes up unneceessary screen space I would like to make it look a list instead, or something like this: Photoshopped image.
However since the datetime module does not have any CSS-classes embedded except for the one div that contains its design is set in stone. It is also difficult to find where the module is located in the core folder.
I would be happy if you could provide instructions on how to add css-classes to be able to tweak the looks as I wish.
The eventlist in question is located here: dininsida.se/kalendarium
Thanks!
|
|
Lorenzo Orlando Caum
|
March 11, 2015 at 11:41 am
Hi Nijen,
Try this:
https://gist.github.com/lorenzocaum/239b4237bd6b2b52be7a
—
Lorenzo
|
|
Nijen
|
March 11, 2015 at 1:41 pm
Thanks Lorenzo, with a few tweaks, it worked like a charm 🙂
See result: Screenshot
Tweaked CSS:
.ee-event-datetimes-li>br {display:none;}
.dashicons-clock, .dashicons-calendar {padding-left:15px;}
ul.ee-event-datetimes-ul {list-style-type: none;margin-left: -12px;}
li.ee-event-datetimes-li {height: 30px;}
|
|
Lorenzo Orlando Caum
|
March 11, 2015 at 1:49 pm
Looks really good! Thanks for sharing.
—
Lorenzo
|
