• 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.

MMM-network-signal - make the message text larger

Scheduled Pinned Locked Moved Custom CSS
18 Posts 3 Posters 2.9k 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 @DarrenHill
    last edited by sdetweil Apr 3, 2022, 12:03 PM Apr 3, 2022, 12:00 PM

    @DarrenHill said in MMM-network-signal - make the message text larger

    .MMM-network-signal p {
        font-size: 1.5em;
     }
    

    yeh, override is tricky sometimes… the ‘nearest’ specified (to the targeted thing) style wins…
    in this case the style= specified ON the element itself

    UNLESS

    you add !important

    this works

    .MMM-network-signal p {
        font-size: 1.5em !important;
     }
    

    https://www.w3schools.com/css/css_important.asp

    Sam

    How to add modules

    learning how to use browser developers window for css changes

    D 1 Reply Last reply Apr 3, 2022, 12:10 PM Reply Quote 1
    • D Offline
      DarrenHill @sdetweil
      last edited by DarrenHill Apr 3, 2022, 12:13 PM Apr 3, 2022, 12:10 PM

      @sdetweil And we have a winner :D

      That one worked as you say, thanks Sam!

      So yesterday’s learning was GitHub, today’s is CSS ;)

      M S 2 Replies Last reply Apr 3, 2022, 12:15 PM Reply Quote 0
      • M Offline
        mumblebaj Module Developer @DarrenHill
        last edited by Apr 3, 2022, 12:15 PM

        @DarrenHill this worked for me. note the , before the p

        .MMM-network-signal ,p {
        font-size: 1.5em;
        color: yellow;
        }
        

        Check out my modules at: https://github.com/mumblebaj?tab=repositories

        S 1 Reply Last reply Apr 3, 2022, 12:25 PM Reply Quote 0
        • S Offline
          sdetweil @mumblebaj
          last edited by Apr 3, 2022, 12:25 PM

          @mumblebaj where do you see the leading comma in the css selector definition, except for allowing the same style to apply to multiple selectors

          .class element1, element2, element3 { 
             styles
          }
          

          vs having three separate definitions…

          .class element1{ 
             styles
          }
          .class element2 { 
             styles
          }
          .class element3 { 
             styles
          }
          

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          M 1 Reply Last reply Apr 3, 2022, 12:29 PM Reply Quote 0
          • S Offline
            sdetweil @DarrenHill
            last edited by Apr 3, 2022, 12:26 PM

            @DarrenHill said in MMM-network-signal - make the message text larger:

            So yesterday’s learning was GitHub, today’s is CSS
            also see the ways you can select elements

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

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            1 Reply Last reply Reply Quote 0
            • M Offline
              mumblebaj Module Developer @sdetweil
              last edited by Apr 3, 2022, 12:29 PM

              @sdetweil Try it. It works. I tested it.

              Check out my modules at: https://github.com/mumblebaj?tab=repositories

              D S 2 Replies Last reply Apr 3, 2022, 12:41 PM Reply Quote 0
              • D Offline
                DarrenHill @mumblebaj
                last edited by Apr 3, 2022, 12:41 PM

                @mumblebaj Just tried it (copy/paste from your code above) and whilst the yellow works, the font-size didn’t for me.

                1 Reply Last reply Reply Quote 0
                • S Offline
                  sdetweil @mumblebaj
                  last edited by Apr 3, 2022, 1:06 PM

                  @mumblebaj well, it made the font bigger, but NOT 1.5em…

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  1 Reply Last reply Reply Quote 0
                  • 1
                  • 2
                  • 2 / 2
                  2 / 2
                  • First post
                    17/18
                    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