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

    Scheduled Pinned Locked Moved Utilities
    486 Posts 83 Posters 827.4k Views 83 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 @Turtle
      last edited by

      @Turtle no. Custom.css is no longer tracked, so u won’t lose it. The updater script also saves it.

      Custom.css starts out empty, so u add whatever u need.

      Sam

      How to add modules

      learning how to use browser developers window for css changes

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

        @Turtle find what you want to modify in the existing css files, then copy them over to custom.css - example:

        
        /* Bottom Bar Adjustments */
        .region.bottom.bar {
        	background-color:rgba(0,0,0,.90);
        }
        
        /* Left adjustments */
        .region.left {
        	text-align: center;
        }
        

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

        1 Reply Last reply Reply Quote 0
        • T Offline
          Turtle
          last edited by

          Thank you @sdetweil and @BKeyport for the information.

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

            @Sean Is there a way to center the title for “daily” view? Normally, I’d just use .css for the region, but that doesn’t work with your module.

            Thanks!

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

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

              @BKeyport
              @BKeyport
              what kind of title? event title like this?
              https://www.dropbox.com/s/qa0zow00cjs8hsf/a1.png?dl=0

              .CX2 .daily .eventTitle {
                text-align:center;
              }
              
              BKeyportB 1 Reply Last reply Reply Quote 0
              • M Offline
                Marcel1803
                last edited by

                Hi,
                i’m looking for a daily view with 5 days in one row/line. The default for the daily-view seems to be one day per row.
                Is there a possibility to show the days in one row?

                I also tried the week-vie

                Thanks,
                Marcel

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

                  @Marcel1803

                  views: [
                    {
                      mode: "daily",
                      type: "row",
                      position:"bottom_bar",
                      slotCount: 5,
                      ...
                  

                  Maybe some additional CSS adjusting might be needed for your environment, but basic concept is that.
                  https://www.dropbox.com/s/oyc8y6qyuiclqia/cal.png

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

                    @Sean No… I can’t post screen shots, but the overall title at the top of the view referenced here:

                    views: [
                    		{
                    			mode: "daily",
                    			**title: "Upcoming Events",**
                    			...
                    

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

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

                      @BKeyport
                      https://www.dropbox.com/s/3jvy3hlz5pdwmi9/mm_cx2_align.png?dl=0
                      As you can see in the bottom region, module header will respect the region align itself by default.
                      Usually, if you want to override the align of module header of a specific module, you can just do like this;

                      .MMM-CalendarExt2 header.module-header {
                        text-align:center;
                      }
                      

                      This CalendarExt2 is using a trick of fake-module for each view, so above CSS rule would make module header of all views to text-align:center;

                      If you want to specify the view in some region, Check this. (See the red titled view on the top right corner)

                      .region.top.right .MMM-CalendarExt2 header.module-header {
                        text-align:left;
                        color:#F00;
                        font-weight:bold;
                      }
                      

                      Be careful about white-space between CSS selectors.

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

                        @Sean Odd - I originally had it for both left and right regions (I like centered headers on a display) as

                        .region.right {
                          text-align:center;
                        }
                        
                        .region.left {
                          text-align:center;
                        }
                        

                        and it didn’t work. Now, once I put that back in, it works.

                        Okay then, Moving on…

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

                        1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 28
                        • 29
                        • 30
                        • 31
                        • 32
                        • 48
                        • 49
                        • 30 / 49
                        • 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