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.

    Go East, young icon!

    Scheduled Pinned Locked Moved Solved Troubleshooting
    22 Posts 5 Posters 15.0k Views 6 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.
    • slametpsS Offline
      slametps @strawberry 3.141
      last edited by

      @strawberry-3.141 : the space on the left of the icon. How to remove it?

      regards,

      Slamet PS

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

        @slametps said in Go East, young icon!:

        the space on the left of the icon. How to remove it?

        Strawberry helped me with this. I’m not trying to answer for him, but while you’re waiting, this is what he did for me.

        Add this to your custon.css file.

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

        /* This aligned NetworkScanner to the left margin. Thanks to Strawberry-3.141 */

        Create a working config
        How to add modules

        slametpsS 1 Reply Last reply Reply Quote 0
        • slametpsS Offline
          slametps @Mykle1
          last edited by

          @Mykle1 said in Go East, young icon!:

          @slametps said in Go East, young icon!:

          the space on the left of the icon. How to remove it?

          Strawberry helped me with this. I’m not trying to answer for him, but while you’re waiting, this is what he did for me.

          Add this to your custon.css file.

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

          /* This aligned NetworkScanner to the left margin. Thanks to Strawberry-3.141 */

          I’m using this on my custom.css, but still no luck.

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

          the icon still has space I mention earlier.

          regards,

          Slamet PS

          strawberry 3.141S 1 Reply Last reply Reply Quote 0
          • strawberry 3.141S Offline
            strawberry 3.141 Project Sponsor Module Developer @slametps
            last edited by

            @slametps for me this works

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

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

            slametpsS 1 Reply Last reply Reply Quote 0
            • slametpsS Offline
              slametps @strawberry 3.141
              last edited by slametps

              @strawberry-3.141 said in Go East, young icon!:

              @slametps for me this works

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

              this style will cause the icon has a left-margin about 35px. what I want is the icon is left-aligned without a margin, and set margin-left to 0 or 1px is not working as expected.

              regards,

              Slamet PS

              strawberry 3.141S 1 Reply Last reply Reply Quote 0
              • strawberry 3.141S Offline
                strawberry 3.141 Project Sponsor Module Developer @slametps
                last edited by

                @slametps can you share a screenshot? for me its aligned to the left

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

                slametpsS 1 Reply Last reply Reply Quote 0
                • slametpsS Offline
                  slametps @strawberry 3.141
                  last edited by

                  @strawberry-3.141 said in Go East, young icon!:

                  @slametps can you share a screenshot? for me its aligned to the left

                  0_1488845973500_MM-network_scanner-align_left.jpg

                  using following css:

                  .MMM-NetworkScanner .fa-ul {
                    margin-left: 0px; /* This aligned NetworkScanner to the left margin */
                    width: 35 px; /* If you remove this line it will be the same width as the widest module in the region, this can lead to a big gap, thats why i limited it to 130px if you add devices with longer names you might want to increase this value */
                  }
                  
                  .MMM-NetworkScanner .fa-li {
                    position: relative; /* This put the icon on the right side */
                    float: left;
                    left: initial;
                    margin-left: 0px;
                  }
                  

                  There are spaces between icon in NetworkScanner module and the left-edge. Is it possible to make it full left-aligned?

                  regards,

                  Slamet PS

                  strawberry 3.141S 1 Reply Last reply Reply Quote 0
                  • strawberry 3.141S Offline
                    strawberry 3.141 Project Sponsor Module Developer @slametps
                    last edited by

                    @slametps replace your rules with

                    .MMM-NetworkScanner .fa-ul {
                        margin-left: 35px;
                    }
                    
                    .MMM-NetworkScanner .fa-li {
                        left: -35px;
                        text-align: initial;
                    }
                    

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

                    slametpsS 1 Reply Last reply Reply Quote 0
                    • slametpsS Offline
                      slametps @strawberry 3.141
                      last edited by

                      @strawberry-3.141 said in Go East, young icon!:

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

                      .MMM-NetworkScanner .fa-li {
                      left: -35px;
                      text-align: initial;
                      }

                      Yap, this works. Thx a lot, @strawberry-3-141.

                      regards,

                      Slamet PS

                      1 Reply Last reply Reply Quote 0
                      • KimzerK Offline
                        Kimzer
                        last edited by

                        How do i change the color of the names?

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