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-EventHorizon - remove black border line

    Scheduled Pinned Locked Moved Solved Troubleshooting
    mmm-eventhorizoncss
    11 Posts 3 Posters 5.2k Views 2 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
      max64
      last edited by

      Wondering if there is some custom.css that can be added to this module to remove the black border line that the module produces around the entire text block.

      I’ve tried “border: none” in both the “.MMM-EventHorizon” and the “.MMM-EventHorizon .module-content” css blocks. Also tried adding “frameBorder=0” for the iframe.style in the js code. But always get the black border…

      Also, is there an easy way to change the font that is used?

      Kind regards for any suggestions

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

        @max64

        I cannot reproduce what you are describing as far as the black border line is concerned. Here is my screenshot.

        0_1546393796644_Screenshot from 2019-01-01 20-47-38.png

        If you have modified any of the module files then perhaps deleting the whole thing and cloning a new copy would put it to rights.

        Because this is simply an ‘iframe’ module, there is no easy way to change the font, other than the three size options. However, it is possible. You would have to go set up your own timer here and replace the iframe.src url with the one you get from the website.

        Create a working config
        How to add modules

        M 1 Reply Last reply Reply Quote 0
        • M Offline
          max64 @Mykle1
          last edited by

          @mykle1 - You can see the “border” line when the background is a light color (like white).

          On the font, mine look more like a Times Roman font, which doesn’t look similar to any of the other fonts on the screen. I was just trying to get something pseudo-similar.

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

            @max64 said in MMM-EventHorizon - remove black border line:

            @mykle1 - You can see the “border” line when the background is a light color (like white).

            Ok, I’ve corrected the border issue (I think). Do a git pull in the MMM-EventHorizon directory

            On the font, mine look more like a Times Roman font, which doesn’t look similar to any of the other fonts on the screen. I was just trying to get something pseudo-similar.

            Understood, but as I said in my last post, this is an iframe module, and as such cannot be modified conventionally. I went to the link I provided for you. It appears there are only 3 fonts choices. Pick one of them and I can make that work for you. Otherwise, what you see is what you get, mate. Peace!

            Create a working config
            How to add modules

            M 1 Reply Last reply Reply Quote 0
            • M Offline
              max64 @Mykle1
              last edited by

              @mykle1 - your edit did remove the iframe black border line. Many thanks.

              Apologize I didn’t pick up in your initial response that the entire content of the iframe was coming from the external timeanddate website. I will just edit the iframe.src url to pick the most appropriate font as your suggest. I can select the correct timezone at the same time.

              Thanks for your help…mate. :)

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

                @max64

                You’re welcome, mate.

                Create a working config
                How to add modules

                1 Reply Last reply Reply Quote 0
                • J Offline
                  jasondreher
                  last edited by jasondreher

                  I lover the MMM-EventHorizon module and am using it as a timer in my kitchen, but for that I dont need the “Days” in the timer. any way to remove this from the module? Or maybe just make it black to hide it?

                  I basically just use the site below and change the date and time…

                  http://free.timeanddate.com/countdown/i6f519yg/n64/cf12/cm0/cu4/ct0/cs0/ca0/cr0/ss0/cacFFFFFF/cpcFFFFFF/pc000/tcfff/szw576/szh443/tatTimer/tacFFFFFF/tptDone/tpcFFFFFF/mat/macFFFFFF/mpt/mpcFFFFFF/iso2019-01-24T10:00:01

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

                    @jasondreher

                    Until I can look into that further, I’ve updated the module so that you can hide the units names (days, hours, minutes and seconds). I’m working on some other changes to the module as well. I hope this will do for now.

                    Here are two examples. Do a git pull in the MagicMirror directory. Note the config option

                    0_1548376912573_Screenshot from 2019-01-24 19-08-18.png

                    0_1548376922595_Screenshot from 2019-01-24 19-13-00.png

                    Create a working config
                    How to add modules

                    1 Reply Last reply Reply Quote 0
                    • J Offline
                      jasondreher
                      last edited by

                      Ok I was thinking I could figure this out (removing the days), but got so far and am stuck.
                      I was able to change the days to blue in the display, how do I get this into the css? I was thinking I could just change the days to black and they would not be shown. Am I on the right path to get this done? How to I get this into my css page?

                      0_1550507511845_Screenshot from 2019-02-18 10-29-21.png

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

                        @jasondreher

                        Understood, but as I said in a previous post, this is an iframe module, and as such cannot be modified conventionally. There are no elements to target for css manipulation.

                        Create a working config
                        How to add modules

                        1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 1 / 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
                          OSZAR »