Navigation

    MagicMirror Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • Donate
    • Discord

    Current Weather and Weather Forecast looks grey out.

    Custom CSS
    6
    24
    290
    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.
    • N
      negrito Project Sponsor last edited by

      I need help? What do I need to put in to the custom.css or config.js to get all the in red circled text in white colour, because it looks gray out. Thank you in advance.

      default module Current Weather and Weather Forecast.jpg

      1 Reply Last reply Reply Quote 0
      • hango
        hango Module Developer last edited by

        in custom.css put:

        .normal {
            color: white;
        }
        
        1 Reply Last reply Reply Quote 0
        • N
          negrito Project Sponsor last edited by

          Do I need to specify something about the Current Weather and Weather Forecast? Because only adding that to the custom.css makes no difference it stays gray.

          1 Reply Last reply Reply Quote 0
          • hango
            hango Module Developer last edited by

            You can try

            .currentweather .normal,
            .weatherforecast .normal {
                color: white;
            }
            

            or

            .normal {
                color: white !important;
            }
            
            1 Reply Last reply Reply Quote 0
            • N
              negrito Project Sponsor last edited by

              first of all I would like to emphasize that I really appreciate your help. I’ve tried both, but no change. I cleared the settings for color icons to see if it worked, but nothing. See my custom.css here…

              20210130_143515.jpg

              .newsfeed .small {
              font-size: 30px;
              line-height: 25px;
              }
              
              .newsfeed .medium {
              font-size: 35px;
              line-height: 30px;
              }
              
              .clock .date {
              	color: #fff;
              }
              
              .calendar td {
              color: #fff;
              }
              
              .calendar .header {
              	color: #fff;
              }
              .MMM-COVID19-SPARKLINE{
                color:#fff;
              }
              
              .calendar .time {
                color:#fff;
              }
              
              .normal {
                  color: white !important;
              }
              
              1 Reply Last reply Reply Quote 0
              • hango
                hango Module Developer last edited by hango

                The rest of custom.css works?

                1 Reply Last reply Reply Quote 0
                • N
                  negrito Project Sponsor last edited by

                  Yes, the rest of the custom.css is working an here is the config.js part for that:

                  		{
                  			module: "currentweather",
                  			position: "top_right",
                  			config: {
                  				location: "Heemskerk",
                  				locationID: "2754696",
                  				appid: "key removed"
                  			}
                  		},
                  		{
                  			module: "weatherforecast",
                  			position: "top_right",
                  			header: "",
                  			config: {
                  				location: "Heemskerk",
                  				locationID: "2754696",
                  				appid: "key removed",
                  				fade: false
                  			}
                  		},
                  
                  
                  1 Reply Last reply Reply Quote 0
                  • hango
                    hango Module Developer last edited by hango

                    you can set custom.css in config.js

                    1 Reply Last reply Reply Quote 0
                    • N
                      negrito Project Sponsor last edited by

                      I don’t have any reference to the custom.css in my config.js I feel bad al ready😞

                      hango 1 Reply Last reply Reply Quote 0
                      • hango
                        hango Module Developer @negrito last edited by

                        @negrito put in your config.js after all global settings the custom.css path

                        var config = {
                        ...
                        	language: "en",
                        	timeFormat: 24,
                        	units: "metric",
                        	customCss: "css/custom.css",
                        ...
                        
                        S 1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 3
                        • 1 / 3
                        • First post
                          Last post
                        Enjoying MagicMirror? Please consider a donation!
                        MagicMirror created by Michael Teeuw.
                        Forum managed by Paul-Vincent Roll and Rodrigo Ramírez Norambuena.
                        This forum is using NodeBB as its core | Contributors
                        Contact | Privacy Policy