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

Default Weather Module Icon Position

Scheduled Pinned Locked Moved Solved Troubleshooting
38 Posts 4 Posters 7.2k 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.
  • G Offline
    greedyvegan
    last edited by Mar 30, 2024, 8:10 PM

    I have this issue too, the dev window says they’re the same class
    Screenshot 2024-03-30 at 3.42.19 PM.png
    but the classes are already different/labeled as forecast and weather in config
    Screenshot 2024-03-30 at 3.43.19 PM.png
    Screenshot 2024-03-30 at 3.43.27 PM.png

    when I open everything in the developer window,
    this is the one that highlights the icon I want to move “</span> == $0”
    Screenshot 2024-03-30 at 3.47.41 PM.png

    Screenshot 2024-03-30 at 4.03.40 PM.png
    the current weather “sun” icon in the top module is the one I want to move,
    but its labeled as the current weather condition, NOT the icon I want to move
    when I uncheck the one I need, both icons from current weather and “today” from forecast both change
    Screenshot 2024-03-30 at 3.50.51 PM.png
    Screenshot 2024-03-30 at 3.48.32 PM.png

    it’s labeled as “weather weather” , when I change that, they both change (current weather and forecast)
    Screenshot 2024-03-30 at 3.50.03 PM.png

    what am I doing wrong?

    S 1 Reply Last reply Mar 30, 2024, 9:10 PM Reply Quote 0
    • G Offline
      greedyvegan
      last edited by Mar 30, 2024, 8:54 PM

      (currently reading)
      https://forum.magicmirror.builders/topic/6808/css-101-getting-started-with-css-and-understanding-how-css-works?_=1602611995137

      1 Reply Last reply Reply Quote 0
      • S Offline
        sdetweil @greedyvegan
        last edited by sdetweil Mar 30, 2024, 10:34 PM Mar 30, 2024, 9:10 PM

        @greedyvegan yes, they are the same, that is why you need to add unique classes per my previous post, OR use the id value in custom css as the primary selector

        #module_{number}_module-name

        Sam

        How to add modules

        learning how to use browser developers window for css changes

        G 2 Replies Last reply Mar 30, 2024, 9:26 PM Reply Quote 0
        • G Offline
          greedyvegan @sdetweil
          last edited by greedyvegan Mar 30, 2024, 9:28 PM Mar 30, 2024, 9:26 PM

          @sdetweil

          ok, so since this isn’t working, do I change the item “classes” or “type” ?

          Screenshot 2024-03-30 at 3.43.19 PM.png
          Screenshot 2024-03-30 at 3.43.27 PM.png

          let’s say I change it to “weatherDAY” and “weatherWEEK”
          in the css do I change it to

          .weatherDAY .weathericon {
          .weatherWEEK .weathericon {
          

          so on and so forth?

          Screenshot 2024-03-30 at 3.50.03 PM.png

          1 Reply Last reply Reply Quote 0
          • G Offline
            greedyvegan @sdetweil
            last edited by Mar 30, 2024, 9:27 PM

            @sdetweil said in Default Weather Module Icon Position:

            @greedyvegan yes, they are the same, that is why you need to add unique classes per my prvious post, OR use the id value in custom css as the primary selector

            #module_{number}_module-name

            I also saw you say IF you choose the module number, be careful when adding modules because the number will change.

            S 1 Reply Last reply Mar 30, 2024, 10:38 PM Reply Quote 0
            • S Offline
              sdetweil @greedyvegan
              last edited by sdetweil Mar 30, 2024, 10:40 PM Mar 30, 2024, 10:38 PM

              @greedyvegan sorry i posted to an issue

              Screenshot_20240330_163923_Chrome.jpg

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              G 1 Reply Last reply Mar 30, 2024, 11:07 PM Reply Quote 0
              • G Offline
                greedyvegan @sdetweil
                last edited by Mar 30, 2024, 11:07 PM

                @sdetweil thank you very much

                G 1 Reply Last reply Mar 31, 2024, 1:35 AM Reply Quote 0
                • G Offline
                  greedyvegan @greedyvegan
                  last edited by Mar 31, 2024, 1:35 AM

                  that didn’t work, I’m going to try something else

                  S 1 Reply Last reply Mar 31, 2024, 2:07 AM Reply Quote 0
                  • S Offline
                    sdetweil @greedyvegan
                    last edited by sdetweil Mar 31, 2024, 2:10 AM Mar 31, 2024, 2:07 AM

                    @greedyvegan what didnt work?

                    remember the thing before the {
                    is the selector clause,

                    it selects the elements the stuff after the { will apply to

                    i use this cheatsheet to help me build the selector clause
                    https://www.w3schools.com/cssref/css_selectors.php

                    Sam

                    How to add modules

                    learning how to use browser developers window for css changes

                    G 1 Reply Last reply Mar 31, 2024, 7:16 AM Reply Quote 0
                    • G Offline
                      greedyvegan @sdetweil
                      last edited by greedyvegan Mar 31, 2024, 7:18 AM Mar 31, 2024, 7:16 AM

                      @sdetweil changing the classes name didn’t work for me, my custom name gets ignored

                      @sdetweil said remember the thing before the {

                      is the selector clause,

                      it selects the elements the stuff after the { will apply to

                      i use this cheatsheet to help me build the selector clause
                      https://www.w3schools.com/cssref/css_selectors.php

                      I’m going to try that

                      S 1 Reply Last reply Mar 31, 2024, 1:45 PM Reply Quote 0
                      • B bugsounet referenced this topic on Mar 31, 2024, 10:24 AM
                      • 1
                      • 2
                      • 3
                      • 4
                      • 3 / 4
                      3 / 4
                      • First post
                        22/38
                        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