winkm89/teachPress

font size issue

Closed this issue · 12 comments

Hi,

I recently noticed that my publication list changed to a smaller font size (but not the abstract); I didn't make any change to the style. See the below screenshot. Do you have any idea how to set the font size for the publication list?

Here is my code in the Wordpress page:
[tplist order="year ASC, date ASC, title ASC" author_name="simple" author_separator="," show_bibtex=0 show_tags_as="none" show_user_filter=0 size="large" image=”left” image_size=”30″]

I am using teachPress Version 8.0.2 in Wordpress v5.6.5. Here is the publication list page: https://bioinformatics.bwh.harvard.edu/research/publications/

Thanks,
-Xianjun

image

Hi,
I found the bug with the font-size of the abstract. The rest comes from a change in the font-size definition: I'm using now rem font sizes instead of px. This means that the font-size is based on the font-size of the html root element given from your used theme. In you case this root size is:

html {
font-size: 62.5%;
}

And this leads to the small font size.

Thanks, winkm89. How can I fix it?

I see you fixed it in the new commit. Looking forwards to the new release and testing it!!

b-pfl commented

So why does the 2021 template change all font sizes to 0.9rem?
The font size is clearly too small and from my perspective it should follow the general size definitions of the corresponding theme. At least there should be a switch to disable scaling.

I agree. @winkm89, please help to fix this. The reference font is too small to read, very annoying. I am actually thinking to switch to something else for the reference page, if it keeps there.

I think you can talk endlessly about font sizes. 0.9rem are a good fit in my opinion, depending on the used theme. But everyone sees it differently. I will change the standard to 1.0rem with the next update. If that still doesn't work, I recommend simply over-controlling the values using your own WordPress theme CSS. It's not that difficult. Example:

.tp_pub_author, #content p.tp_pub_author, .tp_pub_menu, #content p.tp_pub_menu, div.tp_pub_number, .tp_abstract_entry, .tp_pub_additional, #content p.tp_pub_additional, .tp_pub_title, #content p.tp_pub_title {
	/* Do what you want here: */
    font-size: 16px !important;
}

Wow~~ magic! It works perfectly. BIG thanks for the example code (It might be simple for you, but a big deal for me).

image

By the way, for other's reference here is how I made it: Login your Wordpress dashboard, Appearance --> Customize --> Additional CSS --> paste the above code there and save. Done.

@winkm89 Mike - One more question: If I want to make the publication journal name (e.g. "Scientific Reports" in the above screenshot) bold, how should I set the CSS style?

@winkm89 Mike - One more question: If I want to make the publication journal name (e.g. "Scientific Reports" in the above screenshot) bold, how should I set the CSS style?

I tried adding this:
.tp_pub_additional, #content p.tp_pub_additional { /* Do what you want here: */ font-weight: bold; font-style: italic;; }

But it makes the whole line bold/italic (see screenshot). How can I highlight only the journal name part? Also, can you remove the "In:" part in front of the journal name? I am not aware of any scientific reference style with that. Thanks.

image

If I want to make the publication journal name (e.g. "Scientific Reports" in the above screenshot) bold, how should I set the CSS style?

Try it with:

.tp_pub_additional_journal { 
    font-weight: bold; font-style: italic; 
}

Also, can you remove the "In:" part in front of the journal name?

The easiest way:

.tp_pub_additional_in {
    display: none;
}

Thanks a lot!!