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.

    How to add custom birthdays to the calendar module?

    Scheduled Pinned Locked Moved Troubleshooting
    27 Posts 4 Posters 7.0k 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.
    • D Offline
      doogy_rev @sdetweil
      last edited by

      @sdetweil This works great, thanks again!. How easy would it be to have this updated to match the look and feel of the default calendar? Something like this for example…

      Dave Birthday [37] Jul 10th
      My Anniversary [12] Aug 15th
      Walter Birthday [52] Oct 23rd

      And also to show the next 5 or 10 events rather than the next 30days?

      S 2 Replies Last reply Reply Quote 0
      • S Offline
        sdetweil @doogy_rev
        last edited by

        @doogy_rev let me look at it

        Sam

        How to add modules

        learning how to use browser developers window for css changes

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

          @doogy_rev

          I can easily add the age and date format
          date format, use moment formats…
          like here https://devhints.io/moment
          dateFormat=“Do”
          ageFormat , some string with ‘m’ in it and I will replace n with the age
          ageFormat : “[ n ]” // produces [ 23 ]

          the other, limit number of entries

          this is designed around birthdays this month (and show or not show those already occurred this month)

          I can let u truncate the list at n entries, (1st 5 birthdays this month)

          and I think there is a way to allow month cross over… 3 this month, 2 this month of the limit of 5, 1 month cross over at end f year… so show Dec and Jan, but not February (until Jan is curent month)

          is that what you are looking for?

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          1 Reply Last reply Reply Quote 0
          • D Offline
            doogy_rev
            last edited by

            @sdetweil said in How to add custom birthdays to the calendar module?:

            https://devhints.io/moment

            That sounds great and yes that’s kinda what I was looking for, the month cross over sounds good, This is how I have the default where it will only show the next 5 holidays so have the birthdays work the same way (or as near as), then past birthdays for the month drop off the list

            Screen Shot 2021-07-10 at 11.07.44 AM.png

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

              @doogy_rev ok, git pull , review the README

              by default it operates on current month only

              Sam

              How to add modules

              learning how to use browser developers window for css changes

              1 Reply Last reply Reply Quote 0
              • D Offline
                doogy_rev
                last edited by

                Installed and working :-) Thanks for looking at this for me!

                I am going to play with the CSS and change some of the colours a bit. I did notice the following . .

                • If birthdays are shared date, then the second/third entry is in bold (see screen shot Aug 12th)

                • when you specify number of entires it adds additional, I specified 5, but 6 are showing

                • is it possible to have date aligned right and keep age after the name “doogyrev Birthday [45] Oct 1st”

                • where do I change font to not be all uppercase?

                Screen Shot 2021-07-10 at 3.14.37 PM.png

                S 2 Replies Last reply Reply Quote 0
                • S Offline
                  sdetweil @doogy_rev
                  last edited by sdetweil

                  @doogy_rev all the stuff is in css.

                  body has a transform uppercase
                  this is built as a table.

                  also read this
                  https://forum.magicmirror.builders/topic/14862/help-with-a-couple-css-issues?_=1625955346969

                  and if u change the css file, just hit f5 or ctrl-r

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  1 Reply Last reply Reply Quote 0
                  • D Offline
                    doogy_rev
                    last edited by

                    Thanks Again, I appreciate the help and assistance!!

                    I will check that out. I am what I class as a non-technical-technical . . . i.e I know a small amount, probably enough to be dangerous . .TBH, I am just chuffed I have managed to maintain my Mirror for the last 5years . . lol

                    I might be back if I can’t work it out :-)

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

                      @doogy_rev no problem…
                      this last with the date next to the age, they are in teh same table cell, so I might have to make another column

                      I didn’t do the css for this.

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      1 Reply Last reply Reply Quote 0
                      • D Offline
                        doogy_rev
                        last edited by

                        I figured they were in the same cell since the colours are linked, but that’s beyond my feeble abilities …haha

                        This is where I am at, going to make some new icons to match the default, I found the one used, so just need to change the colours.

                        Screen Shot 2021-07-10 at 6.21.19 PM.png

                        how do I change the cell height? I removed the existing icon and the cell height stayed the same? even changing the vertical height in the css made no difference. Also I assume the “Aug 12th” double entry’s are in the same cell, is it possible to put them in individual?

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