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.

    multiple modules in a region

    Scheduled Pinned Locked Moved Unsolved Troubleshooting
    42 Posts 5 Posters 15.7k Views 5 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.
    • M Offline
      MMRIZE @roth_nj
      last edited by MMRIZE

      @roth_nj
      That is not faded. It only assigns a pale blue colour to Saturday on cellHeader in CSS.
      You can find .weekday_6 things in MMM-CalendarExt3.css then override it in your custom.css.

      .CX3 .weekday_6 {
        color: #339;
      }
      

      And long-full-day name looks somewhat ugly, So you’d better consider headerWeekDayOptions: "short", or “narrow”.

      R 2 Replies Last reply Reply Quote 0
      • R Offline
        roth_nj @MMRIZE
        last edited by

        @MMRIZE
        a little misunderstanding here. i am talking about this zone at the wallpaper background to the calendar.

        i already changed the sunday red and saturday blue to both be white at this point

        1 Reply Last reply Reply Quote 0
        • R Offline
          roth_nj @MMRIZE
          last edited by

          @MMRIZE

          1b2f61c0-36e1-48fd-bf4c-13341d8438e5-image.png

          M 1 Reply Last reply Reply Quote 0
          • M Offline
            MMRIZE @roth_nj
            last edited by

            @roth_nj
            See “.region.top.bar”. I put a gradient layer there.

            R 1 Reply Last reply Reply Quote 0
            • R Offline
              roth_nj @MMRIZE
              last edited by

              @MMRIZE

              bingo… awesome thanks again. I was looking for anything with fade. gradient makes sense — I’m not a programmer in any sense. after changing that, I spread the wallpaper out to 40% but left the calendar overlapping a little bit still at 66%

              its getting real close now. but like I said I’m not going to mess with too much more until I get it up on my pi+monitor

              thanks again for the help

              22378d8d-0e62-4506-87c5-b0ba0d0367a6-image.png

              BKeyportB 1 Reply Last reply Reply Quote 0
              • BKeyportB Offline
                BKeyport Module Developer @roth_nj
                last edited by

                @roth_nj Been playing around, and here’s what I came up with.

                alt text

                The "E" in "Javascript" stands for "Easy"

                1 Reply Last reply Reply Quote 0
                • R Offline
                  roth_nj
                  last edited by

                  @MMRIZE it got my pi programmed and the mirror up and running on the screen. i have started doing some minor graphical tweaks like font/color/size etc and changed the 33% wallpaper size to 40%… all that stuff is pretty clear to me on what/where to edit and theres a ton of into on the forum/github

                  i have a couple follow up questions for you now: i want to adjust the position of the calendar top and clock. you can see in this picture that they are off set from the “top” of the screen. i want to get them to the edge. thanks again

                  1 Reply Last reply Reply Quote 0
                  • R Offline
                    roth_nj
                    last edited by

                    62cb8a94-3900-40c5-bf6a-5ab709cce016-image.png

                    1 Reply Last reply Reply Quote 0
                    • R Offline
                      roth_nj
                      last edited by sdetweil

                      i was able to fix the clock alignment. digging into the custom.css, i found that the top right and top left were formatted the same. i split them out and modified the top left to alight and fix the position:

                      .region.top.left {
                        box-sizing: border-box;
                        text-align: right;
                        top: 20px;
                        right: 20px;
                        position: absolute;//unset
                      }
                      
                      .region.top.right {
                        box-sizing: border-box;
                        text-align: right;
                        bottom: 0;
                        position: unset;
                      }
                      
                      S 1 Reply Last reply Reply Quote 0
                      • S Offline
                        sdetweil @roth_nj
                        last edited by sdetweil

                        @roth_nj please try to use the code block wrapper for css and js

                        paste stuff into post, select pasted
                        hit the </> button

                        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
                        • 4
                        • 5
                        • 3 / 5
                        • 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