The most basic question about custom css

[JMac]

apologies for this one, I’m about to embark on my first steps into custom css for a module.

it’s a simple addition, but where do I put the modification, does it go in the css folder within the individual module, or the custom.css file within the main css folder in the MagicMirror directory?

I want to add this,
#GPHOTO_CURRENT {
background-size: cover;
}
as a change to MMM-GooglePhotos.

I have a very strong feeling its the latter but don’t want to mess this up, this feels like the movie Inception, I’ve only been in the first level of the dream and this is the dream within the dream.

cheers.

[tdw]

@JMac in the /css directory. Save the file as custom.css

[JMac]

@tdw
I’m currently looking at 3 files within the MagicMirror/css folder.
custom.css
custom.css-sample
main.css

so does it go in the custom.css file or do I have to make a new custom.css file containing the information for this one module and save it?

do all future css changes go within the custom.css file, or does each css change have it’s own file?

[sdetweil]

@JMac there is only one custom.css

the design in MagicMirror for css is a stack

main.css is loaded first
then any css files provided by modules
and last custom.css

that means any definitions in custom.css will override anything defined before

[JMac]

so I added,
#GPHOTO_CURRENT {
background-size: cover;
}
to the custom.css in the MagicMirror/css folder,

from your list this appears to be the correct place to put it, yet it appears to make no difference.

[sdetweil]

@JMac see the link in my signature about learning css