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.

    Weatherunderground - currently - hourly - daily - configurable

    Scheduled Pinned Locked Moved Utilities
    182 Posts 47 Posters 357.6k Views 51 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.
    • J Offline
      j.e.f.f Project Sponsor Module Developer @Fonfon
      last edited by

      @Fonfon That’s the default for MMM-WunderGround, using the custom styles I posted above. Here’s my config:

          {
              module: 'MMM-WunderGround',
              position: 'top_right',
              config: {
                  apikey: 'my_api_key', // private; don't share!
                  pws: 'pws:IONTORON421',
                  hourly: '1',
                  fctext: '1',
                  fcdaycount: "5",
                  fcdaystart: "0",
                  hourlyinterval: "3",
                  hourlycount: "2",
                  alerttime: 10000,
                  alerttruncatestring: "english:",
                  roundTmpDecs: 1,
                  UseCardinals: 0,
                  layout: "vertical",
                  sysstat: 0,
                  coloricon: true,
              }
          },
      
      F 1 Reply Last reply Reply Quote 0
      • F Offline
        Fonfon @j.e.f.f
        last edited by

        @j.e.f.f ok layout change i’m in a horizontale style not verticale
        thanks man ;)

        1 Reply Last reply Reply Quote 0
        • F Offline
          fredall
          last edited by

          Hi is it possible to combine the horizontal view for the hourly forecast and vertical for daily ?

          1 Reply Last reply Reply Quote 0
          • M Offline
            maestro82
            last edited by

            What variables control the size of the large current weather icon and the small forecast icons? I was trying to make the current icon slightly smaller and have somehow managed to make the forecast icon micro sized. Can’t seem to get it back now.

            Thanks,

            M 1 Reply Last reply Reply Quote 0
            • M Offline
              maestro82 @maestro82
              last edited by

              @maestro82 Got it, a little trail and error.

              Mykle1M 1 Reply Last reply Reply Quote 1
              • Mykle1M Offline
                Mykle1 Project Sponsor Module Developer @maestro82
                last edited by

                @maestro82 said in Weatherunderground - currently - hourly - daily - configurable:

                Got it, a little trail and error.

                Perhaps you’ll share what you have done so that others might benefit from your experience? :-)

                Create a working config
                How to add modules

                M 1 Reply Last reply Reply Quote 0
                • M Offline
                  maestro82 @Mykle1
                  last edited by

                  @Mykle1
                  So by playing (I do mean playing as I am a newbie) with the MMM_WunderGround.css file, discovered:

                  .MMM-WunderGround .weather-icon (is the small forecast icon)
                  I was able to adjust size by changing the width.

                  .MMM-WunderGround .currentWeatherIcon (is large symbol next to current temp)
                  I was able to adjust the width and height % to change size.

                  1 Reply Last reply Reply Quote 1
                  • Mykle1M Offline
                    Mykle1 Project Sponsor Module Developer
                    last edited by

                    Well done mate!

                    Create a working config
                    How to add modules

                    1 Reply Last reply Reply Quote 0
                    • M Offline
                      maestro82
                      last edited by

                      Myke1

                      Can’t seem to figure out what controls font size of the forecasted precipitation % field. Any hints?

                      Thanks

                      Mykle1M 1 Reply Last reply Reply Quote 0
                      • Mykle1M Offline
                        Mykle1 Project Sponsor Module Developer @maestro82
                        last edited by

                        @maestro82 said in Weatherunderground - currently - hourly - daily - configurable:

                        Any hints?
                        You can play with these in your custom.css file. GO crazy!

                        .MMM-WunderGround .weathericon {
                          font-size: 45%;
                          line-height: 5px;
                          display: inline-block;
                          -ms-transform: translate(0, -3px); /* IE 9 */
                          -webkit-transform: translate(0, -3px); /* Safari */
                          transform: translate(0, -3px);
                        } 
                        .MMM-WunderGround .day {
                          padding-left: 0;
                        #  padding-right: 10px;
                        }
                        
                        .MMM-WunderGround .vcen {
                           vertical-align: top;
                        }
                        
                        .MMM-WunderGround .weather-icon {
                          padding-left: 0px;
                          text-align: center;
                          width:50px; 
                        }
                        
                        .MMM-WunderGround .max-temp {
                          padding-left: 0px;
                          padding-right: 0;
                        }
                        
                        .MMM-WunderGround .min-temp {
                        #  padding-left: 10px;
                        #  padding-right: 0;
                        }
                        
                        .MMM-WunderGround .forecastText {
                        # padding-left: 10px;
                        #  padding-right: 0;
                        #  word-wrap: break-word;
                        #  text-align: right;
                        #  rowspan: 0;
                        }
                        
                        .MMM-WunderGround .tableheader {
                          font-size: 75%;
                          text-align: center;
                        } 
                        
                        .MMM-WunderGround .hour {
                          font-size: 75%;
                          text-align: center;
                         } 
                        
                        .MMM-WunderGround .pop {
                          font-size: 86%;
                        } 
                        .MMM-WunderGround .mm {
                          font-size: 75%;
                        } 
                        
                        .MMM-WunderGround .green {
                          color: #83FFB3;
                        }
                        
                        .MMM-WunderGround .yellow {
                          color: yellow;
                        }
                        
                        .MMM-WunderGround .red {
                          color: #FF4C4C;
                        }
                        
                        .MMM-WunderGround .center {
                        	text-align: center;
                        	padding-right: 10px; 
                        }
                        	
                        .MMM-WunderGround .left {
                        	text-align: left;
                        }
                        
                        .MMM-WunderGround .lpad {
                        	padding-left: 10px; 
                        }
                        
                        .MMM-WunderGround .currentWeatherIcon {
                          font-size: 75%;
                          line-height: 45px;
                          display: inline-block;
                          -ms-transform: translate(0, -3px); /* IE 9 */
                          -webkit-transform: translate(0, -3px); /* Safari */
                          transform: translate(0, -3px);
                          width: 40%;
                          height: 40%;
                        } 
                        
                        .MMM-WunderGround .forecastWeatherIcon {
                          font-size: 75%;
                          line-height: 65px;
                          display: inline-block;
                          -ms-transform: translate(0, -3px); /* IE 9 */
                          -webkit-transform: translate(0, -3px); /* Safari */
                          transform: translate(0, -3px);
                          width: 50%;
                        } 
                        
                        .MMM-WunderGround .moonPhaseIcon {
                          height: 34px;
                          vertical-align: middle;
                        } 
                        
                        .MMM-WunderGround .hrDivider {
                                font-size: 10px;
                        }
                        
                        .MMM-WunderGround .sub {
                            vertical-align: sub;
                            font-size: smaller;
                        }
                        
                        .MMM-WunderGround .smaller {
                            font-size: 60%;
                        }
                        
                        

                        Create a working config
                        How to add modules

                        M 1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 15
                        • 16
                        • 17
                        • 18
                        • 19
                        • 17 / 19
                        • 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