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.

    Calendar and Font Awesome - no icons

    Scheduled Pinned Locked Moved Unsolved Troubleshooting
    22 Posts 4 Posters 5.6k 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.
    • S Offline
      sdetweil @RGN01
      last edited by

      @RGN01 what version are you running?
      see the startup messages or the top of package.json

      Sam

      How to add modules

      learning how to use browser developers window for css changes

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

        @sdetweil thanks for your reply.

        	"name": "magicmirror",
        	"version": "2.23.0",
        
        S 1 Reply Last reply Reply Quote 0
        • S Offline
          sdetweil @RGN01
          last edited by

          @RGN01 so reinstalling won’t help … as u have the latest

          how did u install?? manual??

          do this , reinstall the fonts

          cd ~/MagicMirror/fonts
          rm -rf node_modules
          rm package-lock.json
          npm install 
          

          then try MM again

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          R 2 Replies Last reply Reply Quote 0
          • R Offline
            RGN01 @sdetweil
            last edited by

            @sdetweil Thank you. I have done the font reinstall and rebooted. Still the same, unfortunately.

            When you said “then try MM again” did you mean reinstall or just see if it works?

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

              @RGN01 just see if it works

              Sam

              How to add modules

              learning how to use browser developers window for css changes

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

                @sdetweil Thanks for clarifying. Unfortunately, no, it did not.

                cal.png

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

                  @RGN01 ok, lets open the developers window (ctrl-shift-i on the MM keyboard) , select the elements tab , select the pointer top left and use the mouse to position over the icon in the 1st element
                  see where its looking
                  Screenshot at 2023-06-08 15-01-28.png

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

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

                    @sdetweil Thank you so much for your assistance - I really do appreciate it!

                            {keyword: 'Recycling', symbol: 'fas fa-house', color: 'Red'},
                            {keyword: 'Rubbish', symbol: 'fas fa-person', color: 'Gold'}
                    		],
                            calendars: [
                              {
                                url: 'https://calendar.google.com//Calendar1Redacted/basic.ics',
                                symbol: 'fa-house',
                              },
                    
                    

                    It is matching to the ‘Rubbish’ keyword.

                    Cal1.png

                    Cal2.png

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

                      @RGN01 said in Calendar and Font Awesome - no icons:

                       {keyword: 'Recycling', symbol: 'fas fa-house', color: 'Red'},
                          {keyword: 'Rubbish', symbol: 'fas fa-person', color: 'Gold'}
                      

                      there is the problem…

                      u need to split the class and the symbol

                                      symbol: 'person',
                                      symbolClassName: "fas fa-fw fa-",
                      

                      the system appends the symbol name TO the classname

                      here is the default value
                      defaultSymbolClassName: “fas fa-fw fa-”,

                      so, if it doesn’t need to be different (paid for icons use a different prefix)
                      then don’t set it…

                      and U can set the prefix (classname) once per calendar in the list of calendars
                      symbolClassName: “fas fa-fw fa-”,

                      NOT on every symbol entry

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

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

                        @sdetweil Thank you. You have helped a lot but I’m still battling. I’ve had a long day and am struggling to concentrate so will resume this tomorrow.

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