https://fonts.google.com

(eg: @import url(‘https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700|Open+Sans:400,700&display=swap’);)

use the @import method in custom.css and change the font declarations in
body
.thin
.light
.regular
.bold
header

from (example)
font-family: “Roboto Condensed”, sans-serif;
to
font-family: “Open Sans Condensed”, “Roboto Condensed”, sans-serif;

@sdetweil thanks for the advice.

After some more trial and error it made me figure out I had to add these two to fix it.

Guess it was the container one that I was missing and had to use together with the module definition to get it working.

Use the developer toos in Chrome to see the whole html & css. You can also edit that to try out things quickly.

@broberg Thank you very much

So seem to have gotten a little further regards to the top bar.
Adding the position: absolute in body seems to have somewhat helped.
The overflow hidden actually made top.left and top.right disappear.

My top.right module seems to be positioned a bit higher than my top.left module… But that might just be the look of the module itself.
Still need to figure out how to left align the navbar and what is happening with the background_below region…

Edit: Figured out the background as well after some research.
The fullscreen section is actually defined to be offset by -60px due to the body margins being defined as 60px. So had to simply add a similar section in my custom.css changing the offset to what I put in the body margin.

@mlcampbe custom.css has been force loaded as the last css file since 2.6 as I recall…

please post your changes maybe there is just mistype

Sorry, google photos don’t seem to stay around that long…

@andyyy said in Newsfeed custom.css:

Hi,

I am trying to change the font size of the newsfeed. That is my custom.css, the font size is still the same. Any ideas?

body {
.newsfeed .medium
{
font-size: 15px;
line-height: 20px;
}
}

You don’t put the .newsfeed inside the body{}

this should work better :

RESOLVED

@sdetweil got it! thanks guys, I’m slowly building confidence to poke around more and tweak. And annoy my wife by constantly tinkering ;)

@SarangBhai study the latest versions… its really only a capability difference. the structure is the same.

@AndrewEscobar and this is related to the MagicMirror 2 platform how?

@jaimonkhan so, you want to display 2 tables side by side?

i used float:left on one and float:right on another

without having to create a new area

@Denver77 i am sure that the button is not actually outside the div u put it in, so that means the class/styles cause it to be truncated out of display when the area when the window changes size

you can look at the classes in the developers window (ctrl-shift-i), elements tab,
and select the div that your content is in (position first) …

then expand down to find your button…

@Mykle1 OK everything good. I have not asked Google, I will also google ask.

Many Thanks

where do the phrases come from? module??

then u would fix the custom.css to add a new color for the class of the text

.modulename .class { color…}

Is the hover effect the same size as the image?

@sdetweil that did it thanks a lot :)

@Legendary_Wiz

Don’t know exactly what module you are using since there is more than one monthly calendar, but try this :