Reducing TNG 15.0.2 font sizes in 3 different places

[JMM]

• TNG 15.0.2
• Template 2

Hello, folks,

Back in February of this year when TNG 15.0 first came out, some users were able to help me reduce the font size on my TNG main page, by adding some code to my templates/template2/css/mytngstyle.css file.  Thank you again, Philip & Rob.

I find myself at this time needing to do the same to set specific font sizes in 3 different places on my TNG 15.0.2 site.

Menu bar: If you look at THIS page, on the Menu Bar, note that the first 3 items (Home, Search & Login) are much larger than the next 3 items (Find, Media & Info) and the 2 items on the right side of the menu bar (Print & Bookmark):

...and with the Menubar Optimizer mod installed, note the menu items with the larger fonts too:

I am hoping that someone can tell me what to add to my templates/template2/css/mytngstyle.css file, so that all the menu items are the same font size (I wish to have them all the same size as the Find, Media & Info items.

Tabs: Next, on the same sample page above, note the somewhat-large size of the tabs (Individual, Ancestors, Maternal line, Paternal line, Descendants, Relationship, etc.):

I am hoping that someone can also tell me what to add to my templates/template2/css/mytngstyle.css file, so that all those tabs on that line use a slightly-smaller font size.  The line below that, with Personal Information, Sources, Event Map, etc., is perfect as-is.

topmenu.php: Finally, on the same sample page above, note in the Top Menu the size of the fonts that display Home Page, What's New, Photos, Histories, Headstones, Reports & Surnames, and over on the right size of the bar, the text First Name & Last Name:

Likewise, I am hoping that someone can also tell me what to add to my templates/template2/css/mytngstyle.css file, so that the text in white is slightly-smaller.  After I get the font size smaller, I will removing the menu items in the middle, (Home Page, What's New, Photos, Histories, Headstones, Reports & Surnames), and adding the 2 radio buttons on the right (Birth & Married), so that my TNG 15.0.2 topmenu looks the same as my TNG 14.0.6 was:

Thank you in advance & have yourselves a great day.

Regards,
John

[Philip Roy]

OK, first I can't recommend this free browser add-in enough. It's how I'm figuring out the CSS that you need - https://stylebot.dev

Now let's look at the menu bar. On the left, the menu sizes are actually 18px for Home and Search...then 16px for the rest. So you've already got a bit of a mix. But here's the code you need to add to your mytngstyle CSS file...

/*Change size of menu fonts on right*/
div.icons-rt.in-bar {
  font-size: 16px;
}

More to come.

[Philip Roy]

Tabs - Don't like this idea at all (as an explainer...the tabs are larger at the top level and the items below are smaller as they are sub-options within each tab) but it's your site and if you want, the change is...

/*Change tab fonts to smaller sizes*/
#tngnav a {
	font-size: 12px;
}

 

[Philip Roy]

Changing the central top menu links and the text (that I think you wanted to reduce) in the search...

/*Decrease the font size of top menu links down from 14px*/
a.topmenu {
  font-size: 12px; 
}

/*Change the font size of First Name and Last Name on the top right of site*/
td.topmenu {
  font-size: 12px
}

 

[JMM]

Philip, thanks for your help & expertise, as always .

But I think that I'm going to have to take a break from my CSS formatting for a couple of days.  About 12 hours ago one of our Internet providers went down across the entire country, and many hundreds of thousands of us subscribers were affected, including myself.  My Internet came back up again a few hours later, but it's been sporadic since them, constantly going down for a few minutes at a time, every few minutes. I'm going to wait until it comes back up again reliably before I do any more CSS changes & tests.

Thanks again for your help, and have yourself a splendid day.

Regards,
John