Navigation

    MagicMirror Forum

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

    How to convert weatherforecast disaplay

    Troubleshooting
    3
    5
    1693
    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
      nobita last edited by

      I would like to convert weatherforecast (from Default module) form vertical to Horizontal like the photo.
      0_1494842981392_New Picture.jpg

      someone help me to convert, Thanks so much

      M kruemel 2 Replies Last reply Reply Quote 0
      • M
        mkastern @nobita last edited by

        @nobita Did you ever get this figured out?

        1 Reply Last reply Reply Quote 0
        • kruemel
          kruemel last edited by

          I did not tried but with MMM-MyWeather you can configure horizontal.
          Maybe it’s what you’r looking for 🙂

          M 1 Reply Last reply Reply Quote 0
          • M
            mkastern @kruemel last edited by

            @kruemel - I have used that version to display a horizontal table of the extended forecast, but it isn’t in a format that looks as nice as the above picture. I am considering modifying a different weather module that has better formatting, but was checking to see if someone else has already gone through that effort first.

            1 Reply Last reply Reply Quote 0
            • kruemel
              kruemel @nobita last edited by kruemel

              @mkastern Maybe you are still interested.
              I tested alot for an idea i had and now i just modified the weatherforecast.css to get this result (top left):
              0_1524943425646_screen-test.PNG

              Made this changes:

              td { 
                display: block;
                padding-right: 25px
              }
              tr { display: inline-block;}
              
              .weatherforecast .day {
                padding-left: 5px;
              }
              
              .weatherforecast .weather-icon {
                padding-left: 5px;
              }
              
              .weatherforecast .max-temp {
                
              }
              
              .weatherforecast .min-temp {
               
              }
              
              

              But keep in mind, after an update of MM, your changes get overwritten because it’s an integrated module!

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