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.

    Setting font sizes for HelloWorld, Calendar, and headers

    Scheduled Pinned Locked Moved Development
    3 Posts 3 Posters 796 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.
    • P Offline
      pcmofo
      last edited by

      I’m looking at setting font sizes for various elements. Everything looked great using a Pi and I upgraded to a 4k monitor so I’ve been readjusting everything.

      Green arrows are title headers for modules I’d like to enlarge.

      For the Calendar I’m using MMM Ext2. I can adjust the date headers but I can’t seem to adjust the individual event font (red arrow)

      Lastly the HelloWorld module at the top (purple arrow) should be larger as well.

      Any help adjusting these would be greatly appreciated. I’ve attached relevant screen shots of my CSS and configs.
      Screen Shot 2023-02-22 at 10.02.59 PM.jpg
      Screen Shot 2023-02-22 at 9.59.00 PM.png
      Screen Shot 2023-02-22 at 9.58.45 PM.png
      Screen Shot 2023-02-22 at 9.58.15 PM.png
      Screen Shot 2023-02-22 at 9.57.28 PM.png

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

        @pcmofo see
        https://forum.magicmirror.builders/topic/14862/help-with-a-couple-css-issues?_=1677124786771

        on how to use the browser debugger to find elements and their styles and use that to set values in custom.css

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        1 Reply Last reply Reply Quote 0
        • BKeyportB Offline
          BKeyport Module Developer @pcmofo
          last edited by

          @pcmofo Default modules, and compliant other modules use the font settings in the root from main.css.

          You can copy that over to custom.css and adjust as needed to affect the base.

          The "E" in "Javascript" stands for "Easy"

          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