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.

    change current weather colors - time and wind

    Scheduled Pinned Locked Moved Development
    16 Posts 5 Posters 16.7k Views 5 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.
    • cowboysdudeC Offline
      cowboysdude Module Developer @karde
      last edited by

      @karde said in change current weather colors - time and wind:

      Thanks for your help!!
      But that’s for the icon right? I’m trying to change the texts, “1.5” and “21:38”, but thanks for your help!

      Still done through the custom.css… not sure what they are as I use a different module for weather.

      1 Reply Last reply Reply Quote 1
      • pugslyP Offline
        pugsly @karde
        last edited by

        @karde I know its .normal in main.css but I do not know how to make it only change color for only one module. if you change .normal it will be for everything that uses .normal.

        Is that even possible that you do a .module.normal {color:blue;} in your custom.css. Even so you would be changing all the text in that module, as there is no ‘code’ for just that one section.

        Im no programer, so no clue. I only just figured out how to do the icons recently.

        1 Reply Last reply Reply Quote 2
        • cowboysdudeC Offline
          cowboysdude Module Developer
          last edited by

          Hey @pugsly any help is good help!

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

            @karde I’m assuming you’re using this module https://github.com/RedNax67/MMM-WunderGround

            due to the sunset and sunrise time is a span element and the following sibling of the icon you can apply this css rule in custom.css

            .wi.dimmed.wi-sunrise + span, .wi.dimmed.wi-sunset + span {
                color: orange;
            }
            

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

            1 Reply Last reply Reply Quote 2
            • K Offline
              karde
              last edited by

              THANKS YOU @pugsly and @cowboysdude!!!
              You guys are great!! Thanks for all your help!

              I got the text next to the wind icon to work as well, with:
              .dimmed.wi-strong-wind + span {
              color: #FFFFFF;
              }

              But… I missed one thing in my picture, you also have a wind direction next to the windspeed, say: “1.5 VNV”, anyone know who to change the “VNV” as well, couldn’t get it to work…:(

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

                @karde could you share your modules config i can’t get the same result as your screenshot in the first post. don’t forget to remove your api_key before posting

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

                K 1 Reply Last reply Reply Quote 0
                • K Offline
                  karde @strawberry 3.141
                  last edited by

                  @strawberry-3.141 I’ll be happy to!
                  But, to be honest, the picture I have included in the post isn’t my actual mirror, I’ve sent you a private message :)!

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

                    @karde this is for the default module currentweather and not as I thought MMM-WunderGround

                    /* wind speed selector */
                    .currentweather > .module-content > div > div.normal.medium > *:nth-child(2),
                    /* wind direction selector */
                    .currentweather > .module-content > div > div.normal.medium > *:nth-child(3),
                    /* sunset/sunrise time selector */
                    .currentweather > .module-content > div > div.normal.medium > *:nth-child(6){
                        color: orange;
                    }
                    

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

                    1 Reply Last reply Reply Quote 1
                    • K Offline
                      karde
                      last edited by karde

                      THANK YOU! And thanks everyone for all your time, I really appreciate it - alot!!!

                      1 Reply Last reply Reply Quote 0
                      • ? Offline
                        A Former User
                        last edited by A Former User

                        2_1477687812010_Screenshot 2016-10-29 03.45.42.png 1_1477687812010_Screenshot 2016-10-29 03.45.36.png 0_1477687812008_Screenshot 2016-10-29 03.45.31.png

                        Does anyone know where the CSS is managed for these Icons so can edit the colours?

                        Also has anyone done this already? and is there anything that needs special attention when doing?

                        Guessing custom CSS against

                        “01d”: “wi-day-sunny”,
                        “02d”: “wi-day-cloudy”,
                        “03d”: “wi-cloudy”,
                        “04d”: “wi-cloudy-windy”,
                        “09d”: “wi-showers”,
                        “10d”: “wi-rain”,
                        “11d”: “wi-thunderstorm”,
                        “13d”: “wi-snow”,
                        “50d”: “wi-fog”,
                        “01n”: “wi-night-clear”,
                        “02n”: “wi-night-cloudy”,
                        “03n”: “wi-night-cloudy”,
                        “04n”: “wi-night-cloudy”,
                        “09n”: “wi-night-showers”,
                        “10n”: “wi-night-rain”,
                        “11n”: “wi-night-thunderstorm”,
                        “13n”: “wi-night-snow”,
                        “50n”: “wi-night-alt-cloudy-windy”
                        },

                        ? 1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 1 / 2
                        • 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