Help with bolding issue?

Iokaree·8/3/2021 in Technical Advice & Coding Help

Hi there everyone! I'm currently trying to prepare my wikis for the upcoming move to FandomDesktop. While updating my css, I noticed that bolding ends up not working correctly.

CSS properties such as "font-weight" no longer seem to be bolding the text and do not seem to affect it at all anymore. On the other hand, bullet points now seem to bold by default. Are these two things intended to work that way? And if so, does anyone know a work around that I could apply with css? Basically I want a bit of a thicker text on my articles, since the default thickness is hard to read for some fonts, and do not want bullet points to bold by default since that seems a bit.. messy when planning to bold only specific parts?

If anyone knows, thank you in advance!

Fluffyneondinosaur·8/3/2021

@HumansCanWinElves

HumansCanWinElves·8/3/2021

Can you give a link to a page that demonstrates the issues? And to the CSS you have tried to use?

OttoLannister550·8/3/2021

Regarding the bullet points, you can customize the size of the bullets using CSS font-size property on ::marker selector :

.mw-parser-output ::marker {
    font-size: INSERT FONT SIZE;
}

HumansCanWinElves·8/3/2021

This^ is non-standard though and won't work for all browsers.

Iokaree·8/3/2021

Yes, of course! I'll use my friend's wiki to show off the issue as we tested it on there too and less extra coding to look at. Here is the simple version of the css that we are trying to use. Very basic and it achieved the wanted effect of having a bit of a thicker font on the wiki while Oasis was active, no issues until now! Basically just a font-weight property that applied to article text. Already adjusted the new name for WikiArticle in this case

https://dragonprince.fandom.com/wiki/MediaWiki:Fandomdesktop.css

https://dragonprince.fandom.com/wiki/Spells#Dark_Magic It's visible very well when using FandomDesktop on this page

Here is an image again for comparison of how it looks like on Oasis currently and the bolding effect not carrying over to FandomDesktop. However, everything that is put in bullet points has the right boldness we are trying to achieve, without me coding anything extra for bullet point sections

https://i.gyazo.com/b2a7a13b753bdd8ffe2452c85f 1b881f.png

So you may see, I'm a little bit confused as to why the bullet points have the right thickness by default, but the general text is not picking up on the font-weight as before, seeing as I didn't code anything extra in terms of the bullet point text

i.gyazo.com

(Edited by Iokaree)

OttoLannister550·8/3/2021

Most modern browsers seem to support it though:

CSS ::marker pseudo-element | Can I use... Support tables for HTML5, CSS3, etccaniuse.com

Iokaree·8/3/2021

@OttoLannister550 It's less of an issue of customizing the bullet points separately, more like not understanding why they behave differently than before. Because they have been treated as article text on Oasis before, so the regular text and bullet points as shown on the examples were both the same thickness text wise. But thank you anyway c=

Andrewds1021·8/3/2021

I am not seeing an obvious boldening of the bullet points on FandomDesktop. Regardless, the reason for the differences is that the global CSS which determines the based appearance has been significantly rewritten. This means there is some styling that is missing and other styling that wasn't there before. As such, the CSS a wiki needs to use in order to get a similar look may be different from what it was before.

Iokaree·8/3/2021

Are you not experiencing it on yours in general or do you mean you are not seeing the difference? As the image shows in comparison, the thickness is clearly a lot thinner on the base article text above the bullet points, while the bullet points below have the correct thickness. They were both determined by .WikiArticle properties before. Obviously the font-weight applies correctly to the bullet points, so my only guess is that the actual article text uses a different class on FandomDesktop

I assume you mean global css being the changes made to FandomDesktop and the names of specific classes? Because that is kinda exactly what I'm trying to find out what I need to change for the font-weight to work again. Font size and color seem to work fine by just adding them to the .page-content class, which is the updated version of .WikiArticle, just not the weight. Confuses me why size and color work fine but not weight

What do you think?