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.

    Digital Clock minutes darker

    Scheduled Pinned Locked Moved Custom CSS
    6 Posts 2 Posters 420 Views 2 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.
    • A Offline
      alfi153
      last edited by

      Hello
      I would like to change the style of the standard clock. I already know how to change the font and size.
      Now I would like to change the color of the minutes.
      So the hour display should be completely white and the minutes should be grayish.
      And I would like to hide the seconds display completely.
      the command “displayseconds” in the configuration does not work

      Please help

      S 2 Replies Last reply Reply Quote 0
      • S Offline
        sdetweil @alfi153
        last edited by

        @alfi153

        but the displayseconds is misspelled
        displaySeconds
        MagicMirror is case sensitive

        always best to copy/paste from the doc
        https://docs.magicmirror.builders/modules/clock.html#using-the-module

        color, see the second link in my signature below to use the developers window

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        S 1 Reply Last reply Reply Quote 0
        • S Offline
          sdetweil @alfi153
          last edited by

          @alfi153 also, sadly the clock is displayed in one html element
          Snip20250214_1.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 @sdetweil
            last edited by

            @alfi153

            but make these changes to the modules/default/clock/clock.js

            add property

            		sendNotifications: false,
            		splittime:false,  // add this line
            

            and this code

            		if (this.config.displayType !== "analog" && this.config.showTime) {
            			if (this.config.splittime) {   // add these lines
            				let ts = timeString.split(':')	
            				timeString = `<span class="clockhour">${ts[0]}</span>:<span class="clockminute">${ts[1]}</span>`
            			}   // end of addition
            			timeWrapper.innerHTML = timeString;
            

            then in config.js for clock

                config: {
                  splittime: true, 
               ...
            

            and in css/custom.css

            .clock .clockminute {
               color: red;
            }
            

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            1 Reply Last reply Reply Quote 0
            • A Offline
              alfi153
              last edited by

              Thank you 🙂

              S 1 Reply Last reply Reply Quote 0
              • S Offline
                sdetweil @alfi153
                last edited by sdetweil

                @alfi153 i will submit something for permanent support

                I have added
                https://github.com/MagicMirrorOrg/MagicMirror/pull/3737

                Sam

                How to add modules

                learning how to use browser developers window for css changes

                1 Reply Last reply Reply Quote 0
                • 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