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 429.2k 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

      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.

      Mykle1M 1 Reply Last reply Reply Quote 0
      • Mykle1M Offline
        Mykle1 Project Sponsor Module Developer @BD0G
        last edited by

        @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 Reply Quote 0
        • B Offline
          BD0G @Mykle1
          last edited by BD0G

          @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?

          Mykle1M 1 Reply Last reply Reply Quote 0
          • Mykle1M Offline
            Mykle1 Project Sponsor Module Developer @BD0G
            last edited by Mykle1

            @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 Reply Quote 0
            • B Offline
              BD0G @Mykle1
              last edited by BD0G

              @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 cowboysdudeC Mykle1M 3 Replies Last reply Reply Quote 0
              • S Offline
                sdetweil @BD0G
                last edited by sdetweil

                @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 Reply Quote 0
                • B Offline
                  BD0G @sdetweil
                  last edited by BD0G

                  @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 Reply Quote 0
                  • S Offline
                    sdetweil @BD0G
                    last edited by

                    @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 Offline
                      sdetweil @BD0G
                      last edited by

                      @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 Reply Quote 0
                      • B Offline
                        BD0G @sdetweil
                        last edited by

                        @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 Reply Quote 0
                        • 1
                        • 2
                        • 15
                        • 16
                        • 17
                        • 18
                        • 19
                        • 26
                        • 27
                        • 17 / 27
                        • 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