Home / GitHub Page

Note title is too big and can't overwrite it with userchrome.css

Hi,

after upgrading to v1.0.193, the note title became definitely too big - as I can see in inspector, the font size for that input field is 22.5px:

<input type="text" placeholder="" value="something" style="flex: 1 1 0%;
 display: inline-block;
 padding: 5px 8px;
 margin-right: 10px;
 color: rgb(221, 221, 221);
 font-size: 22.5px;
 background-color: rgb(29, 32, 36);
 border: 1px solid rgb(85, 85, 85);
">

I tried to edit it with userchrome.css, but the element doesn’t have any id. I checked the selector value:

#react-root > div > div > div:nth-child(8) > div:nth-child(1) > input[type=text]

and put the following lines in userchrome.css:

#react-root > div > div > div:nth-child(8) > div:nth-child(1) > input[type=text] {
    font-size: 16px;
}

but with no success - it doesn’t change anything…

How can I deal with that?

Ok, got it - I was missing !important keyword:

#react-root > div > div > div:nth-child(8) > div:nth-child(1) > input[type=text] {
    font-size: 16px !important;
}

now it’s working. Joplin is definitely a good motivation to finally play a bit more with CSS files :wink:

4 Likes

Solved?

Otherwise please post a screen grab to show the problem.