create-sitecore-jss 21.2.1 → 21.2.2

package/dist/templates/nextjs-sxa/src/assets/sass/components/link-list/index.scss

@@ -1,2 +1,2 @@
-@import "component-link-list";
-@import "list-vertical";
+@import "component-link-list";
+@import "list-vertical";

package/dist/templates/nextjs-sxa/src/assets/sass/components/navigation/_navigation-fat.scss

@@ -1,58 +1,58 @@
-@import '@sass/abstracts/vars';
-@import '@sass/abstracts/mixins';
-@import '@fontawesome/scss/mixins';
-@import '@fontawesome/scss/variables';
-
-.navigation.navigation-fat {
-  background: $bg-basic-color;
-  @include border-basic();
-
-  a {
-    text-decoration: none;
-  }
-
-  nav > ul {
-    list-style: none;
-    padding: 10px 0;
-    overflow: hidden;
-  }
-
-  .rel-level1 {
-    margin: $small-margin;
-    padding: 0;
-    display: inline-block;
-    vertical-align: top;
-
-    &.submenu ul a {
-      position: relative;
-      &:before {
-        @include fa-icon();
-        transform: translateY(-50%);
-        position: absolute;
-        content: $fa-var-chevron-right;
-        top: 50%;
-        left: -9px;
-        font-size: 10px;
-      }
-    }
-    > .navigation-title > a {
-      @include border-basic(top, $border-basic-color, 2px);
-      border-bottom: 0;
-      background: $nav-bg-root;
-      padding: 5px 10px;
-      display: block;
-      width: auto;
-      &:hover {
-        border-color: $menu-hover-color;
-      }
-    }
-    > ul {
-      padding: 0;
-    }
-  }
-  .rel-level2 {
-    padding-left: $small-margin;
-    display: block;
-  }
-}
-
+@import '@sass/abstracts/vars';
+@import '@sass/abstracts/mixins';
+@import '@fontawesome/scss/mixins';
+@import '@fontawesome/scss/variables';
+
+.navigation.navigation-fat {
+  background: $bg-basic-color;
+  @include border-basic();
+
+  a {
+    text-decoration: none;
+  }
+
+  nav > ul {
+    list-style: none;
+    padding: 10px 0;
+    overflow: hidden;
+  }
+
+  .rel-level1 {
+    margin: $small-margin;
+    padding: 0;
+    display: inline-block;
+    vertical-align: top;
+
+    &.submenu ul a {
+      position: relative;
+      &:before {
+        @include fa-icon();
+        transform: translateY(-50%);
+        position: absolute;
+        content: $fa-var-chevron-right;
+        top: 50%;
+        left: -9px;
+        font-size: 10px;
+      }
+    }
+    > .navigation-title > a {
+      @include border-basic(top, $border-basic-color, 2px);
+      border-bottom: 0;
+      background: $nav-bg-root;
+      padding: 5px 10px;
+      display: block;
+      width: auto;
+      &:hover {
+        border-color: $menu-hover-color;
+      }
+    }
+    > ul {
+      padding: 0;
+    }
+  }
+  .rel-level2 {
+    padding-left: $small-margin;
+    display: block;
+  }
+}
+

package/dist/templates/nextjs-sxa/src/assets/sass/components/navigation/_navigation-main-horizontal-vertical.scss

@@ -1,152 +1,152 @@
-@import '@sass/abstracts/vars';
-@import '@sass/abstracts/mixins';
-@import '@fontawesome/scss/mixins';
-@import '@fontawesome/scss/variables';
-
-$borderSize: 2px;
-
-//Drop Down Navigation Common Part
-.navigation.navigation-main {
-  .component-content>nav {
-      position: relative;
-      ul {
-          @include clearfix();
-      }
-  }
-  .rel-level1 {
-      float: left;
-      &.active {
-          >.navigation-title>a {
-              border-color: $nav-border-root;
-          }
-      }
-      >.navigation-title>a {
-          border-width: 2px 0 0 0;
-          border-color: transparent;
-          &:hover {
-              border-color: $nav-border-root;
-          }
-      }
-      &.submenu {
-          >.navigation-title a {
-              position: relative;
-              padding-right: 15px;
-              &:after {
-                  @include fa-icon();
-                  font-size: 10px;
-                  content: $fa-var-chevron-down;
-                  position: absolute;
-                  transform: translateY(-50%);
-                  top: 50%;
-                  right: 0;
-              }
-          }
-      }
-      //submenu
-      >ul {
-          overflow: hidden;
-          display: none;
-          z-index: 10;
-          position: absolute;
-          top: 100%;
-          background: $nav-bg-submenu;
-          margin-left: 0;
-          margin-top: -$borderSize;
-          border-top: $borderSize solid $nav-border-submenu;
-          border-left: 1px solid $nav-submenu-item-border;
-          border-bottom: 1px solid $nav-submenu-item-border;
-      }
-      &:active, &:hover {
-          >a {
-              &+ul {
-                  display: block !important;
-              }
-          }
-          >ul {
-              display: block !important;
-              min-width: 60px;
-          }
-      }
-      &.active {
-          >.navigation-title>a:link, >.navigation-title>a:visited {
-              color: $text-basic-active;
-          }
-          >span {
-              display: block;
-              padding: 10px 20px;
-              color: $text-white;
-          }
-      }
-      &.submenu.active {
-          border-color: $menu-active-color;
-      }
-  }
-  .rel-level2 {
-      &:hover, &:focus {
-          transition: background .2s ease-in;
-          background: $nav-bg-submenu-active;
-      }
-      div>a {
-          display: block;
-          font-weight: normal;
-          font-size: $navigation-font-basic-submenu;
-          text-align: center;
-          &:hover, &:focus {
-              color: $nav-color-submenu;
-          }
-      }
-      &.submenu {
-          box-sizing: border-box;
-          &.navigation-image {
-              text-align: center;
-              >a, .field-navigationtext {
-                  text-align: left;
-              }
-          }
-      }
-  }
-  // Additional styles fot drop down horizontal navigation 
-  &.navigation-main-horizontal {
-      .submenu>ul {
-          padding-left: 0;
-      }
-      .rel-level1 {
-          &:active, &:hover {
-              >a {
-                  &+ul {
-                      display: inline-flex !important;
-                      flex-wrap: wrap;
-                  }
-              }
-              >ul {
-                  display: inline-flex !important;
-                  flex-wrap: wrap;
-              }
-          }
-          >ul {
-              width: 100%;
-              clear: both;
-              left: 0;
-          }
-      }
-      .rel-level2 {
-          float: left;
-          padding: 10px;
-          @include border-basic(right, $nav-submenu-item-border, 1px);
-          flex-grow: 1;
-          flex-basis: 23%;
-      }
-  }
-  // Additional styles fot drop down vertical navigation 
-  &.navigation-main-vertical {
-      .rel-level1>ul {
-          padding-left: 0;
-          width: auto;
-          left: auto;
-          @include border-basic(right, $nav-submenu-item-border, 1px);
-          >li {
-              padding: 5px 10px;
-          }
-      }
-  }
-}
+@import '@sass/abstracts/vars';
+@import '@sass/abstracts/mixins';
+@import '@fontawesome/scss/mixins';
+@import '@fontawesome/scss/variables';
+
+$borderSize: 2px;
+
+//Drop Down Navigation Common Part
+.navigation.navigation-main {
+  .component-content>nav {
+      position: relative;
+      ul {
+          @include clearfix();
+      }
+  }
+  .rel-level1 {
+      float: left;
+      &.active {
+          >.navigation-title>a {
+              border-color: $nav-border-root;
+          }
+      }
+      >.navigation-title>a {
+          border-width: 2px 0 0 0;
+          border-color: transparent;
+          &:hover {
+              border-color: $nav-border-root;
+          }
+      }
+      &.submenu {
+          >.navigation-title a {
+              position: relative;
+              padding-right: 15px;
+              &:after {
+                  @include fa-icon();
+                  font-size: 10px;
+                  content: $fa-var-chevron-down;
+                  position: absolute;
+                  transform: translateY(-50%);
+                  top: 50%;
+                  right: 0;
+              }
+          }
+      }
+      //submenu
+      >ul {
+          overflow: hidden;
+          display: none;
+          z-index: 10;
+          position: absolute;
+          top: 100%;
+          background: $nav-bg-submenu;
+          margin-left: 0;
+          margin-top: -$borderSize;
+          border-top: $borderSize solid $nav-border-submenu;
+          border-left: 1px solid $nav-submenu-item-border;
+          border-bottom: 1px solid $nav-submenu-item-border;
+      }
+      &:active, &:hover {
+          >a {
+              &+ul {
+                  display: block !important;
+              }
+          }
+          >ul {
+              display: block !important;
+              min-width: 60px;
+          }
+      }
+      &.active {
+          >.navigation-title>a:link, >.navigation-title>a:visited {
+              color: $text-basic-active;
+          }
+          >span {
+              display: block;
+              padding: 10px 20px;
+              color: $text-white;
+          }
+      }
+      &.submenu.active {
+          border-color: $menu-active-color;
+      }
+  }
+  .rel-level2 {
+      &:hover, &:focus {
+          transition: background .2s ease-in;
+          background: $nav-bg-submenu-active;
+      }
+      div>a {
+          display: block;
+          font-weight: normal;
+          font-size: $navigation-font-basic-submenu;
+          text-align: center;
+          &:hover, &:focus {
+              color: $nav-color-submenu;
+          }
+      }
+      &.submenu {
+          box-sizing: border-box;
+          &.navigation-image {
+              text-align: center;
+              >a, .field-navigationtext {
+                  text-align: left;
+              }
+          }
+      }
+  }
+  // Additional styles fot drop down horizontal navigation 
+  &.navigation-main-horizontal {
+      .submenu>ul {
+          padding-left: 0;
+      }
+      .rel-level1 {
+          &:active, &:hover {
+              >a {
+                  &+ul {
+                      display: inline-flex !important;
+                      flex-wrap: wrap;
+                  }
+              }
+              >ul {
+                  display: inline-flex !important;
+                  flex-wrap: wrap;
+              }
+          }
+          >ul {
+              width: 100%;
+              clear: both;
+              left: 0;
+          }
+      }
+      .rel-level2 {
+          float: left;
+          padding: 10px;
+          @include border-basic(right, $nav-submenu-item-border, 1px);
+          flex-grow: 1;
+          flex-basis: 23%;
+      }
+  }
+  // Additional styles fot drop down vertical navigation 
+  &.navigation-main-vertical {
+      .rel-level1>ul {
+          padding-left: 0;
+          width: auto;
+          left: auto;
+          @include border-basic(right, $nav-submenu-item-border, 1px);
+          >li {
+              padding: 5px 10px;
+          }
+      }
+  }
+}

package/dist/templates/nextjs-sxa/src/assets/sass/components/navigation/_navigation-mobile.scss

@@ -1,89 +1,89 @@
-@import '@sass/abstracts/vars';
-@import '@sass/abstracts/mixins';
-@import '@fontawesome/scss/mixins';
-@import '@fontawesome/scss/variables';
-
-.navigation.navigation-mobile {
-  nav > ul {
-    border: none;
-    @include border-basic();
-  }
-  .rel-level1 {
-    cursor: pointer;
-    margin: 0;
-    background: $bg-basic-color;
-    > ul {
-      li {
-        position: relative;
-        a:before {
-          @include fa-icon();
-          content: $fa-var-chevron-right;
-          display: block;
-          position: absolute;
-          left: 0;
-          font-size: 10px;
-          top: 20px;
-          transform: translateY(-50%);
-        }
-      }
-      padding-left: 25px;
-      display: none;
-      background: $nav-bg-submenu;
-    }
-    &.submenu {
-      > ul {
-        display: none;
-      }
-      &:focus {
-        > .navigation-title:before {
-          transform: rotate(180deg);
-          transition: 0.6s;
-          transform-style: preserve-3d;
-        }
-        > ul {
-          display: block;
-        }
-      }
-      > .navigation-title {
-        position: relative;
-        &:before {
-          @include fa-icon();
-          content: $fa-var-chevron-down;
-          display: block;
-          position: absolute;
-          right: 10px;
-          font-size: 10px;
-          top: 20px;
-          transform: translateY(-50%);
-          transform: rotate(0);
-          transition: 0.6s;
-          transform-style: preserve-3d;
-        }
-      }
-    }
-    > .navigation-title {
-      border-bottom: 1px solid $border-basic-color;
-      margin: 0;
-      &:last-child {
-        border-bottom: none;
-      }
-    }
-    .navigation-title {
-      padding: 10px;
-      > a {
-        text-decoration: none;
-        color: $text-basic;
-        display: inline;
-      }
-    }
-  }
-  .rel-level2 {
-    display: list-item;
-    .navigation-title > a {
-      font-weight: 500;
-    }
-    ul {
-      display: none;
-    }
-  }
-}
+@import '@sass/abstracts/vars';
+@import '@sass/abstracts/mixins';
+@import '@fontawesome/scss/mixins';
+@import '@fontawesome/scss/variables';
+
+.navigation.navigation-mobile {
+  nav > ul {
+    border: none;
+    @include border-basic();
+  }
+  .rel-level1 {
+    cursor: pointer;
+    margin: 0;
+    background: $bg-basic-color;
+    > ul {
+      li {
+        position: relative;
+        a:before {
+          @include fa-icon();
+          content: $fa-var-chevron-right;
+          display: block;
+          position: absolute;
+          left: 0;
+          font-size: 10px;
+          top: 20px;
+          transform: translateY(-50%);
+        }
+      }
+      padding-left: 25px;
+      display: none;
+      background: $nav-bg-submenu;
+    }
+    &.submenu {
+      > ul {
+        display: none;
+      }
+      &:focus {
+        > .navigation-title:before {
+          transform: rotate(180deg);
+          transition: 0.6s;
+          transform-style: preserve-3d;
+        }
+        > ul {
+          display: block;
+        }
+      }
+      > .navigation-title {
+        position: relative;
+        &:before {
+          @include fa-icon();
+          content: $fa-var-chevron-down;
+          display: block;
+          position: absolute;
+          right: 10px;
+          font-size: 10px;
+          top: 20px;
+          transform: translateY(-50%);
+          transform: rotate(0);
+          transition: 0.6s;
+          transform-style: preserve-3d;
+        }
+      }
+    }
+    > .navigation-title {
+      border-bottom: 1px solid $border-basic-color;
+      margin: 0;
+      &:last-child {
+        border-bottom: none;
+      }
+    }
+    .navigation-title {
+      padding: 10px;
+      > a {
+        text-decoration: none;
+        color: $text-basic;
+        display: inline;
+      }
+    }
+  }
+  .rel-level2 {
+    display: list-item;
+    .navigation-title > a {
+      font-weight: 500;
+    }
+    ul {
+      display: none;
+    }
+  }
+}

package/dist/templates/nextjs-sxa/src/assets/sass/components/navigation/_navigation-sidebar.scss

@@ -1,29 +1,29 @@
-@import "@sass/abstracts/vars";
-@import "@sass/abstracts/mixins";
-
-.navigation.navigation-sidebar {
-    a {
-        text-decoration: none;
-    }
-    nav>ul {
-        .rel-level1 {
-            >.navigation-title {
-                margin-bottom: 0;
-                >a {
-                    padding: 5px 10px;
-                    display: block;
-                    position: relative;
-                    z-index: 1;
-                    margin-right: 0;
-                }
-            }
-            >ul {
-                margin-left: $small-margin;
-                margin-top: $extrasmall-margin;
-            }
-        }
-        .rel-level2 {
-            display: block;
-        }
-    }
-}
+@import "@sass/abstracts/vars";
+@import "@sass/abstracts/mixins";
+
+.navigation.navigation-sidebar {
+    a {
+        text-decoration: none;
+    }
+    nav>ul {
+        .rel-level1 {
+            >.navigation-title {
+                margin-bottom: 0;
+                >a {
+                    padding: 5px 10px;
+                    display: block;
+                    position: relative;
+                    z-index: 1;
+                    margin-right: 0;
+                }
+            }
+            >ul {
+                margin-left: $small-margin;
+                margin-top: $extrasmall-margin;
+            }
+        }
+        .rel-level2 {
+            display: block;
+        }
+    }
+}