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.

    Change heading color

    Scheduled Pinned Locked Moved Development
    5 Posts 3 Posters 3.6k 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.
    • D Offline
      d3r
      last edited by

      Hello,
      I have changed the color of all the regular text on my mirror by using the color argument. What would I need to add to my custom.css to assign a color to all the headers? I’m looking for a simple solution if possible.

      body {
             margin:0px;
             height:100%;
             width: 100%;
             zoom: 110%;
             **color : white ;**
             position : absolute;
      }
      

      Thanks

      Mykle1M 1 Reply Last reply Reply Quote 0
      • Mykle1M Offline
        Mykle1 Project Sponsor Module Developer @d3r
        last edited by

        @d3r said in Change heading color:

        I’m looking for a simple solution if possible.

        I don’t know if you consider this a simple solution, but you could add an entry for each module using the following.

        body {
               margin:0px;
               height:100%;
               width: 100%;
               zoom: 110%;
               **color : white ;**
               position : absolute;
        }
        
        .MMM-Fortune .header {
          color: white;  /* any HEX color will do  */
        }
        

        .MMM-Fortune being the name of your module. One for each module’s header. I wouldn’t know how to do it universally, but you’re only talking about 10? modules. Copy and paste into your custom.css file a few times, change the name for each module, done.

        Create a working config
        How to add modules

        A 1 Reply Last reply Reply Quote 1
        • A Offline
          Anhalter42 @Mykle1
          last edited by

          @Mykle1 Why bother with individual modules? If you do it for every module, isn’t it the same as simply styling header in general?

          I don’t know if we agree on the term “header”. For me, the following changes the color of the text of every module-headline to green:

          #custom.css
          header {
              color: green;
          }
          

          (Note: .header does not!)

          Mykle1M 1 Reply Last reply Reply Quote 0
          • Mykle1M Offline
            Mykle1 Project Sponsor Module Developer @Anhalter42
            last edited by Mykle1

            @Anhalter42 said in Change heading color:

            Why bother with individual modules? If you do it for every module, isn’t it the same as simply styling header in general?

            I was just offering what I knew how to do. Thanks for pointing out what I didn’t know how to do. I did say, " I wouldn’t know how to do it universally" in the post you responded to. Yup, I did.

            Create a working config
            How to add modules

            1 Reply Last reply Reply Quote 0
            • D Offline
              d3r
              last edited by

              Thank you for both your help.
              @Anhalter42 said in Change heading color:

              header {
              color: green;
              }

              That’s exactly what I was looking for.

              1 Reply Last reply Reply Quote 1

              Hello! It looks like you're interested in this conversation, but you don't have an account yet.

              Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.

              With your input, this post could be even better 💗

              Register Login
              • 1 / 1
              • First post
                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