@qite/tide-components 1.0.10 → 1.0.13-preview.0

package/styles/booking-wizard.scss

@@ -1,61 +1,61 @@
-// SCOPE
-#tide-booking {
-  @import './components/mixins';
-  @import './components/placeholders';
-  @import './components/base';
-  @import './components/form';
-  @import './components/button';
-  @import './components/cta';
-
-  @import './components/step-indicators';
-  @import './components/booking';
-  @import './components/pricing-summary';
-  @import './components/flight-option';
-  @import './components/checkbox';
-  @import './components/radiobutton';
-  @import './components/tree';
-  @import './components/list';
-  @import './components/dropdown';
-  @import './components/loader';
-  @import './components/select-wrapper';
-  @import './components/table';
-  @import './components/info-message';
-  @import './components/input';
-  @import './components/date-list';
-  @import './components/typeahead';
-  @import './components/phone-input';
-  @import './components/slider';
-
-  @extend %reset;
-  @include body;
-  @extend %scrollbar-thin;
-
-  %scrollbar-none {
-    &::-webkit-scrollbar {
-      width: 0px;
-      height: 0px;
-    }
-
-    &::-webkit-scrollbar-track {
-      padding: 0;
-      background: transparent;
-    }
-  }
-
-  %scrollbar-thin {
-    &::-webkit-scrollbar {
-      width: 8px;
-      height: 8px;
-    }
-
-    &::-webkit-scrollbar-track {
-      padding: 2px;
-      background: transparent;
-    }
-
-    &::-webkit-scrollbar-thumb {
-      border-radius: 4px;
-      background-color: #cbcbcb;
-    }
-  }
-}
+// SCOPE
+#tide-booking {
+  @import './components/mixins';
+  @import './components/placeholders';
+  @import './components/base';
+  @import './components/form';
+  @import './components/button';
+  @import './components/cta';
+
+  @import './components/step-indicators';
+  @import './components/booking';
+  @import './components/pricing-summary';
+  @import './components/flight-option';
+  @import './components/checkbox';
+  @import './components/radiobutton';
+  @import './components/tree';
+  @import './components/list';
+  @import './components/dropdown';
+  @import './components/loader';
+  @import './components/select-wrapper';
+  @import './components/table';
+  @import './components/info-message';
+  @import './components/input';
+  @import './components/date-list';
+  @import './components/typeahead';
+  @import './components/phone-input';
+  @import './components/slider';
+
+  @extend %reset;
+  @include body;
+  @extend %scrollbar-thin;
+
+  %scrollbar-none {
+    &::-webkit-scrollbar {
+      width: 0px;
+      height: 0px;
+    }
+
+    &::-webkit-scrollbar-track {
+      padding: 0;
+      background: transparent;
+    }
+  }
+
+  %scrollbar-thin {
+    &::-webkit-scrollbar {
+      width: 8px;
+      height: 8px;
+    }
+
+    &::-webkit-scrollbar-track {
+      padding: 2px;
+      background: transparent;
+    }
+
+    &::-webkit-scrollbar-thumb {
+      border-radius: 4px;
+      background-color: #cbcbcb;
+    }
+  }
+}

package/styles/components/_accordion.scss

@@ -1,67 +1,67 @@
-.accordion {
-  // border: 1px solid rgba(0, 0, 0, 0.12);
-  // border-radius: 12px;
-  overflow: hidden;
-
-  &__trigger {
-    width: 100%;
-    appearance: none;
-    border: 0;
-    border-bottom: 1.5px solid var(--tide-booking-color-primary-fade);
-    background: transparent;
-    text-align: left;
-    padding: 15px 15px;
-    cursor: pointer;
-
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 15px;
-
-    font-size: 15px;
-    font-weight: 600;
-
-    &:focus-visible {
-      outline: 2px solid currentColor;
-      outline-offset: 2px;
-    }
-  }
-
-  &__icon {
-    display: flex;
-    color: var(--tide-booking-color-primary);
-    flex: 0 0 auto;
-    transition: transform 300ms ease;
-  }
-
-  &__panel {
-    display: grid;
-    grid-template-rows: 0fr;
-    transition: grid-template-rows 350ms ease;
-  }
-
-  &__panelInner {
-    overflow: hidden;
-    padding: 0 15px;
-    transition: padding 300ms ease;
-  }
-
-  &__content {
-    padding: 0 0 15px;
-    opacity: 0.95;
-  }
-
-  &--open {
-    .accordion__icon {
-      transform: rotate(90deg);
-    }
-
-    .accordion__panel {
-      grid-template-rows: 1fr;
-    }
-
-    .accordion__panelInner {
-      padding: 15px;
-    }
-  }
-}
+.accordion {
+  // border: 1px solid rgba(0, 0, 0, 0.12);
+  // border-radius: 12px;
+  overflow: hidden;
+
+  &__trigger {
+    width: 100%;
+    appearance: none;
+    border: 0;
+    border-bottom: 1.5px solid var(--tide-booking-color-primary-fade);
+    background: transparent;
+    text-align: left;
+    padding: 15px 15px;
+    cursor: pointer;
+
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 15px;
+
+    font-size: 15px;
+    font-weight: 600;
+
+    &:focus-visible {
+      outline: 2px solid currentColor;
+      outline-offset: 2px;
+    }
+  }
+
+  &__icon {
+    display: flex;
+    color: var(--tide-booking-color-primary);
+    flex: 0 0 auto;
+    transition: transform 300ms ease;
+  }
+
+  &__panel {
+    display: grid;
+    grid-template-rows: 0fr;
+    transition: grid-template-rows 350ms ease;
+  }
+
+  &__panelInner {
+    overflow: hidden;
+    padding: 0 15px;
+    transition: padding 300ms ease;
+  }
+
+  &__content {
+    padding: 0 0 15px;
+    opacity: 0.95;
+  }
+
+  &--open {
+    .accordion__icon {
+      transform: rotate(90deg);
+    }
+
+    .accordion__panel {
+      grid-template-rows: 1fr;
+    }
+
+    .accordion__panelInner {
+      padding: 15px;
+    }
+  }
+}

package/styles/components/_animations.scss

@@ -1,39 +1,39 @@
-@keyframes pulse {
-  0% {
-    transform: scale(0.85);
-    box-shadow: var(--tide-booking-spinner-box-shadow-0);
-  }
-
-  7.5% {
-    transform: scale(1);
-    box-shadow: var(--tide-booking-spinner-box-shadow-7);
-  }
-
-  15% {
-    transform: scale(0.85);
-    box-shadow: var(--tide-booking-spinner-box-shadow-15);
-  }
-
-  22.5% {
-    transform: scale(1);
-    box-shadow: var(--tide-booking-spinner-box-shadow-22);
-  }
-
-  97% {
-    transform: scale(1);
-  }
-
-  100% {
-    transform: scale(0.85);
-  }
-}
-
-@keyframes spinner {
-  0% {
-    transform: rotate(0deg);
-  }
-
-  100% {
-    transform: rotate(360deg);
-  }
-}
+@keyframes pulse {
+  0% {
+    transform: scale(0.85);
+    box-shadow: var(--tide-booking-spinner-box-shadow-0);
+  }
+
+  7.5% {
+    transform: scale(1);
+    box-shadow: var(--tide-booking-spinner-box-shadow-7);
+  }
+
+  15% {
+    transform: scale(0.85);
+    box-shadow: var(--tide-booking-spinner-box-shadow-15);
+  }
+
+  22.5% {
+    transform: scale(1);
+    box-shadow: var(--tide-booking-spinner-box-shadow-22);
+  }
+
+  97% {
+    transform: scale(1);
+  }
+
+  100% {
+    transform: scale(0.85);
+  }
+}
+
+@keyframes spinner {
+  0% {
+    transform: rotate(0deg);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
+}

package/styles/components/_base.scss

@@ -1,107 +1,107 @@
-// GENERAL
-
-// TYPOGRAPHY
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  @include heading;
-}
-
-h1,
-h2,
-h3 {
-  margin-bottom: 15px;
-}
-
-h4,
-h5,
-h6 {
-  margin-bottom: 15px * 0.75;
-}
-
-h1 {
-  @include h1;
-}
-
-h2 {
-  @include h2;
-}
-
-h3 {
-  @include h3;
-}
-
-h4 {
-  @include h4;
-}
-
-h5 {
-  @include h5;
-}
-
-h6 {
-  @include h6;
-}
-
-h6 + p {
-  margin-top: -15px * 0.3;
-}
-
-p {
-  margin-top: 0;
-}
-
-a {
-  @include a;
-}
-
-ul,
-ol,
-dl {
-  @extend %reset;
-  margin-left: 15px * 1.33;
-
-  li {
-    @extend %reset;
-  }
-}
-
-input {
-  @include input;
-}
-
-textarea {
-  @include textarea;
-}
-
-button {
-  @include button;
-}
-
-strong {
-  @include strong;
-}
-
-small {
-  @include small;
-}
-
-::-webkit-input-placeholder {
-  @include placeholder;
-}
-
-::-moz-placeholder {
-  @include placeholder;
-}
-
-:-ms-input-placeholder {
-  @include placeholder;
-}
-
-:-moz-placeholder {
-  @include placeholder;
-}
+// GENERAL
+
+// TYPOGRAPHY
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  @include heading;
+}
+
+h1,
+h2,
+h3 {
+  margin-bottom: 15px;
+}
+
+h4,
+h5,
+h6 {
+  margin-bottom: 15px * 0.75;
+}
+
+h1 {
+  @include h1;
+}
+
+h2 {
+  @include h2;
+}
+
+h3 {
+  @include h3;
+}
+
+h4 {
+  @include h4;
+}
+
+h5 {
+  @include h5;
+}
+
+h6 {
+  @include h6;
+}
+
+h6 + p {
+  margin-top: -15px * 0.3;
+}
+
+p {
+  margin-top: 0;
+}
+
+a {
+  @include a;
+}
+
+ul,
+ol,
+dl {
+  @extend %reset;
+  margin-left: 15px * 1.33;
+
+  li {
+    @extend %reset;
+  }
+}
+
+input {
+  @include input;
+}
+
+textarea {
+  @include textarea;
+}
+
+button {
+  @include button;
+}
+
+strong {
+  @include strong;
+}
+
+small {
+  @include small;
+}
+
+::-webkit-input-placeholder {
+  @include placeholder;
+}
+
+::-moz-placeholder {
+  @include placeholder;
+}
+
+:-ms-input-placeholder {
+  @include placeholder;
+}
+
+:-moz-placeholder {
+  @include placeholder;
+}