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

    Scheduled Pinned Locked Moved Utilities
    39 Posts 9 Posters 19.0k Views 9 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.
    • M Offline
      MacG @SoleLo
      last edited by

      @solelo Adjust the width to 200px

       .MMM-Worldclock .world {
             width: 200px;
       }
      

      The module may also have an alignment problem on the right side. Further customization of custom.css may be required.

      S 1 Reply Last reply Reply Quote 0
      • S Offline
        SoleLo @MacG
        last edited by

        @macg Ok thanks I’ll mess around with it some more and see if I can get it customized. I figured it was simple as adding your custom css snippet in but I guess not

        M S 2 Replies Last reply Reply Quote 0
        • M Offline
          MacG @SoleLo
          last edited by

          @solelo Just try to set the width higher and higher, eventually nothing will overlap anymore. But it will probably be quite wide, with the cities next to the time. Maybe that’s why style: ‘top’ is the better choice.

          1 Reply Last reply Reply Quote 0
          • S Do not disturb
            sdetweil @SoleLo
            last edited by

            @solelo see this

            https://forum.magicmirror.builders/topic/14862/help-with-a-couple-css-issues?_=1632064035932

            u can change the styles livee and then save it to custom.css…

            note that you can doc the dev window at the bottom too, using the 3 dot menu next to the X to close the dev window

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            1 Reply Last reply Reply Quote 0
            • M Offline
              MacG
              last edited by

              A supplement to the development tools. When you open it, you can select “Sources” and pause script execution with the “pause button” or F8 in the lower third. This makes it easier to get through all the style classes, which otherwise update every second.

              1 Reply Last reply Reply Quote 0
              • goldyfruitG Offline
                goldyfruit Project Sponsor
                last edited by

                I used to install the original woldclock module, just switched to this one and it worked out of the box.

                Thanks for the work. :clapping_hands:

                Build smart things with magic and love! | https://smartgic.io

                1 Reply Last reply Reply Quote 0
                • S Offline
                  SymmetriC
                  last edited by

                  How do I center horizontally at the top of the screen instead of left?

                  S 1 Reply Last reply Reply Quote 0
                  • S Do not disturb
                    sdetweil @SymmetriC
                    last edited by

                    @SymmetriC put it in the top_center position

                    Sam

                    How to add modules

                    learning how to use browser developers window for css changes

                    BKeyportB S 2 Replies Last reply Reply Quote 0
                    • BKeyportB Offline
                      BKeyport Module Developer @sdetweil
                      last edited by

                      @sdetweil or top_bar

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

                      1 Reply Last reply Reply Quote 0
                      • S Offline
                        SymmetriC @sdetweil
                        last edited by

                        @sdetweil Thank you! That worked and the solution was easier than I thought! lol

                        1 Reply Last reply Reply Quote 1
                        • J Offline
                          JohnGalt
                          last edited by

                          @BKeyport, @ulrichwisser and all: Please let me know if the following questions would be better served under a new topic, but since my issues originated with this older module, and the new module shares the same name I thought it appropriate to post under this topic…

                          Issue: the old module is no longer supported by the developer, who suggests using a newer module which uses the same module name. After cloning the new module, the instructions call for doing an ‘npm ci’ command, which fails due to a lack of an existing package-lock,json file.

                          Question: Is there something different I should be doing, o si this something the developer needs to fix?

                          Old module: https://github.com/BKeyport/MMM-Worldclock
                          New module: https://github.com/ulrichwisser/MMM-Worldclock
                          Error Message:

                          pi@mirror1:~/MagicMirror/modules $ cd MMM-Worldclock
                          pi@mirror1:~/MagicMirror/modules/MMM-Worldclock $ npm ci
                          npm ERR! code EUSAGE
                          npm ERR!
                          npm ERR! The `npm ci` command can only install with an existing package-lock.json or
                          npm ERR! npm-shrinkwrap.json with lockfileVersion >= 1. Run an install with npm@5 or
                          npm ERR! later to generate a package-lock.json file, then try again.
                          npm ERR!
                          npm ERR! Clean install a project
                          npm ERR!
                          npm ERR! Usage:
                          npm ERR! npm ci
                          npm ERR!
                          npm ERR! Options:
                          npm ERR! [--install-strategy <hoisted|nested|shallow|linked>] [--legacy-bundling]
                          npm ERR! [--global-style] [--omit <dev|optional|peer> [--omit <dev|optional|peer> ...]]
                          npm ERR! [--strict-peer-deps] [--foreground-scripts] [--ignore-scripts] [--no-audit]
                          npm ERR! [--no-bin-links] [--no-fund] [--dry-run]
                          npm ERR! [-w|--workspace <workspace-name> [-w|--workspace <workspace-name> ...]]
                          npm ERR! [-ws|--workspaces] [--include-workspace-root] [--install-links]
                          npm ERR!
                          npm ERR! aliases: clean-install, ic, install-clean, isntall-clean
                          npm ERR!
                          npm ERR! Run "npm help ci" for more info
                          
                          npm ERR! A complete log of this run can be found in: /home/pi/.npm/_logs/2025-08-05T17_16_59_150Z-debug-0.log
                          pi@mirror1:~/MagicMirror/modules/MMM-Worldclock $
                          
                          S 1 Reply Last reply Reply Quote 0
                          • S Do not disturb
                            sdetweil @JohnGalt
                            last edited by

                            @JohnGalt npm install then

                            Sam

                            How to add modules

                            learning how to use browser developers window for css changes

                            J 1 Reply Last reply Reply Quote 0
                            • J Offline
                              JohnGalt @sdetweil
                              last edited by

                              @sdetweil – That’s what I thought. Just did that and it’s working now…

                              Thanks, as always!

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

                                My version of the module developed a fatal bug that I couldn’t get rid of… The best move was to shut it down.

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

                                J 1 Reply Last reply Reply Quote 0
                                • J Offline
                                  JohnGalt @BKeyport
                                  last edited by

                                  @BKeyport – Sorry to hear that, but thanks for the module while you maintained it.

                                  And a big thanks for directing us to another module, and not just leaving it hanging out there!

                                  1 Reply Last reply Reply Quote 0
                                  • UncleRogerU Offline
                                    UncleRoger
                                    last edited by

                                    @BKeyport
                                    Was the altflag option something that was related to the fatal bug in your version? If not, do you think it’s something that could be added to the latest one?

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

                                      @UncleRoger No, it wasn’t that. I forgot about that code. I might go back in and grab it and offer it to the other version once updated.

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

                                      1 Reply Last reply Reply Quote 1

                                      Hello! It looks like you're interested in this conversation, but you don't have an account yet.

                                      Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.

                                      With your input, this post could be even better 💗

                                      Register Login
                                      • 1
                                      • 2
                                      • 2 / 2
                                      • 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