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

organization of the text next to the icon.

Scheduled Pinned Locked Moved Custom CSS
48 Posts 3 Posters 14.7k Views 5 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.
  • I Offline
    iorifly @doubleT
    last edited by iorifly Jan 18, 2020, 8:38 PM Jan 18, 2020, 8:37 PM

    @doubleT said in organization of the text next to the icon.:

    x t-align

    MMM-homeassistant-sensors

    hitting the text did not appear the line either.

    1 Reply Last reply Reply Quote 0
    • D Offline
      doubleT Module Developer
      last edited by doubleT Jan 18, 2020, 8:59 PM Jan 18, 2020, 8:44 PM

      In that case the css should work. And the css file is named custom.css? Exactly like that? And you restarted the mirror?

      Since we’re already working directly in the code: In the module js there’s a line
      var tableElement = document.createElement("table");

      You can write a line directly after that:
      tableElement.className = "homeassistant-table";

      Then you should be able to address the table in the cusom.css like this:

      .homeassistant-table tr td:nth-of-type(2) {
          text-align: left;
      }
      .homeassistant-table tr:nth-of-type(3) td,
      .homeassistant-table tr:nth-of-type(6) td {
          border-bottom: 1px solid white;
      }
      .homeassistant-table {
          border-spacing: 0;
      }
      

      Is the text brighter now?

      EDIT: tableElement, not table.Element

      I 1 Reply Last reply Jan 18, 2020, 8:57 PM Reply Quote 0
      • I Offline
        iorifly
        last edited by Jan 18, 2020, 8:47 PM

        @doubleT said in organization of the text next to the icon.:

        .homeassistant-table tr td:nth-of-type(2) {
        text-align: left;
        }
        .homeassistant-table tr:nth-of-type(3) td,
        .homeassistant-table tr:nth-of-type(6) td {
        border-bottom: 1px solid white;
        }
        .homeassistant-table {
        border-spacing: 0;
        }

        do I delete the text from what was in the custom? or leave and put this?

        1 Reply Last reply Reply Quote 0
        • D Offline
          doubleT Module Developer
          last edited by Jan 18, 2020, 8:48 PM

          Delete the previous code in custom.css if you added that className line in the module’s js.

          1 Reply Last reply Reply Quote 0
          • I Offline
            iorifly @doubleT
            last edited by Jan 18, 2020, 8:57 PM

            @doubleT

            If I put this line:

            table.Element.className = "homeassistant-table";
            

            after

            var tableElement = document.createElement("table");
            

            the module does not load

            Another thing the text is still gray.

            1 Reply Last reply Reply Quote 0
            • D Offline
              doubleT Module Developer
              last edited by Jan 18, 2020, 8:58 PM

              Oh, sorry, “tableElement” – remove the dot. Sorry.

              1 Reply Last reply Reply Quote 0
              • I Offline
                iorifly
                last edited by Jan 18, 2020, 9:01 PM

                The module loaded but without the lines yet.

                Before you get tired LOL … please tell me how to make the text of the module more alive!

                1 Reply Last reply Reply Quote 0
                • D Offline
                  doubleT Module Developer
                  last edited by Jan 18, 2020, 9:02 PM

                  Remove the “dimmed” in line 38 of the code.

                  1 Reply Last reply Reply Quote 0
                  • 1
                  • 2
                  • 3
                  • 4
                  • 5
                  • 5 / 5
                  5 / 5
                  • First post
                    43/48
                    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