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

MMM-Lunartic

Scheduled Pinned Locked Moved Education
266 Posts 30 Posters 403.6k Views 29 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.
  • B Offline
    BD0G
    last edited by Nov 17, 2019, 4:49 AM

    I am using the current view of the moon. I have the module working. I just need to remove the line over the moon image and center the text that states “Moon Phase” to line it up in the center over the moon image.

    M 1 Reply Last reply Nov 17, 2019, 4:09 PM Reply Quote 0
    • M Offline
      Mykle1 Project Sponsor Module Developer @BD0G
      last edited by Nov 17, 2019, 4:09 PM

      @BD0G

      These entries in your custom.css file should help you with that. Adjust the values to your satisfaction

      .MMM-Lunartic .xsmall.bright {
        font-size:22px;
      }
      
      .MMM-Lunartic img.photo {
      /*  display: none;              uncomment if you don't want an image */
        width: 100%;                /* adjust size of moon picture */
        margin-left: 0px;          /* Precisely align moon picture with these */
        margin-right: 0px;
        margin-top: 0px;         /* -41px for current. -21px for animation or static. */
        margin-bottom: -11px;      /* -51px for current. -21px for animation or static. */
      }
      

      Create a working config
      How to add modules

      B 1 Reply Last reply Nov 18, 2019, 3:36 AM Reply Quote 0
      • B Offline
        BD0G @Mykle1
        last edited by BD0G Nov 19, 2019, 12:22 AM Nov 18, 2019, 3:36 AM

        @Mykle1 Thanks.

        I have currently adjusted those settings from within my Lunartic.css file and they do change where the text and moon image are positioned. I cannot find a way to remove the horizontal line over the moon image.

        I currently only have a main.css file, but I am assuming I can just create a blank custom.css file and place it in the MagicMirror/css directory and that will work?

        M 1 Reply Last reply Nov 18, 2019, 10:48 PM Reply Quote 0
        • M Offline
          Mykle1 Project Sponsor Module Developer @BD0G
          last edited by Mykle1 Nov 18, 2019, 10:49 PM Nov 18, 2019, 10:48 PM

          @BD0G said in MMM-Lunartic:

          I cannot find a way to removed the horizontal line over the moon image.

          Can you post a pic of the “horizontal line over the moon image?” I assume you’re not talking about the text.

          I currently only have a main.css file, but I am assuming I can just create a blank custom.css file and place it in the MagicMirror/css directory and that will work?

          You should already have a custom.css file in your css folder. Any modifications to css should be done within that file. It is not recommended that you make any changes to the main.css file.

          Create a working config
          How to add modules

          B 1 Reply Last reply Nov 19, 2019, 12:13 AM Reply Quote 0
          • B Offline
            BD0G @Mykle1
            last edited by BD0G Nov 19, 2019, 12:14 AM Nov 19, 2019, 12:13 AM

            @Mykle1

            I have no custom.css file that was created during the install. I used the new installer script from @sdetweil when I installed my MagicMirror software.

            Here is a picture of the line I am referring to. It is below the text and above the moon image.
            https://www.dropbox.com/s/k1un0q2ofu6w02c/20191118_161043.jpg?dl=0

            I think a centered text that reads “Moon Phase” and no line would be more aesthetically pleasing.

            S C M 3 Replies Last reply Nov 19, 2019, 12:15 AM Reply Quote 0
            • S Away
              sdetweil @BD0G
              last edited by sdetweil Nov 19, 2019, 12:16 AM Nov 19, 2019, 12:15 AM

              @BD0G there is one in ~/MagicMirror/css, it used to contain this

              /*****************************************************
               * Magic Mirror                                      *
               * Custom CSS                                        *
               *                                                   *
               * By Michael Teeuw http://michaelteeuw.nl           *
               * MIT Licensed.                                     *
               *                                                   *
               * Add any custom CSS below.                         *
               * Changes to this files will be ignored by GIT. *
               *****************************************************/
              
               body {
               	
               }
              

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              B 1 Reply Last reply Nov 19, 2019, 12:16 AM Reply Quote 0
              • B Offline
                BD0G @sdetweil
                last edited by BD0G Nov 19, 2019, 12:16 AM Nov 19, 2019, 12:16 AM

                @sdetweil Sam - Where is this file located . I have looked and looked.

                Here is the only file listed under MagicMirror/css

                0_1574122596527_554b7e43-1dd0-49cc-b521-ac993fbf5472-image.png

                S 2 Replies Last reply Nov 19, 2019, 12:16 AM Reply Quote 0
                • S Away
                  sdetweil @BD0G
                  last edited by Nov 19, 2019, 12:16 AM

                  @BD0G

                  ~/MagicMirror/css

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  1 Reply Last reply Reply Quote 0
                  • S Away
                    sdetweil @BD0G
                    last edited by Nov 19, 2019, 12:18 AM

                    @BD0G weird… its still part of the repo, so it should have been installed

                    I just checked and did a git clone, and the file is present

                    Sam

                    How to add modules

                    learning how to use browser developers window for css changes

                    B 1 Reply Last reply Nov 19, 2019, 12:20 AM Reply Quote 0
                    • B Offline
                      BD0G @sdetweil
                      last edited by Nov 19, 2019, 12:20 AM

                      @sdetweil Strangeness! I guess I will just create a file in that directory and name it custom.css and then paste in the code you posted above.

                      S 1 Reply Last reply Nov 19, 2019, 12:21 AM Reply Quote 0
                      • 1
                      • 2
                      • 16
                      • 17
                      • 18
                      • 19
                      • 20
                      • 26
                      • 27
                      • 18 / 27
                      18 / 27
                      • First post
                        176/266
                        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