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

    Scheduled Pinned Locked Moved Productivity
    198 Posts 45 Posters 210.2k Views 45 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.
    • V Offline
      Vauxdvihl
      last edited by

      @Sean
      Thanks a lot
      In custom css file a have the following:

      div.CALEXT  .event .symbol {
          order:1;
          display:block;
          flex-basis: 30px; // Modify this 
          text-align:center;
          min-width: 50px; // Modify this
          font-size: 150%; // Add this
      							}			
      					
      							
      div.CALEXT .events .symbol.emoji {
          font-size: 150%; //Adjust this as your wish. you can use px or %
      								}
      								
      div.CALEXT .events .symbol.font-awesome {
          font-size: 250%; //Adjust this as your wish. you can use px or %
      										}
      div.CALEXT .tableStyle .eventTime {
          display:block;	
      									}		
      .CALEXT .eventTime {
        font-size: 80%;
        line-height:110%;
      					}
      
      .CALEXT .eventContent {
        font-size: 250%;
        line-height:110%;
      					}	
      

      The adjustment of time works fine.
      But not of the initial content.

      Sorry
      But can you please help again

      Thanks a lot

      ? 1 Reply Last reply Reply Quote 0
      • ? Offline
        A Former User @Vauxdvihl
        last edited by A Former User

        @vauxdvihl
        Because your other CSS rules might override that rule. (Simpler rule name might have lower priority). See this. https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

        Anyway, you can use like this;

         div.CALEXT div.slot div.eventsBoard div.eventContainer div.eventContent {
           font-size: 250%;
           line-height:110%;
         }
        

        (For more exact rule specificity, I should know whole CSS of your MM, but I believe above code enough)

        1 Reply Last reply Reply Quote 0
        • Y Offline
          yoey2112
          last edited by

          Hello @Sean ,
          Been playing around with this module for a day now (not very savvy with javascript) and I cannot figure out how to increase the size of my Calendar. I’m using weeks (4 count) and position bottom_bar, but I would like it to take up about a third of the bottom (vertical monitor). I know this must be a change in CSS, but I dont know what to do. Any help would be great!
          -Yoey

          ? 1 Reply Last reply Reply Quote 0
          • ? Offline
            A Former User @yoey2112
            last edited by

            @yoey2112
            Which parts do you want to grow up? More details I need to help. Image could be a help.

            1 Reply Last reply Reply Quote 0
            • Y Offline
              yoey2112
              last edited by

              0_1539723972022_Capture.PNG

              So 2 things really. I’d like the Calendar to take up the entire bottom 3rd of the screen.

              Second, any suggestions on making it look a little popping?

              Thanks!

              justjim1220J 2 Replies Last reply Reply Quote 0
              • justjim1220J Offline
                justjim1220 Module Developer @yoey2112
                last edited by justjim1220

                @yoey2112

                May I ask how you were able to show blank events?

                mine looks like this, all jumbled up and no blanks…

                0_1539726471688_Screenshot (380).png

                "Life's Too Short To Dance With Ugly People"
                Jim Hallock - 1995

                1 Reply Last reply Reply Quote 0
                • justjim1220J Offline
                  justjim1220 Module Developer @yoey2112
                  last edited by

                  @yoey2112

                  0_1539728703203_Screenshot (381).png

                  add the following to your custum.css file

                   #CALEXT_month.tableStyle {
                    max-width:100%;
                    width:100%;
                    background:none;
                  }
                  

                  "Life's Too Short To Dance With Ugly People"
                  Jim Hallock - 1995

                  1 Reply Last reply Reply Quote 0
                  • justjim1220J Offline
                    justjim1220 Module Developer
                    last edited by

                    @Sean

                    Do you see the calendar posted above by @yoey2112 ?

                    It has blank events instead of collapsed events, I am wanting mine to look like that!

                    But, I can’t figure out how to get it done!

                    "Life's Too Short To Dance With Ugly People"
                    Jim Hallock - 1995

                    ? 1 Reply Last reply Reply Quote 0
                    • Y Offline
                      yoey2112
                      last edited by

                      @justjim1220 I added that to my custom CSS but its still fairly small, a little bigger though. Is there any way to adjust the height of that location as well?

                      justjim1220J 1 Reply Last reply Reply Quote 0
                      • justjim1220J Offline
                        justjim1220 Module Developer @yoey2112
                        last edited by

                        @yoey2112

                        what did you add? I have been looking to do this!

                        the height is self-adjusting per the font sizes and line heights for the table cells.

                        May be able to figure out a better way if I had the code you used to get the empty cells to show like that.

                        "Life's Too Short To Dance With Ugly People"
                        Jim Hallock - 1995

                        1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 10
                        • 11
                        • 12
                        • 13
                        • 14
                        • 19
                        • 20
                        • 12 / 20
                        • 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