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.

    custom CSS clock module

    Scheduled Pinned Locked Moved Development
    2 Posts 2 Posters 2.4k 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.
    • PointPubMediaP Offline
      PointPubMedia
      last edited by

      Hey guys…

      Would like to do some custom CSS for the clock module, but just for the time.

      Currently HH and MM are the same size and SS is smaller! I would like to have the MM bigger than the HH!

      strawberry 3.141S 1 Reply Last reply Reply Quote 0
      • strawberry 3.141S Offline
        strawberry 3.141 Project Sponsor Module Developer @PointPubMedia
        last edited by strawberry 3.141

        @PointPubMedia the hour and the minute are in the same div which makes it not possible to do it just in css, but
        there is a config option which adds a wrapper around the minutes, which is perfect for this task.

        the selector would be probably something like this:

        .clock div.time.bright.large.light span.bold {
          //set the font size here
        }
        

        therefore you also have to add clockBold: true to the config

        if you dont like the bold effect you can overwrite it as well where you change the font size

        Please create a github issue if you need help, so I can keep track

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