button

Author: motdotla

_includes/components/design-btn.html

@@ -11,6 +11,7 @@
     {% if include.hidden %}hidden{% endif %}
     {% if include.target %}target="{{ include.target }}"{% endif %}
     {% if include.rel %}rel="{{ include.rel }}"{% endif %}
+    {% if include.data_umami_event %}data-umami-event="{{ include.data_umami_event }}"{% endif %}
   >{% if label and label != "" %}{{ label }}{% else %}{{ include.content }}{% endif %}</a>
 {% else %}
   <button
@@ -19,5 +20,6 @@
     {% if include.id %}id="{{ include.id }}"{% endif %}
     {% if include.hidden %}hidden{% endif %}
     {% if include.disabled %}disabled aria-disabled="true"{% endif %}
+    {% if include.data_umami_event %}data-umami-event="{{ include.data_umami_event }}"{% endif %}
   >{% if label and label != "" %}{{ label }}{% else %}{{ include.content }}{% endif %}</button>
 {% endif %}

_includes/components/radar-nav.html

@@ -55,7 +55,13 @@
     </nav>
 
     <div class="radar-topbar-right">
-      <a href="/login" class="radar-nav-link radar-nav-login" data-umami-event="Login link">Log In</a>
+      {% include components/design-btn.html
+        label="Log In"
+        href="/login"
+        class="design-btn--sm radar-nav-login"
+        data_umami_event="Login link"
+      %}
+
       <a href="https://github.com/dotenvx/dotenvx" target="_blank" rel="noopener noreferrer" class="radar-nav-icon" aria-label="GitHub repository" data-umami-event="GitHub repository link">
         <svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true">
           <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"></path>

assets/css/main.src.css

@@ -1686,11 +1686,12 @@ html.dark .radar-brand-dark {
 .radar-nav-login {
   display: none;
   flex-shrink: 0;
+  line-height: 1.2;
 }
 
 @media (min-width: 768px) {
   .radar-nav-login {
-    display: inline-flex;
+    display: inline-block;
   }
 }
 
@@ -4103,6 +4104,12 @@ html.dark .design-check--danger {
   width: 100%;
 }
 
+.design-btn--sm {
+  font-size: 0.7rem;
+  letter-spacing: 0.03em;
+  padding: 0.3rem 0.55rem;
+}
+
 .design-btn--danger {
   border-color: rgba(180, 35, 24, 0.45);
   color: #b42318 !important;