From 5d4f3b6cb0b1b5163fb92181ec342d7f99e897ca Mon Sep 17 00:00:00 2001
From: HenriqueSSan <hsstudentwork@gmail.com>
Date: Sat, 21 Jan 2023 19:09:43 -0300
Subject: [PATCH] feat(pdp/breadcrumb): finished styles in fonts

---
 styles/css/agenciamagma.store-theme.css       |  2 +-
 styles/css/vtex.breadcrumb.css                | 32 +++++++++----
 .../product/agenciamagma.store-theme.scss     |  4 +-
 .../sass/pages/product/vtex.breadcrumb.scss   | 45 +++++++++++++------
 4 files changed, 56 insertions(+), 27 deletions(-)

diff --git a/styles/css/agenciamagma.store-theme.css b/styles/css/agenciamagma.store-theme.css
index 6c3aa81..9965a16 100644
--- a/styles/css/agenciamagma.store-theme.css
+++ b/styles/css/agenciamagma.store-theme.css
@@ -8,6 +8,6 @@
 /* Media Query M3 */
 /* Grid breakpoints */
 .html--pdp-breadcrumb {
-  width: 271.25px;
+  width: 100%;
   padding: 0 40px;
 }
\ No newline at end of file
diff --git a/styles/css/vtex.breadcrumb.css b/styles/css/vtex.breadcrumb.css
index 587d8dc..39c43f9 100644
--- a/styles/css/vtex.breadcrumb.css
+++ b/styles/css/vtex.breadcrumb.css
@@ -9,16 +9,10 @@
 /* Grid breakpoints */
 .container {
   width: 100%;
-  display: flex;
+  display: inline-flex;
   flex-wrap: wrap;
-}
-
-.homeLink::before {
-  content: "Home";
-}
-
-.arrow {
-  display: block;
+  flex-basis: 100%;
+  align-items: baseline;
 }
 
 .termArrow {
@@ -30,4 +24,24 @@
 
 .term {
   font-size: 0;
+}
+
+.homeLink::before {
+  content: "Home";
+  font-size: 14px;
+  line-height: 20.12px;
+}
+
+.arrow--1 .link {
+  font-size: 0;
+}
+.arrow--1 .link::before {
+  content: "Sapatos";
+  font-size: 14px;
+  line-height: 20.12px;
+}
+
+.arrow--2 .link {
+  font-size: 14px;
+  line-height: 20.12px;
 }
\ No newline at end of file
diff --git a/styles/sass/pages/product/agenciamagma.store-theme.scss b/styles/sass/pages/product/agenciamagma.store-theme.scss
index 5c11d40..b103300 100644
--- a/styles/sass/pages/product/agenciamagma.store-theme.scss
+++ b/styles/sass/pages/product/agenciamagma.store-theme.scss
@@ -1,6 +1,4 @@
-$containers: ();
-
 .html--pdp-breadcrumb {
-  width: 271.25px;
+  width: 100%;
   padding: 0 40px;
 }
diff --git a/styles/sass/pages/product/vtex.breadcrumb.scss b/styles/sass/pages/product/vtex.breadcrumb.scss
index 30760ad..948bc25 100644
--- a/styles/sass/pages/product/vtex.breadcrumb.scss
+++ b/styles/sass/pages/product/vtex.breadcrumb.scss
@@ -1,20 +1,9 @@
 .container {
   width: 100%;
-  display: flex;
+  display: inline-flex;
   flex-wrap: wrap;
-}
-
-.homeLink {
-  &::before {
-    content: "Home";
-  }
-}
-
-.arrow-1 {
-}
-
-.arrow {
-  display: block;
+  flex-basis: 100%;
+  align-items: baseline;
 }
 
 .termArrow {
@@ -28,3 +17,31 @@
 .term {
   font-size: 0;
 }
+
+// manipulation fonts with before
+.homeLink {
+  &::before {
+    content: "Home";
+    font-size: 14px;
+    line-height: 20.12px;
+  }
+}
+
+.arrow--1 {
+  .link {
+    font-size: 0;
+
+    &::before {
+      content: "Sapatos";
+      font-size: 14px;
+      line-height: 20.12px;
+    }
+  }
+}
+
+.arrow--2 {
+  .link {
+    font-size: 14px;
+    line-height: 20.12px;
+  }
+}