Event title's line spacing too tight

  • Amy Christian
  • Topic Author
  • Offline
  • New Member
  • New Member
More
7 years 1 month ago #113565 by Amy Christian
Event title's line spacing too tight was created by Amy Christian
Some of the events we list have very long titles. The default style used for the event title has way too tight line spacing. How can I most easily adjust this? Could we add something to Custom CSS? (I'm not CSS literate, just warning you, but I know how to cut and paste into it!) I'm using Events Booking version 3.4.1.



Also, what is the grey rounded square at the end of the event title? It doesn't appear to have any meaning or link. I'd love to remove it.

Thanks for any help. See my site at www.foodsystemsnetwork.org/index.php .

Amy C.
Attachments:

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

More
7 years 1 month ago #113567 by James Riley
Replied by James Riley on topic Event title's line spacing too tight
You're guess about adding some custom CSS is correct. You're site's default for spacing actually is only about 1 pixel more than EventBooking's value, so you could have this issue other places on your site as well with long titles if other components don't reset the h1 tag's line-height property to a greater value.

Anyhow, to fix this for your event listings, go to [ Event Bookjng -> Configuration -> Custom CSS tab -> Custom Css text area ] and enter:
Code:
#eb-categories .eb-box-heading, #eb-events .eb-box-heading, #eb-event-page .eb-box-heading { line-height:2em; }

I thought 2em looked good on my browser. Adjust the value if the spacing isn't quite right for what you want to see though (eg. 2.2em, 1.8em, etc;or you can use pixels as the unit of measure eg 24px, 18px, etc.).

As for the box, it might not be a part of Event Booking????

Looking at the code , it is ID'd as "pop-print" and the link looks like it is supposed to call a template-less version of the current page. It doesn't seem to do anything on-click however.
You can make it hide whenever an EB page is displayed by adding this CSS to EB's custom css box as well:
Code:
#pop-print{display:none;}
If this still shows up on other parts of your site, you could add the same CSS code to your template's custom CSS (if it has an option for adding your own CSS ).

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 :.
Attachments:
The following user(s) said Thank You: Amy Christian

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

More
7 years 1 month ago #113571 by Tuan Pham Ngoc
Replied by Tuan Pham Ngoc on topic Event title's line spacing too tight
Just want to add that to remove the square/print icon, you can go to Events Booking -> Configuration, look at Themes tab, set Show Print Button config option to No instead of having to add custom css to hide it

Tuan
The following user(s) said Thank You: Amy Christian

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

More
7 years 1 month ago #113580 by James Riley
Replied by James Riley on topic Event title's line spacing too tight
So it was a part of EB after all! Thanks Tuan.
Any thoughts Tuan as to why it was not showing a print icon or doing anything on click?

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 :.
The following user(s) said Thank You: Amy Christian

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

Moderators: Tuan Pham Ngoc