Throwing down the gauntlet

jproehl

@Mykle1 Doesn’t all of that text go within the body? There is a close } at the very end of the custom.css file that closes the body. Is that misplaced?

Mykle1

@jproehl said in Throwing down the gauntlet:

So does this splitting of the text suggest a bad formatting command in either or both files?

Nope. Before you paste code, simply put three back ticks It's under your tilde key, then close out the code with three more back ticks

Mykle1

@jproehl said in Throwing down the gauntlet:

Doesn’t all of that text go within the body? There is a close } at the very end of the custom.css file that closes the body. Is that misplaced?

No sir, not in this case. css is a bit different than config. That last } in your css is not doing anything. You can remove it. If you fixed the body and save the css file, you should see your changes after relaunching MM

jproehl

@Mykle1 Okay, thanks! I was way off! I made that change and now I get red text for the high temperature (so that’s progress, yea!!) but all the other stuff is still gray. I must still have some other syntax errors some where. Back to looking at the code …

jproehl

@Mykle1 Okay, I got it! I was missing a close bracket in my

.MMM-WunderGround .min-temp

definition, and fixing that fixed everything!! Even the line of icons in the current weather disappeared!!

Thank you so much!

Mykle1

@jproehl said in Throwing down the gauntlet:

and fixing that fixed everything!! Even the line of icons in the current weather disappeared!!
Thank you so much!

Glad to be of service. I’m just paying back Strawberry’s kindness to me by helping

jproehl

@Mykle1 Well, I applaud your efforts (it’s getting rarer in this messed up country) … I hope someday to figure this stuff out to a point where I can help another newbie. Thanks again!

Mykle1

@jproehl said in Throwing down the gauntlet:

Well, I applaud your efforts (it’s getting rarer in this messed up country) …

New York City, USA. I’m just trying to be good representative of my city and country.

I hope someday to figure this stuff out to a point where I can help another newbie. Thanks again!

Dude, one month ago I knew less than you, guaranteed. You will be helping others soon, guaranteed.

Peace

Mykle1

@jproehl said in Throwing down the gauntlet:

Thank you so much!

I just stole your coloring code for the date and time. haha, so thank you. See? You’re helping already. :thumbsup_tone1:

jproehl

@Mykle1 Have at it! FYI: the one I can’t get to work is the .newsfeed .title I still get small letters in gray for “New York Times” and “BBC”. If I go into the main.css and change the color/size for “small” text, that works but hear that isn’t recommended since it will disappear if I update MagicMirror.

strawberry 3.141

@jproehl custom.css

.newsfeed div.light.small.dimmed {
  color: #e54a1b;
  font-size: 9px;
}

Mykle1

@strawberry-3.141 said in Throwing down the gauntlet:

custom.css

I found myself squinting to read the source of the newsfeed in its default, dimmed state, so I jumped all over this. Now, with your css entry, and a little adjustment on my part, I now have my font-size: at 18px and its color: set to #99F.

Every time I think my mirror is perfect, you make it better. genuflecting We are not worthy!

Many thanks, many times. :thumbsup_tone2:

jproehl

@strawberry-3.141 said in Throwing down the gauntlet:

.newsfeed div.light.small.dimmed {
color: #e54a1b;
font-size: 9px;
}
Great, works like a charm! Thanks again!

jproehl

@strawberry-3.141 Hi: Can you point me to a reference where I can learn how to determine the precise terms to use for doing this? For example, how do you determine that “div.light.small.dimmed” was the proper parameter to enter to change the text I was after?

broberg

@jproehl it’s not super simple to find out what to write in the css if you are not familiar with css and javascript since most of that is names specified by the coders of the magic mirror and the modules,

If it’s not specified in the module documentation you can look in the modules .js file and search for the text className after that is usually specified one or more classes that will determine the appearance of what is being displayed.

The className should also be visible if you look at the html code in the browser.

jproehl

@broberg Okay, I’ll poke around in the codes. Thanks!

jbeck615

This post is deleted!

jbeck615

@jproehl curious if you ever solved #2? i got the same issue with the icons showing up under the current

jproehl

@jbeck615 Hi: That problem went away when I fixed a missing close bracket “}” in the custom.css. So, if you are getting the extra icon line in your current conditions display for the same reason I was, check to make sure that all of the entries in custom.css are of the form:

.“modulename” .“className” {
“parameter”: “value”;
}

A concrete example of this is:

.clock .time {
color: #99F;
}

One of my entries was missing that very last bracket. When I fixed that, the icon line went away and all the subsequent parameters that I was trying to change in the custom.css file also got changed.

I suspect that when that syntax error showed up the rest of the custom.css file was not processed and the parameter on which I left off the bracket and all the subsequent ones were never included.

Hope this helps! Good luck.

jbeck615

@jproehl thank you. ill do some deeper vetting. thanks!