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.

    How to let user change font size in config file?

    Scheduled Pinned Locked Moved Development
    5 Posts 2 Posters 781 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.
    • UncleRogerU Offline
      UncleRoger
      last edited by

      I would like to add an option to the config file so that users can change the font size from the default I have defined.

      I believe that this is what is setting my font size and style:

      wrapper.className = this.config.classes ? this.config.classes : "thin xlarge bright pre-line";
      

      but I cannot find any documentation on “config.classes” and what’s allowed. I’m probably not searching for the right thing.

      Is it as simple as users putting

      classes: "thin small bright pre-line",
      

      in the config file? Is there anything that documents what classes are available?

      Personally, “xlarge” (or maybe “large”) works for me but I could see others wanting something different, especially for use in other regions.

      Thanks!

      S 1 Reply Last reply Reply Quote 0
      • S Do not disturb
        sdetweil @UncleRoger
        last edited by

        @UncleRoger classes is an MM config parm

        Screenshot at 2023-10-31 14-10-29.png

        not a module config parm.

        this.config points to the config: {} section of the module definition in config.js

        but it is just a string of class names that are added to the html element defining the module

        <div id="module_7_weather" class="module weather weather">
        </div>
        

        and these strings will be appended to the class=“” setting untouched or validated

        you could provide your own ‘string’ property to capture this info…
        remember that not every element inherits settings from its parent…
        so setting a top level div might not slide down to some text element later

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        UncleRogerU 1 Reply Last reply Reply Quote 1
        • UncleRogerU Offline
          UncleRoger @sdetweil
          last edited by

          @sdetweil

          Thanks! I went ahead and made a “textSize” property and used that to replace the size in the classes string I have.

          Maybe not the most graceful of solutions but it works.

          Thanks again!

          S 1 Reply Last reply Reply Quote 0
          • S Do not disturb
            sdetweil @UncleRoger
            last edited by

            @UncleRoger you could have used a generic class, and then showed them how to use custom.css to configure that class to their needs.

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            UncleRogerU 1 Reply Last reply Reply Quote 0
            • UncleRogerU Offline
              UncleRoger @sdetweil
              last edited by

              @sdetweil said in How to let user change font size in config file?:

              then showed them how to use custom.css

              I’m afraid that would be like having a toddler show someone how to fly a helicopter. 8^)

              I kinda understand the general idea of CSS but I certainly don’t know how to do anything with it. I’m really just sorta stumbling around picking up bits and bobs from other people and trying to MacGyver them into something functional.

              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