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.

    MMM-OpenweatherForecast

    Scheduled Pinned Locked Moved Custom CSS
    8 Posts 2 Posters 3.5k 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.
    • S Offline
      sdetweil @bradley1982
      last edited by

      @bradley1982 git remote shows the url from where the module was cloned

      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 @bradley1982
        last edited by sdetweil

        @bradley1982 css is very specific

        stuff before the {
        is called the selector clause
        it ‘selects’ the elements that will be affected by the settings after the {

        there is no ‘simple’ answer

        you can use the developers window elements tab to discover and test css styles to determine what should go in custom css

        see the second link in my signature below for a quick overview of how to use the elements tab

        knowing the module source location would allow me to look at its css settings to see if there was something more direct

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        B 2 Replies Last reply Reply Quote 0
        • B Offline
          bradley1982 @sdetweil
          last edited by

          @sdetweil great ok thanks for coming back so quickly

          1 Reply Last reply Reply Quote 0
          • B Offline
            bradley1982 @sdetweil
            last edited by

            @sdetweil

            bradley@raspberrypi:~/MagicMirror/modules/MMM-OpenWeatherForecast $ git remote -v
            origin https://github.com/Tom-Hirschberger/MMM-OpenWeatherForecast (fetch)
            origin https://github.com/Tom-Hirschberger/MMM-OpenWeatherForecast (push)

            does this help

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

              @bradley1982 from the module readme

              Styling

              This module is set to be 320px wide by default. If you wish to override it, you can add the following to your custom.css file:
              
              .MMM-OpenWeatherForecast .module-content {
                width: 500px; /* adjust this as desired */
              }
              Most important elements of this module have one or more class names applied. Examine the MMM-OpenWeatherForecast.css, mmm-openweather-forecast.njk, or inspect elements directly with your browser of choice to determine what class you would like to override (Pro tip: If you start MagicMirror with npm start dev you'll get Chrome dev tools that will allow you to directly inspect any HTML element in the module).
              

              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