[Site] Rework "Read the docs" button on packages pages

symfony · Dec 7, 2024 · 7624229 · 7624229
1 parent 3bc80c5
commit 7624229
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 11 deletions.
diff --git a/ux.symfony.com/assets/icons/fluent-emoji-flat/open-book.svg b/ux.symfony.com/assets/icons/fluent-emoji-flat/open-book.svg
diff --git a/ux.symfony.com/assets/styles/components/_DocsLink.scss b/ux.symfony.com/assets/styles/components/_DocsLink.scss
@@ -19,17 +19,15 @@
     border-radius: var(--border-radius-sm, .5rem);
     height: 52px;
     opacity: 1;
-    padding: var(--space-small, .25rem) var(--space-large, 1rem);
+    padding: var(--space-small, .75rem) var(--space-large, 1.5rem);
     transform: translateY(50%);
 
     p {
       margin-bottom: 0;
     }
 
     svg {
-      fill: none;
-      position: relative;
-      bottom: 2px;
+      font-size: 1.5rem;
     }
 
     &:hover {
@@ -79,5 +77,3 @@
     margin-bottom: 0;
   }
 }
-
-
diff --git a/ux.symfony.com/templates/components/DocsLink.html.twig b/ux.symfony.com/templates/components/DocsLink.html.twig
@@ -2,16 +2,17 @@
     <div class="DocsLink_content">
         {% if isSmall %}
             <p class="d-flex align-items-center">
-                <twig:ux:icon name="fluent-emoji-flat:open-book" class="Icon me-2" font-size="32"/>
+                <twig:ux:icon name="mdi:book-open-variant-outline" class="Icon me-2" />
+
                 <a href="{{ url }}" class="DocsLink_link"
                    rel="{{ isExternal ? 'external noopened noreferrer' }}"
                 >{{ title }}</a>
             </p>
         {% else %}
             <p class="DocsLink_title ubuntu-header">
-                <a href="{{ url }}" class="DocsLink_link"
-                   rel="{{ isExternal ? 'external noopened noreferrer' }}"
-                >{{ title }}</a>
+                <a href="{{ url }}" class="DocsLink_link" rel="{{ isExternal ? 'external noopened noreferrer' }}">
+                    {{ title }}
+                </a>
                 {% if icon|default %}
                     <twig:ux:icon name="{{ icon }}" class="Icon DocsLink_arrow"/>
                 {% elseif isExternal %}