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.

    Comment avoir une couleur différente du TITRE pour chaque calendrier

    Scheduled Pinned Locked Moved Solved Troubleshooting
    12 Posts 2 Posters 2.3k 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.
    • S Offline
      sdetweil @Mastrapi
      last edited by sdetweil

      @Mastrapi OK, now there is a hard way, or easy way

      hard way, use the developers window to get the ID assigned to each module instance
      .opps it might change if the order in config.js changes

      the easy way

      add

      classes:"....",
      

      after the module:

      with a unique string for each

      then in custom.css

      .xxxx .module header {
         color: vvvv;
      }
      

      vvvv is the color to use

      note the leading dot in both cases

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      M 1 Reply Last reply Reply Quote 0
      • M Offline
        Mastrapi @sdetweil
        last edited by

        @sdetweil Dans css j’ai renseigné celaccs.jpg

        ou dois-je mettre classes:“???”, et que dois-je mettre à la place de ???

        S 1 Reply Last reply Reply Quote 0
        • S Offline
          sdetweil @Mastrapi
          last edited by

          @Mastrapi sorry, typo on my part, phone knows better!

          .module_header

          {
               module"....",
                position:"....",
                classes:"......"
                 config:{
                       ....
                 }
          }
          

          see here https://docs.magicmirror.builders/modules/configuration.html#module-configuration

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          S 1 Reply Last reply Reply Quote 0
          • S Offline
            sdetweil @sdetweil
            last edited by

            @Mastrapi

            classes

            mom,
            dad,
            finances
            travel

            any meaningful string (in quotes of course)

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            M 1 Reply Last reply Reply Quote 0
            • M Offline
              Mastrapi @sdetweil
              last edited by

              @sdetweil Désolé je ne comprend pas
              Screenshot_2.jpg

              de plus si dans css j’indique une couleur, tous les calendriers auront la même couleur, non ?

              S 1 Reply Last reply Reply Quote 0
              • S Offline
                sdetweil @Mastrapi
                last edited by

                @Mastrapi Non, vous utilisez la valeur de chaque classe pour les rendre uniques.

                .PAPA .module_header { 
                     color: red;
                 }
                

                Sam

                How to add modules

                learning how to use browser developers window for css changes

                M 1 Reply Last reply Reply Quote 0
                • M Offline
                  Mastrapi @sdetweil
                  last edited by

                  @sdetweil Je suis vraiment désolé d’abuser de votre patience
                  Mais ca ne fonctionne pas
                  Regardez mon .js et mon .css
                  Qu’est ce qu’il ne va pas ? merci encore
                  papajs.jpg css.jpg

                  S 1 Reply Last reply Reply Quote 0
                  • S Offline
                    sdetweil @Mastrapi
                    last edited by

                    @Mastrapi Mon erreur

                    .PAPA .module-header {
                       color: xxx;
                    }
                    

                    Tiret (-) au lieu de trait de soulignement (_)

                    Maintenant, votre .module-header
                    modifiera TOUS les en-têtes
                    1742108210724-css.jpg

                    Sam

                    How to add modules

                    learning how to use browser developers window for css changes

                    M 1 Reply Last reply Reply Quote 0
                    • M Offline
                      Mastrapi @sdetweil
                      last edited by

                      @sdetweil encore merci beaucoup, ca fonctionne

                      1 Reply Last reply Reply Quote 1
                      • S sdetweil has marked this topic as solved on
                      • 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