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

worldclock - nobody made this, so I did.

Scheduled Pinned Locked Moved Productivity
46 Posts 14 Posters 27.2k Views 14 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.
  • P Offline
    Peter
    last edited by Mar 16, 2018, 9:20 PM

    Can somebody help me to change the font size of this module?
    I would like to have the time a little smaller; about the same as the size of the citynames.
    Thanks.
    Peter

    N 1 Reply Last reply Mar 17, 2018, 2:14 PM Reply Quote 0
    • N Offline
      ninjabreadman @Peter
      last edited by Mar 17, 2018, 2:14 PM

      @Peter This should work:

      .worldclock {
        font-size: 73%; /* adjust value as needed */
      }
      

      Problem with config or JavaScript? Copy/paste it into JSHint.
      Check out the detailed walkthroughs on install, config, modules, etc.

      P 1 Reply Last reply Mar 17, 2018, 4:06 PM Reply Quote 0
      • P Offline
        Peter @ninjabreadman
        last edited by Mar 17, 2018, 4:06 PM

        @ninjabreadman thanks!
        It works fine.
        Peter

        1 Reply Last reply Reply Quote 0
        • C Offline
          cookblook
          last edited by Jan 8, 2019, 10:51 PM

          Hello,

          very nice module. Is it possible to have the clocks horizontal instead of vertical?

          ? 1 Reply Last reply Jan 9, 2019, 12:22 AM Reply Quote 0
          • ? Offline
            A Former User @cookblook
            last edited by Jan 9, 2019, 12:22 AM

            @cookblook
            You can redefine CSS of .worldclockand.worldclock .world to arrange horizontally with flex things of CSS3.

            C 1 Reply Last reply Jan 9, 2019, 1:45 AM Reply Quote 0
            • C Offline
              cookblook @Guest
              last edited by Jan 9, 2019, 1:45 AM

              @sean like display: flex;? tried that but it didn’t work

              ? 1 Reply Last reply Jan 9, 2019, 8:16 AM Reply Quote 0
              • ? Offline
                A Former User @cookblook
                last edited by A Former User Jan 9, 2019, 8:26 AM Jan 9, 2019, 8:16 AM

                @cookblook
                This will work, add this into your css/custom.css

                .worldtime {
                  display:flex;
                  flex-direction:row;
                }
                
                .world{
                  width:200px;
                }
                

                0_1547022402965_sc.png

                1 Reply Last reply Reply Quote 0
                • C Offline
                  cookblook
                  last edited by Jan 9, 2019, 10:24 PM

                  @sean Thanks!! That worked :-)

                  1 Reply Last reply Reply Quote 0
                  • B Offline
                    BKeyport Module Developer
                    last edited by Jul 23, 2020, 3:02 AM

                    Ulrich/Sean -

                    I’ve got a bug - supposedly it’s supposed to allow override of the time format per clock. I’m trying to get a 24 hour clock only on the UTC clock. “LT” is “hh:mm A” here…

                    Thanks!

                    {
                     module: "worldclock",
                     position: "top_left", 
                    config: { 
                     timeFormat: "LT", style: "left",
                     offsetTimezone: null,
                     clocks: [
                     {
                     title: "Local",
                     timezone: "America/Los_Angeles",
                     }, 
                    {
                     title: "UTC",
                     timezone: "UTC",
                     timeFormat: "HH:mm",
                     }, 
                     ]
                     },
                     },
                    

                    Thanks!

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

                    B 1 Reply Last reply Aug 6, 2020, 9:55 PM Reply Quote 0
                    • L Offline
                      Lagmin
                      last edited by Aug 2, 2020, 4:56 PM

                      This post is deleted!
                      1 Reply Last reply Reply Quote 0
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 4 / 5
                      • 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