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

For the life of me

Scheduled Pinned Locked Moved Troubleshooting
5 Posts 4 Posters 2.5k Views 4 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
    Mykle1 Project Sponsor Module Developer
    last edited by Feb 13, 2017, 9:39 PM

    Hi all.

    As you can see from the picture below, I was successful in getting the appearance of SystemStats to my liking. The alignment was more “centered”, but not exactly, so I moved the text to align to the left. Just the way I wanted it. Also, the default text was “dimmed” and I didn’t like that much either, so I changed that to “normal”. This I did on my own, without asking for help. No small feat for me and very satisfying. (Hold the applause)

    Also in the picture, below SystemStats, is NetworkScanner. (Here’s where the topic will make sense). You can see that NetworkScanner is slightly indented. Now, I have been trying but, (enter topic name here) I can’t find where to edit this as I did with SystemStats, so that I can align it to the left margin, as I did with SystemStats.

    0_1487021883675_IMG_1738edit.jpg

    If someone would point me in the right direction, I would be greatly obliged.

    Create a working config
    How to add modules

    ? S 2 Replies Last reply Feb 13, 2017, 9:53 PM Reply Quote 0
    • ? Offline
      A Former User @Mykle1
      last edited by Feb 13, 2017, 9:53 PM

      @Mykle1 In your custom.css file add:

      .networkscanner {
          margin-left: -20px;
      }
      

      Replace the class “.networkscanner” with the actual class on the module wrapper. I just took a guess at it being .networkscanner.

      1 Reply Last reply Reply Quote 0
      • S Offline
        strawberry 3.141 Project Sponsor Module Developer @Mykle1
        last edited by Feb 13, 2017, 10:09 PM

        @Mykle1 he’s using the fontawesome class fa-ul, which has set a margin-left to (30em / 14)

        .MMM-NetworkScanner .fa-ul {
          margin-left: 0px;
        }
        

        Please create a github issue if you need help, so I can keep track

        M 1 Reply Last reply Feb 13, 2017, 11:47 PM Reply Quote 1
        • M Offline
          Mykle1 Project Sponsor Module Developer @strawberry 3.141
          last edited by Feb 13, 2017, 11:47 PM

          @strawberry-3.141 said in For the life of me:

          .MMM-NetworkScanner .fa-ul {
          margin-left: 0px;
          }

          First, thanks again

          This worked but it pushed the “mobile” icon to the very edge of the mirror, so I tried 10px, 20px and 30px, until I got this. Nice, but not exactly how I pictured it.
          0_1487026318051_IMG_1741edit.jpg

          So, I went to the config.js and removed “mobile” from the icon designation, so it looked like this, icon: “”}, That removed the icons but the names were still exactly where they were, as if the space for the icons was still occupied. So, I went back to the “margin-left: 0px;”. That was damn close! I wound up at margin-left: 2px;. Just right!
          0_1487029387090_IMG_1743edit.jpg

          Now I’m going to try to see if I can figure out how to put the mobile icon on the right of the name. I’m not asking for help on that, yet.

          Create a working config
          How to add modules

          1 Reply Last reply Reply Quote 2
          • I Offline
            izanbard
            last edited by Feb 14, 2017, 9:01 AM

            @Mykle1 lve your enthusiasm

            1 Reply Last reply Reply Quote 0
            • 1 / 1
            1 / 1
            • First post
              5/5
              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