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

Resizing font size of modules

Scheduled Pinned Locked Moved Solved Troubleshooting
26 Posts 3 Posters 9.7k 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.
  • M Offline
    MMRIZE @Rags
    last edited by Apr 27, 2023, 12:22 PM

    @Rags
    It means your CSS(probably custom.css) is not applied.

    The reasons might be;

    • Fail to load custom.css (invalid file name or location)
    • Syntax error in your custom.css

    I can see the red circled X mark in your console. You can check it in Console tab(right of Elements tab) or click that mark directly.

    1 Reply Last reply Reply Quote 0
    • M Offline
      MMRIZE @Rags
      last edited by MMRIZE Apr 27, 2023, 12:26 PM Apr 27, 2023, 12:24 PM

      @Rags

      To make things simple;

      1. All other modules except newsfeed, remove or disable them. (It seems you have more than 28 modules currently)
      {
        disabled: true, // <-- toggle the module disabled/enabled
        module: "weather",
        position: "top_right",
        ...
      
      1. Return to custom.css to the original, or remove all its contents.

      2. Now, I’ll assume you have a clean CSS.

      3. Then just add this into your custom.css and save it.

      .newsfeed .newsfeed-title {
        font-size: 60px;
      }
      
      .newsfeed .newsfeed-source {
        font-size: 40px;
      }
      
      1. Let’s see what happens when MM runs.
      1 Reply Last reply Reply Quote 0
      • S Away
        sdetweil @Rags
        last edited by sdetweil Apr 27, 2023, 1:39 PM Apr 27, 2023, 12:29 PM

        @Rags using your image, marked up for color

        forum2.png

        the styles tree pane (right side, orange) shows info for only ONE element at a time

        look at the bottom row of the element tree pane(left side, blue), right edge, says u have the module-content element selected (purple), not the newsfeed-title element(green)

        because the module replaces it’s content every updateInterval cycle, the developers window will reselect the first element not replaced if your selected element disappears

        that’s why I said set the interval to 60 seconds to give u time to look and change

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        R 1 Reply Last reply Apr 27, 2023, 5:13 PM Reply Quote 0
        • R Offline
          Rags @sdetweil
          last edited by Rags Apr 27, 2023, 5:18 PM Apr 27, 2023, 5:13 PM

          @MMRIZE Finally ! Finally…
          I disabled all modules, except newsfeed, then cleared out the custom.css configs and added a fresh config for newsfeed as suggested above and finally it worked.
          So was the issue just because of the corrupt custom.css?
          Anyways, this issue has enabled me to learn working with the developer console. I am glad.
          Thank you @MMRIZE and thank you @sdetweil . Ever obliged.

          nfs2.png

          S 1 Reply Last reply Apr 27, 2023, 5:21 PM Reply Quote 1
          • S Away
            sdetweil @Rags
            last edited by Apr 27, 2023, 5:21 PM

            @Rags glad u got it working

            one thing to note, if there is a syntax error in the custom.css, everything ABOVE the error will work, everything AFTER will not

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            R 1 Reply Last reply Apr 27, 2023, 5:33 PM Reply Quote 0
            • R Offline
              Rags @sdetweil
              last edited by Apr 27, 2023, 5:33 PM

              @sdetweil Sure noted. Thanks

              1 Reply Last reply Reply Quote 0
              • 1
              • 2
              • 3
              • 3 / 3
              3 / 3
              • First post
                24/26
                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