MagicMirror Forum
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • 3rd-Party-Modules
    • Donate
    • Discord
    • Register
    • Login
    1. Home
    2. santiago5
    A New Chapter for MagicMirror: The Community Takes the Lead
    Read the statement by Michael Teeuw here.
    S
    Offline
    • Profile
    • Following 0
    • Followers 0
    • Topics 0
    • Posts 2
    • Groups 0

    santiago5

    @santiago5

    0
    Reputation
    208
    Profile views
    2
    Posts
    0
    Followers
    0
    Following
    Joined
    Last Online

    santiago5 Unfollow Follow

    Latest posts made by santiago5

    • RE: Changing icons of the modules Current Weather and Weather Forecast

      @PhilReis said in Changing icons of the modules Current Weather and Weather Forecast:

      I have add the other icons. But not all are properly positioned yet.
      And a there is no icon for fog.
      In the next few weeks I will position the icon correctly.
      This solution is maybe not the best but it works!

      Picture:

      0_1531077724549_Mirror.JPG

      For this icons you need this icon package:
      https://www.amcharts.com/free-animated-svg-weather-icons/

      Copy the icon from the folder “animated” to the folder “MagicMirror/css/icons”

      Then you have to add this code to your “custom.css” file.

      /* Aenderungen Wetter Icon */
      /* Aenderungen aktuelles Wetter */
      
      .currentweather .weathericon {
        position: absolute;
        z-index: 0;
        height: 200px;
        right: 180px;
        margin-top: -65px;
      }
      
      .currentweather .wi-day-sunny {
      content: url("/css/icons/day.svg");
      }
      
      .currentweather .wi-day-cloudy {
      content: url("/css/icons/cloudy-day-1.svg");
      }
      
      .currentweather .wi-rain {
      content: url("/css/icons/rainy-6.svg");
      }
      
      .currentweather .wi-night-clear {
      content: url("/css/icons/night.svg");
      }
      
      .currentweather .wi-night-cloudy {
      content: url("/css/icons/cloudy-night-2.svg");
      padding-right: 15px;
      padding-top: 10px;
      }
      
      .currentweather .wi-cloudy {
      content: url("/css/icons/cloudy.svg");
      }
      
      .currentweather .wi-showers {
      content: url("/css/icons/rainy-7.svg");
      }
      
      .currentweather .wi-thunderstorm {
      content: url("/css/icons/thunder.svg");
      }
      
      .currentweather .wi-snow {
      content: url("/css/icons/snowy-6.svg");
      }
      
      .currentweather .wi-cloudy-windy {
      content: url("/css/icons/cloudy-day-3.svg");
      }
      
      .currentweather .wi-night-rain {
      content: url("/css/icons/rainy-6.svg");
      }
      
      .currentweather .wi-night-snow {
      content: url("/css/icons/snowy-6.svg");
      }
      
      .currentweather .wi-night-thunderstorm {
      content: url("/css/icons/thunder.svg");
      }
      
      .currentweather .wi-night-showers {
      content: url("/css/icons/rainy-7.svg");
      }
      
      .currentweather .wi-fog {
      content: url("/css/icons/cloudy.svg");
      }
      
      .currentweather .wi-night-alt-cloudy-windy {
      content: url("/css/icons/cloudy-night-1.svg");
      }
      
      /* Aenderungen Wettervorhersage */
      
      .weatherforecast .weathericon {
        position: absolute;
        left: 35px;
        z-index: 1;
        margin-top: -30px;
        height: 60px;
      }
      
      .weatherforecast .wi-day-sunny {
      content: url("/css/icons/day.svg");
      padding-left: 6px;
      padding-top: 5px;
      height: 50px;
      }
      
      .weatherforecast .wi-day-cloudy {
      content: url("/css/icons/cloudy-day-1.svg");
      }
      
      .weatherforecast .wi-rain {
      content: url("/css/icons/rainy-6.svg");
      padding-left: 8px;
      padding-top: 5px;
      height: 45px;
      }
      
      .weatherforecast .wi-night-clear {
      content: url("/css/icons/night.svg");
      }
      
      .weatherforecast .wi-night-cloudy {
      content: url("/css/icons/cloudy-night-2.svg");
      height: 50px;
      padding-left: 5px;
      padding-top: 7px;
      }
      
      .weatherforecast .wi-cloudy {
      content: url("/css/icons/cloudy.svg");
      }
      
      .weatherforecast .wi-showers {
      content: url("/css/icons/rainy-7.svg");
      }
      
      .weatherforecast .wi-thunderstorm {
      content: url("/css/icons/thunder.svg");
      }
      
      .weatherforecast .wi-snow {
      content: url("/css/icons/snowy-6.svg");
      }
      
      .weatherforecast .wi-cloudy-windy {
      content: url("/css/icons/cloudy-day-3.svg");
      height: 45px;
      padding-left: 8px;
      padding-top: 7px;
      }
      
      .weatherforecast .wi-night-rain {
      content: url("/css/icons/rainy-6.svg");
      padding-left: 8px;
      padding-top: 5px;
      height: 45px;
      }
      
      .weatherforecast .wi-night-snow {
      content: url("/css/icons/snowy-6.svg");
      }
      
      .weatherforecast .wi-night-thunderstorm {
      content: url("/css/icons/thunder.svg");
      }
      
      .weatherforecast .wi-night-showers {
      content: url("/css/icons/rainy-7.svg");
      }
      
      .weatherforecast .wi-fog {
      content: url("/css/icons/cloudy.svg");
      }
      
      .weatherforecast .wi-night-alt-cloudy-windy {
      content: url("/css/icons/cloudy-night-1.svg");
      height: 50px;
      padding-left: 5px;
      padding-top: 7px;
      }
      

      As I said not completely finished.

      Hello anyone, if i have a icon packs named sun.mov, rain.mov, etc, can i put the pack in /css/icons and use the same code but changing the url (and maybe padding)?
      from content: url("/css/icons/day.svg"), to content: url("/css/icons/sun.mov"); or i need something else?
      i don’t know how coding :smiling_face_with_open_mouth_cold_sweat:

      posted in Development
      S
      santiago5
    • RE: MMM-Profile

      hello, how i can load .jpg file locally?

      i tried:

      url:"/home/pi/MagicMirror/modules/MMM-Profile/xxxx.jpg" 
      

      but it doesn’t load image

      posted in Utilities
      S
      santiago5