Description

This badge will display a heart cake when the person's anniversary is within the next 7 days. The number of days left until their anniversary appears in the middle of the heart. If today is the person's anniversary, then the number is not displayed and champagne glasses are shown instead of the heart.

The badge tooltip says how many years they've been married and how many days are left until the anniversary date. 

The badge is not displayed at all if the person's anniversary is not within the next 7 days. 

How To 

Building this badge is extremely simple. Just create a new Lava Badge and paste this into the Display Text field:

<!-- Anniversary Badge -->
{%- assign daysToAnniversary = Person.DaysToAnniversary -%}
{%- assign now = 'Now' -%}
{%- assign anniversaryNum = Person.AnniversaryDate | DateDiff:'Now','Y' | AsString -%}
{%- if daysToAnniversary <= 7 -%}
    {%- assign badgeColor = '#bb3333' -%}
    {%- assign badgeIcon = 'fa fa-heart' -%}
    {%- assign tooltip = Person.NickName -%}
    
    {% if daysToAnniversary == 0 %}
        {%- assign badgeColor = '#eab043' -%}
        {%- assign badgeIcon = 'fa fa-glass-cheers' -%}
        {%- assign anniversaryNum = anniversaryNum | Plus:1 -%}
    {% endif %}
    
    {%- if daysToAnniversary == 1 -%}
        {%- capture tooltip -%}Tomorrow is {{ tooltip }}&rsquo;s {{ anniversaryNum | NumberToOrdinal }} anniversary!{%- endcapture -%}
    {%- elseif daysToAnniversary == 0 -%}
        {%- capture tooltip -%}Today is {{ tooltip }}&rsquo;s {{ anniversaryNum | NumberToOrdinal }} anniversary!{%- endcapture -%}
    {%- else -%}
        {%- capture tooltip -%}{{ tooltip }}&rsquo;s {{ anniversaryNum | NumberToOrdinal }} anniversary is in {{ daysToAnniversary }} days{%- endcapture -%}
    {%- endif -%}
    
    <style>
        .badge-anniversary 
        { 
            position: relative;
            color: {{ badgeColor }};
        }
        .badge-anniversary .badge-icon { position: relative; z-index: 2; }
        .badge-anniversary .anniversary-days
        {
            position: absolute;
            left: 50%; top: 50%;
            z-index: 3;
            margin-left: -0.5em;
            margin-top: -0.5em;
            width: 1em; height: 1em;
            border-radius: 50%;
            background: {{ badgeColor }};
            color: #fff;
            font-size: 18px;
            text-align: center;
            cursor: default;
        }
    </style>
    
    <div class="badge badge-anniversary{% if daysToAnniversary == 0 %} anniversary-today{% endif %}" data-toggle="tooltip" data-original-title="{{ tooltip }}">
        <i class="badge-icon {{ badgeIcon }}"></i>
        {%- if daysToAnniversary > 0 -%}
            <span class="anniversary-days">{{ daysToAnniversary }}</span>
        {%- endif -%}
    </div>
{%- endif -%}