• 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
    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