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.

    Needing help with Regions please

    Scheduled Pinned Locked Moved Custom CSS
    5 Posts 2 Posters 233 Views 2 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.
    • X Offline
      Xsoldier2000
      last edited by

      [alt text](MM Help.png image url)

      I’m trying to :

      1. Make the padding or margin around all my modules be like 1 pixel (custom css posted below) (edit: I had it stretched to the edges, made a couple changes to the css and lost the code to make it work)!
      2. Squish this bottom_right region down to just under the calendar and the css doesn’t seem to affect it.
      3. Make the bottom_center region right justified so the Current conditions are right next to the forcast

      I might not be doing things the right way, so if anyone has any better ideas, I’m all for learning.

      custom css:

        
        /* Region Definitions */
        .region .container .module {
        margin: 0px;
        background-color: rgba(0 0 0 /10);
        min-width: 300px;
        position: relative;
      }
        
        .region.top.right {
          position: absolute;
          width: 80%;
          height: 90%;
        }
         
       // .region.bottom.right {
          position: absolute;
          height: 30%;
          width: 16.5%;
        }
          
        .region.bottom.left {
          position: absolute;
          width: 16.5%;
        }
        
          .region.top.left {
          position: absolute;
          width: 16.5%;
        }
        
       .clock .time {
          font-size: 75px;
        }
      
        .anylist ul {
        margin: 0;
        font-size: 24px;
        padding: 0px;
        line-height: 25px;
        color: white;
      }
      
      
      S 2 Replies Last reply Reply Quote 0
      • S Away
        sdetweil @Xsoldier2000
        last edited by sdetweil

        @Xsoldier2000 we define the module padding in
        css/main.css

        --gap-modules: 30px;
        

        you can override those in custom.css

        you dont need to change the regions themselves

        you can move your module right too

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        1 Reply Last reply Reply Quote 1
        • S Away
          sdetweil @Xsoldier2000
          last edited by

          @Xsoldier2000 also see the second link in my signature below about using dev window

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          X 1 Reply Last reply Reply Quote 0
          • X Offline
            Xsoldier2000 @sdetweil
            last edited by Xsoldier2000

            @sdetweil yes, I was definitely the dev window, just didn’t know the terminology. Think I’ve read through your second link twice (might have nodded of there a couple times), but you pointed me in the right direction, thank you.

            S 1 Reply Last reply Reply Quote 0
            • S Away
              sdetweil @Xsoldier2000
              last edited by

              @Xsoldier2000 yeh, the dev window has a lot of content

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              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