fix(SW-1877): fixed size on home icon in skeleton

fixed width and padding for other pages

apps/scandic-web/components/TempDesignSystem/Breadcrumbs/BreadcrumbsSkeleton/index.tsx

@@ -9,9 +9,11 @@ export default function BreadcrumbsSkeleton() {
     <nav className={styles.breadcrumbs}>
       <ul className={styles.list}>
         <li className={styles.listItem}>
-          <span className={styles.homeLink} color="peach80">
-            <MaterialIcon icon="home" color="Icon/Interactive/Secondary" />
-          </span>
+          <MaterialIcon
+            icon="home"
+            size={16}
+            color="Icon/Interactive/Secondary"
+          />
           <MaterialIcon
             icon="chevron_right"
             aria-hidden="true"

apps/scandic-web/components/TempDesignSystem/Breadcrumbs/breadcrumbs.module.css

@@ -2,25 +2,26 @@
   padding: var(--Spacing-x4) 0 var(--Spacing-x3);
   margin: 0 auto;
   width: 100%;
+  max-width: var(--max-width-page);
 }
 
-.contentWidth.breadcrumbs {
+.breadcrumbs.fullWidth {
+  max-width: var(--max-width-page);
+}
+
+.breadcrumbs.contentWidth {
+  max-width: var(--max-width-content);
+}
+
+.breadcrumbs.contentWidth {
   background-color: var(--Base-Surface-Subtle-Normal);
   padding-bottom: 0;
 }
 
-.headerWidth.breadcrumbs {
+.breadcrumbs.headerWidth {
   max-width: min(var(--max-width-page), calc(100% - var(--max-width-spacing)));
 }
 
-.fullWidth .list {
-  max-width: var(--max-width-page);
-}
-
-.contentWidth .list {
-  max-width: var(--max-width-content);
-}
-
 .list {
   display: flex;
   gap: var(--Spacing-x-quarter);

apps/scandic-web/components/TempDesignSystem/Breadcrumbs/index.tsx

@@ -113,7 +113,11 @@ export default function Breadcrumbs({
           </>
         ) : (
           remainingBreadcrumbs.map((breadcrumb) => (
-            <Breadcrumb key={breadcrumb.uid} href={breadcrumb.href}>
+            <Breadcrumb
+              key={breadcrumb.uid}
+              href={breadcrumb.href}
+              className={styles.mobile}
+            >
               {breadcrumb.title}
             </Breadcrumb>
           ))