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.1k 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

      @Mastrapi you would have to do 4 instances of the calendar module

      you can have different colors of events all in one instance

      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 J’ai fait cela
        Screenshot_1.jpg

        S 1 Reply Last reply Reply Quote 0
        • 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
                        • 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