Initial commit

2022-12-07 04:43:36 +01:00
commit 257f3c354f
496 changed files with 55373 additions and 0 deletions
@@ -0,0 +1,236 @@
+@use "../variables/variables" as v;
+@use "../common/common";
+
+.search-root {
+  /* not seen in mobile screens */
+  display: none !important;
+}
+
+@media (min-width: v.$layout-breakpoint-medium) {
+  .search-root {
+    display: flex !important;
+  }
+}
+
+/* DEVELOPMENT NOTE: CODE BELOW IS COPY PASTED FROM THE HOME PAGE, THIS CAN BE OTIMIZED */
+
+/* GLOBAL DEFINITIONS */
+
+/*
+* {
+  margin: 0;
+  padding: 0;
+  font-size: 1.125rem;
+  font-family: "Roboto", "Helvetica";
+}
+*/
+
+a {
+  color: v.$navigation-maincolor;
+}
+
+html {
+  /* rem definition 1rem = 16px */
+  font-size: 1rem;
+}
+
+/* END GLOBAL DEFINITIONS */
+
+/* MOBILE DEFINITIONS */
+
+.logo-small {
+  display: inline-block;
+  width: 58px;
+  height: 48px;
+  left: 29px;
+  top: 8px;
+}
+
+/* END MOBILE ONLY DEFINITIONS */
+
+.top-container {
+  position: relative;
+  background: v.$navigation-maincolor;
+  box-shadow: 0px 4px 40px rgba(0, 0, 0, 0.2);
+  z-index: 600;
+}
+
+.top-container-mobile-search {
+  display: block;
+
+  @media (min-width: v.$layout-breakpoint-medium) {
+    display: none;
+  }
+}
+
+/* END HERO TEXT */
+
+/* NAVIGATION */
+
+.main-nav-no-search {
+  padding: 8px 0 8px 16px;
+
+  /* all links should not have standard decorations */
+  a {
+    text-decoration: none;
+  }
+
+  .nav {
+    display: flex;
+    align-items: center;
+
+    .nav-item {
+      display: flex;
+    }
+
+    .nav-search-section {
+      flex-grow: 4;
+      justify-content: center;
+    }
+
+    .container {
+      /*.nav {*/
+      display: flex;
+      width: 100%;
+      justify-content: flex-end;
+      align-items: center;
+
+      .nav-entry {
+        display: flex;
+        align-items: center;
+
+        width: auto;
+        min-width: min-content;
+        max-width: max-content;
+        margin: 0 0.625rem;
+
+        button {
+          display: flex;
+          align-items: center;
+
+          text-decoration: none;
+          border: none;
+          background: none;
+        }
+
+        .threedots {
+          margin: 0;
+        }
+
+        > button > *:first-child {
+          margin-right: 0.625rem;
+        }
+
+        a.dropodown-item {
+          font-size: 1.125rem;
+        }
+      }
+
+      a.nav-entry > *:first-child {
+        margin-right: 0.625rem;
+      }
+    }
+  }
+}
+
+/* END NAVIGATION */
+
+/* SEARCH BAR */
+
+.search-root {
+  padding: 0 20px;
+  display: flex;
+  width: 100%;
+  max-width: 650px;
+  justify-content: center;
+
+  button {
+    border: none;
+    background: none;
+  }
+
+  img {
+    display: inline-block;
+    height: 40px;
+    width: 40px;
+  }
+
+  > div {
+    width: 100%;
+  }
+
+  .search-bar {
+    display: flex;
+    width: 100%;
+    height: 46px;
+    background-color: v.$nav-white;
+    box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.16);
+    border-radius: 6px;
+
+    > span {
+      height: 100%;
+      /*padding: 1.25rem 0;*/
+    }
+
+    .searchbar-icon-container {
+      display: flex;
+      width: 40px;
+      margin: 0 18px;
+      align-items: center;
+
+      .search_icon {
+        height: 25px;
+      }
+    }
+
+    .search-input {
+      height: 100%;
+      /*width: 55%;*/
+      width: 100%;
+
+      &:focus {
+        outline: none;
+      }
+
+      border: none;
+      background: none;
+    }
+
+    .search-button-keyboard {
+      display: flex;
+      flex-shrink: 0;
+      margin: 0 20px;
+      width: 30px;
+      height: 100%;
+      line-height: 10px;
+      align-items: center;
+    }
+
+    .keyboard {
+      width: 18px;
+    }
+
+    .dropdown-btn {
+      display: flex;
+      width: 30px;
+      flex-shrink: 0;
+      margin-right: 20px;
+      align-items: center;
+      justify-content: flex-end;
+      /*margin-right: 1.25rem;*/
+
+      img {
+        display: inline-block;
+        width: 12px;
+      }
+    }
+  }
+}
+
+/* END MOBILE DEFINITIONS */
+
+/******************  UTILS    *******************/
+
+/************ END UTILS  ************************/
+
+/************************************** AREA TO ADD TO THE HOME (PATCHES) **********************************/