feat(WEB-154): my profile view

components/MyPages/Header/Breadcrumbs/breadcrumbs.module.css

@@ -1,25 +0,0 @@
-.list {
-  align-items: center;
-  display: flex;
-  gap: 0.4rem;
-  justify-content: flex-start;
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-
-.listItem,
-.link {
-  color: var(--some-text-color, #000);
-  font-size: 1.4rem;
-  font-weight: 400;
-  line-height: 1.56rem;
-}
-
-.link {
-  text-decoration: none;
-}
-
-.currentPage {
-  margin: 0;
-}

components/MyPages/Header/Breadcrumbs/index.tsx

@@ -1,23 +0,0 @@
-import Link from "next/link"
-
-import styles from "./breadcrumbs.module.css"
-
-export default function Breadcrumbs() {
-  return (
-    <nav className={styles.breadcrumbs}>
-      <ul className={styles.list}>
-        <li className={styles.listItem}>
-          <Link className={styles.link} href="#">
-            Home
-          </Link>
-        </li>
-        <li className={styles.listItem}>
-          <span>/</span>
-        </li>
-        <li className={styles.listItem}>
-          <p className={styles.currentPage}>My Scandic</p>
-        </li>
-      </ul>
-    </nav>
-  )
-}

components/MyPages/Header/header.module.css

@@ -1,9 +1,3 @@
-.container {
-  position: sticky;
-  top: 0;
-  z-index: 999;
-}
-
 .header {
   align-items: center;
   background-color: var(--some-white-color, #fff);
@@ -11,16 +5,12 @@
   display: grid;
   gap: 3rem;
   grid-template-columns: 1fr auto auto;
-  height: 7rem;
-  padding: 0 2rem;
-}
+  height: var(--header-height);
 
-.breadcrumbs {
-  background-color: var(--some-grey-color, #f2f2f2);
-  display: block;
-  padding-bottom: 0.8rem;
-  padding-left: 2rem;
-  padding-top: 3rem;
+  padding: 0 2rem;
+  position: sticky;
+  top: 0;
+  z-index: 999;
 }
 
 @media screen and (min-width: 950px) {
@@ -30,13 +20,6 @@
     box-shadow: none;
     gap: 3.2rem;
     grid-template-columns: 1fr 19rem auto auto;
-    height: 4.5rem;
     padding: 0 2.4rem;
   }
-
-  .breadcrumbs {
-    background-color: var(--some-white-color, #fff);
-    padding-left: 2.4rem;
-    padding-top: 2rem;
-  }
-}
+}

components/MyPages/Header/index.tsx

@@ -1,4 +1,3 @@
-import Breadcrumbs from "./Breadcrumbs"
 import Hamburger from "./Hamburger"
 import LanguageSwitcher from "./LanguageSwitcher"
 import Logo from "./Logo"
@@ -10,16 +9,11 @@ import type { LangParams } from "@/types/params"
 
 export default function Header({ lang }: LangParams) {
   return (
-    <div className={styles.container}>
-      <header className={styles.header}>
-        <Logo lang={lang} />
-        <LanguageSwitcher />
-        <User />
-        <Hamburger />
-      </header>
-      <div className={styles.breadcrumbs}>
-        <Breadcrumbs />
-      </div>
-    </div>
+    <header className={styles.header}>
+      <Logo lang={lang} />
+      <LanguageSwitcher />
+      <User />
+      <Hamburger />
+    </header>
   )
 }