• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
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.

MMM-WunderGround24Hours: How to set transparent background?

Scheduled Pinned Locked Moved Troubleshooting
9 Posts 4 Posters 4.1k Views 4 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.
  • U Offline
    Unknown @doubleT
    last edited by Jan 7, 2018, 4:30 PM

    @doubleT: Thx. “background: none;” is working in the main.css file. I deleted the whole “background: #000;” entry which was not working…

    I don’t understand why my /home/pi/MagicMirror/css/custom.css is not working :-(

    
    /*****************************************************
     * Magic Mirror                                      *
     * Custom CSS                                        *
     *                                                   *
     * By Michael Teeuw http://michaelteeuw.nl           *
     * MIT Licensed.                                     *
     *                                                   *
     * Add any custom CSS below.                         *
     * Changes to this files will be ignored by GIT. *
     *****************************************************/
    
     body, html {
            background: none;
     }
    
    
    
    M 1 Reply Last reply Jan 7, 2018, 4:42 PM Reply Quote 0
    • M Offline
      Mykle1 Project Sponsor Module Developer @Unknown
      last edited by Jan 7, 2018, 4:42 PM

      @Unknown

      html {
        background: none;
      }
      

      Create a working config
      How to add modules

      1 Reply Last reply Reply Quote 0
      • U Offline
        Unknown
        last edited by Jan 7, 2018, 5:23 PM

        @Mykle1 said in MMM-WunderGround24Hours: How to set transparent background?:

        html {
        background: none;
        }

        still not working with modifikation in custom.css… If I change it in Main.css in the module it self it works fine.

        pi@MagicMirror2:/home/pi/MagicMirror/css# cat custom.css
        
        /*****************************************************
         * Magic Mirror                                      *
         * Custom CSS                                        *
         *                                                   *
         * By Michael Teeuw http://michaelteeuw.nl           *
         * MIT Licensed.                                     *
         *                                                   *
         * Add any custom CSS below.                         *
         * Changes to this files will be ignored by GIT.     *
         *****************************************************/
        
        html {
          background: none;
        }
        
        pi@MagicMirror2:/home/pi/MagicMirror/modules/MMM-WunderGround24Hours/public/css# head main.css
        body, html {
                background: #000;
                padding: 0px;
                margin: 0px;
                width:100%;
                height: 100%;
        
                letter-spacing: -2px;
                color: #fff;
                font-size: 75px;
        
        
        1 Reply Last reply Reply Quote 0
        • D Offline
          doubleT Module Developer
          last edited by doubleT Jan 7, 2018, 5:41 PM Jan 7, 2018, 5:26 PM

          The module’s css file is the last one to be called so its values override that of the custom.css. I should have mentioned that. You can try

          body, html {
          	background: none !important;
          }
          

          Changing settings of items not within the module is bad practice imho and shouldn’t be done (read: setting the main background when the module’s css should only do stuff within the module itself), but customizing within the module is also bad practice. And lastly, using !important is also not best practice, but in this case, I think we need to use it.

          Edit: Disregard that. I just saw that it’s an iframe.
          You have to change the module’s main.css. Usually, you cannot set css values in the content of the iframe (though I’m not 100% sure in this case, where it’s both within the same domain) without some jQuery and I guess you don’t want to build a module just to style another module. ;)

          1 Reply Last reply Reply Quote 0
          • U Offline
            Unknown
            last edited by Jan 7, 2018, 6:30 PM

            Ah, now I understand. Many Thanks!

            1 Reply Last reply Reply Quote 0
            • T Offline
              thobach
              last edited by Mar 16, 2019, 12:05 PM

              Please note this module was migrated to use the Dark Sky API and is now available as “MMM-DarkSky24Hours” under https://github.com/thobach/MMM-DarkSky24Hours.

              1 Reply Last reply Reply Quote 0
              • T Offline
                thobach
                last edited by Mar 16, 2019, 12:08 PM

                Please note this module was migrated to use the Dark Sky API and is now available as “MMM-DarkSky24Hours” under https://github.com/thobach/MMM-DarkSky24Hours.

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