feat(label): convert rails icon to pine

Kajabi · May 24, 2024 · e2bab36 · e2bab36
1 parent 77c2ac2
commit e2bab36
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/docs/lib/sage_rails/app/views/sage_components/_sage_label.html.erb b/docs/lib/sage_rails/app/views/sage_components/_sage_label.html.erb
@@ -23,6 +23,12 @@
     <%= "type=button" if component.interactive_type %>
     <%= component.generated_html_attributes.html_safe %>
   />
+    <% if component.icon %>
+      <pds-icon
+        name="<%= component.icon %>"
+        class="<%= SageClassnames::SPACERS::XS_RIGHT %> <%= "sage-label--icon--custom-color" if component.icon && component.custom_icon_color %>"
+      ></pds-icon>
+    <% end %>
     <span class="sage-label__value-text">
       <%= component.value.html_safe %>
     </span>
@@ -35,5 +41,9 @@
   <% end %>
   <% if component.interactive_type === :dropdown %>
     <span class="sage-label__decor-icon sage-label__decor-icon--down-small"></span>
+    <pds-icon
+      name="down-small"
+      class="sage-label__decor-icon"
+    ></pds-icon>
   <% end %>
 </span>
diff --git a/packages/sage-assets/lib/stylesheets/components/_icon.scss b/packages/sage-assets/lib/stylesheets/components/_icon.scss
@@ -93,7 +93,7 @@ $-icon-beside-type: (
   }
 
   .sage-label--icon-#{$icon-name} .sage-label__value::before {
-    @include sage-icon-base($icon-name, md);
+    @include sage-icon-base($icon-name, md, pine);
     align-self: center;
     position: relative;
     margin: 0 sage-spacing(xs) 0 0;