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.

    Different order in center after Upgrade to 2.32

    Scheduled Pinned Locked Moved Unsolved Troubleshooting
    21 Posts 2 Posters 1.0k 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.
    • S Offline
      sdetweil @falter
      last edited by sdetweil

      @falter in my 2.31 I wanted rows in top left
      so I did this in custom.css

      .region.bar.top.left {
          display: inline-flex !important;
          flex-direction: row;
      }
      

      it still works in 2.32

      but this gives A row.

      I think you need display: grid;

      I think this will do it, this gives evenly spaced 3x2 grid
      for the top center position only

      .region.top.center .container {
              display: grid;
              grid-template-columns: repeat(3,1fr);
              grid-template-rows: repeat(2,1fr);
              gap:10px;
      }
      

      using the top left (my modules) using the developers window you can see the space of the grid
      Screenshot at 2025-07-05 09-47-53.png

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      F 1 Reply Last reply Reply Quote 0
      • F Offline
        falter @sdetweil
        last edited by

        @sdetweil said in Different order in center after Upgrade to 2.32:

        .region.top.center .container {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        grid-template-rows: repeat(2,1fr);
        gap:10px;
        }

        Thanks for the effort, unfortunatly this does not change anything visible.
        The Video-Module uses this css, if that helps. I just added the fist width (else the video is too big for 2 coloumns, and changed the second one, so I have a little gap between them:

        .MMM-RTSPtoWeb {
          width: 38%;
          display: inline-block;
        }
        
        .region .rtw-video {
          width: 98%;
          display: block;
        }
        
        .rtw-error {}
        
        

        If I leave the css of the module untouched and put the above in custom.css, is does not apply. But that’s another story; as I said don’t know css, or better, understand…

        S 1 Reply Last reply Reply Quote 0
        • S Offline
          sdetweil @falter
          last edited by

          @falter I can’t help more, can’t use module here, no cameras.

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          F 1 Reply Last reply Reply Quote 1
          • F Offline
            falter @sdetweil
            last edited by

            @sdetweil thanks anyway, at least I found out about the change in main.css, so I can keep using the recent version, which was most important. I just have to apply this change after future updates, which I can live with.

            1 Reply Last reply Reply Quote 0
            • F Offline
              falter
              last edited by

              ahh, and not that I expect the effort, just for completeness: one could test the module without a camera, you just need a RTSPtoWeb stream…

              S 1 Reply Last reply Reply Quote 0
              • S Offline
                sdetweil @falter
                last edited by

                @falter same thing to Me,
                another ditch I dont need to go into! Lol

                Sam

                How to add modules

                learning how to use browser developers window for css changes

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