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

Maximizing Screen Use with MMM-CalendarExt2 and Custom.css

Scheduled Pinned Locked Moved Solved Troubleshooting
9 Posts 2 Posters 2.8k 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.
  • C Offline
    CliffordW @Guest
    last edited by CliffordW Sep 30, 2019, 2:54 PM Sep 30, 2019, 2:27 PM

    @Sean Thanks for your reply Sean. I’ve tried both fullscreen_below and fullscreen_above and both have an identical look. Any other suggestions how to remove the blank margin at the top?

    If I change slotcount from 3 to 4, the first couple of lines from the top are chopped off.

    ```
    

    modules: [

    	{
    		module: 'MMM-CalendarExt2',
    		  config: {
    			calendars : [
    			
    			  { 
    				name: "BNC Rentals", 
    				// url: "https://calendar.google.com/calendar/ical/en.canadian%23holiday%40group.v.calendar.google.com/public/basic.ics",
    				url: "https://calendar.google.com/calendar/ical/rentalsthebnc%40gmail.com/private-xxxxxxxxxxxxx/basic.ics"
    			},
    			],
    			views: [
    			{
    				Name: "Rentals",
    				title: "BNC Rentals",
    				mode: "week",			
    				position: "fullscreen_below",
    				calendars: ["BNC Rentals"],
    				useEventTimeRelative: true,
    				slotCount: 3,
    				slotTitle: "",
    				slotMaxHeight: "150px",
    				slotSubTitle: "",
    				slotTitleFormat: "MMM:DD",
    				slotSubTitleFormat: "MMM:DD",
    				subslotTitleFormat: "MMM:DD",
    				maxItems: 200,
    				hideOverflow: false,
    				relativeFormat: {
    					passed: "ended %ENDFROMNOW%",
    					current: "ends %ENDFROMNOW%",
    					future: "starts %STARTFROMNOW% (%DURATION%)"
    				},
    
    			
    			}
    			],
    			scenes: [
    			  {
    				name: "DEFAULT",
    				views: [],
    			  },
    			],
    
    		 }
    
    	}		
    
    
    ]
    

    };

    ? 1 Reply Last reply Oct 1, 2019, 7:18 AM Reply Quote 0
    • ? Offline
      A Former User @CliffordW
      last edited by Oct 1, 2019, 7:18 AM

      @CliffordW
      week and month views are somewhat huge. You can adjust size by CSS or set slotMaxHeight to smaller values.

      C 1 Reply Last reply Oct 1, 2019, 7:13 PM Reply Quote 0
      • C Offline
        CliffordW @Guest
        last edited by Oct 1, 2019, 7:13 PM

        @Sean I’ve been looking at custom.css, and I admit it’s very new to me. Which value should I try changing to reduce the upper margin?

        ? 2 Replies Last reply Oct 1, 2019, 7:43 PM Reply Quote 0
        • ? Offline
          A Former User @CliffordW
          last edited by Oct 1, 2019, 7:43 PM

          @CliffordW
          By default, in fullscreen position, month and week view will be positioned to the bottom of the screen.

          MMM-CalendarExt2.css

          .fullscreen .CX2 { /* when the view is located on `fullscreen_below` or `fullscreen_above` */
            position:fixed;
            bottom: 10px; 
            margin: 20px;
            width:calc(100vw - 40px);
          }
          

          So you can redefine this section in your css/custom.css but not recommended.

          C 1 Reply Last reply Oct 1, 2019, 11:20 PM Reply Quote 0
          • ? Offline
            A Former User @CliffordW
            last edited by Oct 1, 2019, 7:44 PM

            @CliffordW
            If what you want is just enlarge the height, set slotMaxHeight to bigger value.

            C 1 Reply Last reply Oct 1, 2019, 8:47 PM Reply Quote 0
            • C Offline
              CliffordW @Guest
              last edited by Oct 1, 2019, 8:47 PM

              @Sean I’d like to be able show 4 rows instead of 3. There is a considerable amount of unused space at the top of the monitor, so I’d like to reduce (remove) this margin at the top.

              I hope I’m making sense.

              1 Reply Last reply Reply Quote 0
              • C Offline
                CliffordW @Guest
                last edited by Oct 1, 2019, 11:20 PM

                @Sean Thanks for the guidance. I missed it the first time. Considering this pi is a single function, I might just give this a shot.

                1 Reply Last reply Reply Quote 0
                • 1 / 1
                1 / 1
                • First post
                  7/9
                  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