• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
MagicMirror Forum
  • Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
A New Chapter for MagicMirror: The Community Takes the Lead
Read the statement by Michael Teeuw here.

Edit CSS of only one instance of module

Scheduled Pinned Locked Moved Custom CSS
7 Posts 3 Posters 918 Views 3 Watching
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • S Offline
    sdetweil @OWL
    last edited by May 7, 2023, 2:30 PM

    @OWL yes, instead of using the classname, use the instanceID
    in custom.css

    #module_{#}_{modulename}
    

    you can ‘count’ the modules top down in config.js, starting at 0.

    Or you can use the developers console to discover the string

    #module_?_weather
    

    Screenshot at 2023-05-07 09-27-26.png

    Sam

    How to add modules

    learning how to use browser developers window for css changes

    1 Reply Last reply Reply Quote 0
    • S Offline
      sdetweil @OWL
      last edited by May 7, 2023, 2:31 PM

      @OWL in css the thing the left of the {, is called the selector clause

      it can contain all kinds of things and get very complex sometimes

      I use this one to help me remember or figure out a selector clause

      https://www.w3schools.com/cssref/css_selectors.php

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      O 1 Reply Last reply May 7, 2023, 2:35 PM Reply Quote 0
      • O Offline
        OWL @sdetweil
        last edited by May 7, 2023, 2:35 PM

        @sdetweil Very nice thank you!

        1 Reply Last reply Reply Quote 0
        • S Offline
          sdetweil @OWL
          last edited by May 7, 2023, 2:37 PM

          @OWL one thing to note on using the ID if you change the module order in config.js , the id changes…

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          B 1 Reply Last reply May 7, 2023, 8:56 PM Reply Quote 0
          • B Offline
            bugsounet Banned @sdetweil
            last edited by May 7, 2023, 8:56 PM

            @sdetweil maybe classes in module config can help ;)

            S 1 Reply Last reply May 7, 2023, 9:04 PM Reply Quote 0
            • S Offline
              sdetweil @bugsounet
              last edited by May 7, 2023, 9:04 PM

              @bugsounet yes maybe too

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              1 Reply Last reply Reply Quote 0
              • 1 / 1
              1 / 1
              • First post
                6/7
                Last post
              Enjoying MagicMirror? Please consider a donation!
              MagicMirror created by Michael Teeuw.
              Forum managed by Sam, technical setup by Karsten.
              This forum is using NodeBB as its core | Contributors
              Contact | Privacy Policy