@naniteninja/dashboard-components-lib 1.0.0 → 1.0.2

package/src/lib/shared-styles/common/feedback.scss

@@ -1,157 +1,157 @@
-// feedback-modal.component
-.feedback-modal {
-  --popover-container-padding: 1.93rem 1.5rem !important;
-  --popover-container-width: 25.67rem !important;
-  --popover-container-min-width: 25.67rem !important;
-  --box-shadow: none !important;
-}
-
-.modal-buttons {
-  lib-secondary-btn,
-  lib-primary-btn {
-    --lib-button-container-height: 1.96rem;
-    --lib-button-height: 1.96rem;
-    --lib-button-font-size: 0.83rem;
-  }
-}
-
-.toggle-container {
-  lib-toggle {
-    font-size: 0.405rem;
-    --knob-color: white;
-  }
-}
-
-// feedback-screenshot.component
-.toolbar {
-  lib-icon-btn {
-    .btn-text {
-      img {
-        width: 1.58rem;
-      }
-    }
-    .lib-button-component {
-      button {
-        border: none !important;
-        background: none !important;
-      }
-      .lib-button-container {
-        --lib-button-container-background: linear-gradient(90deg, #353039 0.68%, #463a45 99.45%) !important;
-      }
-    }
-  }
-}
-
-// feedback-send.component
-.page-wrapper {
-  lib-menu-btn {
-    mat-icon {
-      font-size: 1.5rem !important;
-      width: 1.666rem !important;
-    }
-    .lib-button-component {
-      button {
-        width: 2.667rem !important;
-      }
-    }
-  }
-  .back-icon {
-    box-shadow: -5px -5px 12px 3px #cbc7d140;
-    border-radius: 50%;
-    .lib-button-component {
-      button {
-        background: transparent !important;
-        border: none !important;
-      }
-    }
-    img {
-      width: 1.21rem !important;
-      height: 1.05rem !important;
-    }
-  }
-  .comments-field {
-    lib-input-field {
-      .counter {
-        font-size: 1rem !important;
-      }
-      textarea {
-        font-family: Gilroy-Regular, serif;
-        font-size: 1rem;
-        min-width: 100%;
-        border-radius: 0.83rem;
-        padding-inline: 1rem;
-        &::placeholder {
-          font-size: 1rem !important;
-        }
-        &::-webkit-scrollbar-track {
-          height: 90% !important;
-          background: transparent !important;
-          &:hover {
-            cursor: pointer;
-          }
-        }
-      }
-    }
-  }
-
-  lib-form-field {
-    lib-toggle {
-      font-size: 0.405rem;
-      --knob-color: white;
-    }
-  }
-
-  .lib-secondary-btn_container {
-    lib-secondary-btn {
-      width: 12.08rem;
-    }
-    lib-base-btn {
-      --lib-button-font-size: 0.95rem !important;
-    }
-  }
-
-  .submit-container {
-    lib-base-btn {
-      --lib-button-font-size: 1.54rem !important;
-    }
-  }
-
-  lib-chip-btn {
-    .lib-chip-container {
-      width: 42vw;
-      max-width: 11.6rem;
-      display: block;
-      padding: 0.32rem 1rem;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      font-size: 1.08rem;
-      @media (min-width: 390px) {
-        max-width: 12.2rem;
-      }
-      @media (min-width: 425px) {
-        max-width: 13.3rem;
-      }
-    }
-    .lib-button-component button.lib-button-hover-outline:hover {
-      outline: none !important;
-    }
-  }
-}
-.feedback-menu-item {
-  min-height: 2.08rem !important;
-  lib-toggle {
-    font-size: 0.405rem;
-    --knob-color: white;
-    .lib-toggle-container {
-      height: 2.8rem;
-    }
-  }
-}
-
-// feedback-success.component
-.ok-btn {
-  lib-base-btn {
-    --lib-button-font-size: 1.54rem !important;
-  }
-}
+// feedback-modal.component
+.feedback-modal {
+  --popover-container-padding: 1.93rem 1.5rem !important;
+  --popover-container-width: 25.67rem !important;
+  --popover-container-min-width: 25.67rem !important;
+  --box-shadow: none !important;
+}
+
+.modal-buttons {
+  lib-secondary-btn,
+  lib-primary-btn {
+    --lib-button-container-height: 1.96rem;
+    --lib-button-height: 1.96rem;
+    --lib-button-font-size: 0.83rem;
+  }
+}
+
+.toggle-container {
+  lib-toggle {
+    font-size: 0.405rem;
+    --knob-color: white;
+  }
+}
+
+// feedback-screenshot.component
+.toolbar {
+  lib-icon-btn {
+    .btn-text {
+      img {
+        width: 1.58rem;
+      }
+    }
+    .lib-button-component {
+      button {
+        border: none !important;
+        background: none !important;
+      }
+      .lib-button-container {
+        --lib-button-container-background: linear-gradient(90deg, #353039 0.68%, #463a45 99.45%) !important;
+      }
+    }
+  }
+}
+
+// feedback-send.component
+.page-wrapper {
+  lib-menu-btn {
+    mat-icon {
+      font-size: 1.5rem !important;
+      width: 1.666rem !important;
+    }
+    .lib-button-component {
+      button {
+        width: 2.667rem !important;
+      }
+    }
+  }
+  .back-icon {
+    box-shadow: -5px -5px 12px 3px #cbc7d140;
+    border-radius: 50%;
+    .lib-button-component {
+      button {
+        background: transparent !important;
+        border: none !important;
+      }
+    }
+    img {
+      width: 1.21rem !important;
+      height: 1.05rem !important;
+    }
+  }
+  .comments-field {
+    lib-input-field {
+      .counter {
+        font-size: 1rem !important;
+      }
+      textarea {
+        font-family: Gilroy-Regular, serif;
+        font-size: 1rem;
+        min-width: 100%;
+        border-radius: 0.83rem;
+        padding-inline: 1rem;
+        &::placeholder {
+          font-size: 1rem !important;
+        }
+        &::-webkit-scrollbar-track {
+          height: 90% !important;
+          background: transparent !important;
+          &:hover {
+            cursor: pointer;
+          }
+        }
+      }
+    }
+  }
+
+  lib-form-field {
+    lib-toggle {
+      font-size: 0.405rem;
+      --knob-color: white;
+    }
+  }
+
+  .lib-secondary-btn_container {
+    lib-secondary-btn {
+      width: 12.08rem;
+    }
+    lib-base-btn {
+      --lib-button-font-size: 0.95rem !important;
+    }
+  }
+
+  .submit-container {
+    lib-base-btn {
+      --lib-button-font-size: 1.54rem !important;
+    }
+  }
+
+  lib-chip-btn {
+    .lib-chip-container {
+      width: 42vw;
+      max-width: 11.6rem;
+      display: block;
+      padding: 0.32rem 1rem;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      font-size: 1.08rem;
+      @media (min-width: 390px) {
+        max-width: 12.2rem;
+      }
+      @media (min-width: 425px) {
+        max-width: 13.3rem;
+      }
+    }
+    .lib-button-component button.lib-button-hover-outline:hover {
+      outline: none !important;
+    }
+  }
+}
+.feedback-menu-item {
+  min-height: 2.08rem !important;
+  lib-toggle {
+    font-size: 0.405rem;
+    --knob-color: white;
+    .lib-toggle-container {
+      height: 2.8rem;
+    }
+  }
+}
+
+// feedback-success.component
+.ok-btn {
+  lib-base-btn {
+    --lib-button-font-size: 1.54rem !important;
+  }
+}

package/src/lib/shared-styles/common/fonts.scss

@@ -1,3 +1,3 @@
-// List of fonts
-@import '../fonts/gilroy.font.scss';
-@import '../fonts/calistoga.font.scss';
+// List of fonts
+@import '../fonts/gilroy.font.scss';
+@import '../fonts/calistoga.font.scss';

package/src/lib/shared-styles/common/information-card.scss

@@ -1,56 +1,56 @@
-$sm: 320px;
-$md: 360px;
-
-ion-card {
-  background: var(--button-background);
-  box-shadow: var(--box-shadow);
-  border-radius: 8px;
-  padding: 30px 30px 25px 30px;
-  display: grid;
-  margin-inline: 0px;
-
-  .card-header {
-    margin-bottom: 7px;
-    @extend .f-calistoga;
-    @extend .f-w-600;
-    @extend .h-160;
-    @extend .f-md;
-    @extend .f-white;
-  }
-
-  .information {
-    @extend .f-calistoga;
-    @extend .f-sm;
-    @extend .f-w-400;
-    @extend .h-180;
-    @extend .f-gray;
-  }
-  .gallery-container {
-    margin: -5.5px;
-  }
-
-  div.gallery {
-    margin: 5.5px;
-    float: left;
-    width: 86px;
-    height: 86px;
-  }
-
-  div.gallery img {
-    width: 100%;
-    height: 100%;
-    border-radius: 8px;
-  }
-}
-
-@media screen and (max-width: $md) {
-  ion-card {
-    padding: 20px 20px 15px 20px;
-  }
-}
-
-@media screen and (max-width: $sm) {
-  ion-card {
-    padding: 15px 15px 10px 15px;
-  }
-}
+$sm: 320px;
+$md: 360px;
+
+ion-card {
+  background: var(--button-background);
+  box-shadow: var(--box-shadow);
+  border-radius: 8px;
+  padding: 30px 30px 25px 30px;
+  display: grid;
+  margin-inline: 0px;
+
+  .card-header {
+    margin-bottom: 7px;
+    @extend .f-calistoga;
+    @extend .f-w-600;
+    @extend .h-160;
+    @extend .f-md;
+    @extend .f-white;
+  }
+
+  .information {
+    @extend .f-calistoga;
+    @extend .f-sm;
+    @extend .f-w-400;
+    @extend .h-180;
+    @extend .f-gray;
+  }
+  .gallery-container {
+    margin: -5.5px;
+  }
+
+  div.gallery {
+    margin: 5.5px;
+    float: left;
+    width: 86px;
+    height: 86px;
+  }
+
+  div.gallery img {
+    width: 100%;
+    height: 100%;
+    border-radius: 8px;
+  }
+}
+
+@media screen and (max-width: $md) {
+  ion-card {
+    padding: 20px 20px 15px 20px;
+  }
+}
+
+@media screen and (max-width: $sm) {
+  ion-card {
+    padding: 15px 15px 10px 15px;
+  }
+}

package/src/lib/shared-styles/common/input.scss

@@ -1,110 +1,110 @@
-.input-style:not(.p-inputtext) {
-  background: var(--primary-color);
-  border-radius: 100px;
-  box-shadow: var(--input-box-shadow);
-  width: 100%;
-  margin: 12px 0;
-  outline: #1e2023;
-  border: none;
-
-  &:not([type="number"]) {
-    height: 48px;
-  }
-  z-index: 1;
-
-  &.mdc-radio__native-control {
-    margin: unset;
-  }
-}
-
-.emphasis {
-  border-bottom: 1.5px solid rgba(255, 255, 255, 0.5) !important;
-  border-top: 0.5px;
-  border-left: 0.5px;
-  border-right: 0.5px;
-  box-sizing: border-box;
-}
-
-input:not(.p-inputtext) {
-  @extend .input-style;
-  overflow: hidden;
-  display: flex;
-  font-style: normal;
-  font-weight: 600;
-  font-size: 14px;
-  line-height: 160%;
-  padding: 0 16px;
-  box-sizing: border-box;
-  color: var(--input-field-color, #fff);
-
-  .mdc-icon-button {
-    position: absolute;
-    top: 0;
-    right: 5px;
-    box-shadow: none !important;
-    background: transparent !important;
-  }
-
-  .mdc-icon-button.left {
-    left: 5px !important;
-  }
-}
-
-input:not(.mdc-radio__native-control) {
-  position: relative;
-}
-
-textarea:not(.p-inputtext) {
-  @extend .input-style;
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 180%;
-  height: 100px;
-  border-radius: 12px;
-  padding: 15px 37px;
-  resize: none;
-  box-sizing: border-box;
-}
-
-input:not(.p-inputtext),
-textarea:not(.p-inputtext) {
-  background: transparent;
-  width: 100%;
-}
-
-ion-input {
-  --border-radius: 100px;
-  --padding-end: 37px !important;
-  --padding-start: 37px !important;
-  font-size: 14px;
-}
-
-ion-textarea {
-  --border-radius: 12px !important;
-  font-size: 14px;
-  --background: var(--primary-color);
-}
-
-mat-radio-button {
-  .mat-ripple {
-    display: none;
-  }
-  .mdc-label {
-    color: var(--input-field-color, #fff);
-    cursor: pointer;
-  }
-
-  .mdc-radio__outer-circle {
-    border-color: #e91e63 !important;
-  }
-}
-
-.mdc-line-ripple::after {
-  display: none;
-}
-
-.custom-input {
-  textarea {
-    background: transparent !important;
-  }
-}
+.input-style:not(.p-inputtext) {
+  background: var(--primary-color);
+  border-radius: 100px;
+  box-shadow: var(--input-box-shadow);
+  width: 100%;
+  margin: 12px 0;
+  outline: #1e2023;
+  border: none;
+
+  &:not([type="number"]) {
+    height: 48px;
+  }
+  z-index: 1;
+
+  &.mdc-radio__native-control {
+    margin: unset;
+  }
+}
+
+.emphasis {
+  border-bottom: 1.5px solid rgba(255, 255, 255, 0.5) !important;
+  border-top: 0.5px;
+  border-left: 0.5px;
+  border-right: 0.5px;
+  box-sizing: border-box;
+}
+
+input:not(.p-inputtext) {
+  @extend .input-style;
+  overflow: hidden;
+  display: flex;
+  font-style: normal;
+  font-weight: 600;
+  font-size: 14px;
+  line-height: 160%;
+  padding: 0 16px;
+  box-sizing: border-box;
+  color: var(--input-field-color, #fff);
+
+  .mdc-icon-button {
+    position: absolute;
+    top: 0;
+    right: 5px;
+    box-shadow: none !important;
+    background: transparent !important;
+  }
+
+  .mdc-icon-button.left {
+    left: 5px !important;
+  }
+}
+
+input:not(.mdc-radio__native-control) {
+  position: relative;
+}
+
+textarea:not(.p-inputtext) {
+  @extend .input-style;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 180%;
+  height: 100px;
+  border-radius: 12px;
+  padding: 15px 37px;
+  resize: none;
+  box-sizing: border-box;
+}
+
+input:not(.p-inputtext),
+textarea:not(.p-inputtext) {
+  background: transparent;
+  width: 100%;
+}
+
+ion-input {
+  --border-radius: 100px;
+  --padding-end: 37px !important;
+  --padding-start: 37px !important;
+  font-size: 14px;
+}
+
+ion-textarea {
+  --border-radius: 12px !important;
+  font-size: 14px;
+  --background: var(--primary-color);
+}
+
+mat-radio-button {
+  .mat-ripple {
+    display: none;
+  }
+  .mdc-label {
+    color: var(--input-field-color, #fff);
+    cursor: pointer;
+  }
+
+  .mdc-radio__outer-circle {
+    border-color: #e91e63 !important;
+  }
+}
+
+.mdc-line-ripple::after {
+  display: none;
+}
+
+.custom-input {
+  textarea {
+    background: transparent !important;
+  }
+}