@vuu-ui/vuu-theme 0.5.10 → 0.5.11

package/css/characteristics/measured.css

@@ -1,26 +0,0 @@
-.salt-theme {
-  --salt-measured-borderStyle: solid;
-  --salt-measured-borderStyle-active: solid;
-  --salt-measured-borderStyle-complete: solid;
-  --salt-measured-borderStyle-incomplete: dotted;
-  --salt-measured-borderWidth: 2px;
-  --salt-measured-borderWidth-active: 2px;
-  --salt-measured-borderWidth-complete: 2px;
-  --salt-measured-borderWidth-incomplete: 2px;
-
-  --salt-measured-fontWeight: var(--salt-typography-fontWeight-semiBold);
-  --salt-measured-textAlign: center;
-
-  --salt-measured-background: var(--salt-palette-measured-background);
-  --salt-measured-background-disabled: var(--salt-palette-measured-background-disabled);
-  --salt-measured-borderColor: var(--salt-palette-measured-border);
-  --salt-measured-borderColor-disabled: var(--salt-palette-measured-border-disabled);
-  --salt-measured-fill: var(--salt-palette-measured-fill);
-  --salt-measured-fill-disabled: var(--salt-palette-measured-fill-disabled);
-  --salt-measured-foreground: var(--salt-palette-measured-foreground);
-  --salt-measured-foreground-hover: var(--salt-palette-measured-foreground-active);
-  --salt-measured-foreground-active: var(--salt-palette-measured-foreground-active);
-  --salt-measured-foreground-undo: var(--salt-palette-measured-foreground-active);
-  --salt-measured-foreground-activeDisabled: var(--salt-palette-measured-foreground-activeDisabled);
-  --salt-measured-foreground-disabled: var(--salt-palette-measured-foreground-disabled);
-}

package/css/characteristics/navigable.css

@@ -1,27 +0,0 @@
-.salt-theme {
-  --salt-navigable-cursor-active: pointer;
-  --salt-navigable-cursor-hover: pointer;
-  --salt-navigable-cursor-disabled: not-allowed;
-  --salt-navigable-cursor-edit: text;
-
-  --salt-navigable-fontWeight: var(--salt-typography-fontWeight-regular);
-  --salt-navigable-fontWeight-hover: var(--salt-typography-fontWeight-regular);
-  --salt-navigable-fontWeight-active: var(--salt-typography-fontWeight-semiBold);
-  --salt-navigable-fontWeight-edit: var(--salt-typography-fontWeight-regular);
-
-  --salt-navigable-indicator-hover: var(--salt-palette-navigate-indicator-hover);
-  --salt-navigable-indicator-active: var(--salt-palette-navigate-indicator-active);
-  --salt-navigable-indicator-activeDisabled: var(--salt-palette-navigate-indicator-activeDisabled);
-
-  --salt-navigable-primary-background: var(--salt-palette-navigate-primary-background);
-  --salt-navigable-primary-background-hover: var(--salt-palette-navigate-primary-background-hover);
-  --salt-navigable-primary-background-active: var(--salt-palette-navigate-primary-background-active);
-
-  --salt-navigable-secondary-background: var(--salt-palette-navigate-secondary-background);
-  --salt-navigable-secondary-background-hover: var(--salt-palette-navigate-secondary-background-hover);
-  --salt-navigable-secondary-background-active: var(--salt-palette-navigate-secondary-background-active);
-
-  --salt-navigable-tertiary-background: var(--salt-palette-navigate-tertiary-background);
-  --salt-navigable-tertiary-background-hover: var(--salt-palette-navigate-tertiary-background-hover);
-  --salt-navigable-tertiary-background-active: var(--salt-palette-navigate-tertiary-background-active);
-}

package/css/characteristics/overlayable.css

@@ -1,12 +0,0 @@
-.salt-theme {
-  --salt-overlayable-shadow-scroll: var(--salt-shadow-1);
-  --salt-overlayable-shadow-scroll-color: var(--salt-shadow-1-color);
-  --salt-overlayable-shadow-borderRegion: var(--salt-shadow-2);
-  --salt-overlayable-shadow: var(--salt-shadow-2);
-  --salt-overlayable-shadow-hover: var(--salt-shadow-3);
-  --salt-overlayable-shadow-popout: var(--salt-shadow-4);
-  --salt-overlayable-shadow-drag: var(--salt-shadow-4);
-  --salt-overlayable-shadow-modal: var(--salt-shadow-5);
-
-  --salt-overlayable-background: var(--salt-palette-neutral-backdrop);
-}

package/css/characteristics/selectable.css

@@ -1,59 +0,0 @@
-.salt-theme {
-  --salt-selectable-cursor-hover: pointer;
-  --salt-selectable-cursor-selected: pointer;
-  --salt-selectable-cursor-blurSelected: pointer;
-  --salt-selectable-cursor-disabled: not-allowed;
-
-  --salt-selectable-borderStyle: solid;
-  --salt-selectable-borderStyle-hover: solid;
-  --salt-selectable-borderStyle-selected: solid;
-  --salt-selectable-borderStyle-blurSelected: solid;
-
-  --salt-selectable-borderColor: var(--salt-palette-interact-border);
-  --salt-selectable-borderColor-hover: var(--salt-palette-interact-border-hover);
-  --salt-selectable-borderColor-selected: var(--salt-palette-interact-border-active);
-  --salt-selectable-borderColor-selectedDisabled: var(--salt-palette-interact-border-activeDisabled);
-  --salt-selectable-borderColor-disabled: var(--salt-palette-interact-border-disabled);
-
-  --salt-selectable-foreground-partial: var(--salt-palette-interact-foreground-partial);
-  --salt-selectable-foreground-partialDisabled: var(--salt-palette-interact-foreground-partialDisabled);
-
-  --salt-selectable-background: var(--salt-palette-interact-background);
-  --salt-selectable-background-hover: var(--salt-palette-interact-background-hover);
-  --salt-selectable-background-selected: var(--salt-palette-interact-background-active);
-  --salt-selectable-background-blurSelected: var(--salt-palette-interact-background-blurSelected);
-  --salt-selectable-background-disabled: var(--salt-palette-interact-background-disabled);
-
-  --salt-selectable-cta-foreground: var(--salt-palette-interact-foreground);
-  --salt-selectable-cta-foreground-hover: var(--salt-palette-interact-cta-foreground-hover);
-  --salt-selectable-cta-foreground-selected: var(--salt-palette-interact-cta-foreground-active);
-  --salt-selectable-cta-foreground-selectedDisabled: var(--salt-palette-interact-cta-foreground-activeDisabled);
-  --salt-selectable-cta-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
-  --salt-selectable-cta-background: var(--salt-palette-interact-background);
-  --salt-selectable-cta-background-disabled: var(--salt-palette-interact-background-disabled);
-  --salt-selectable-cta-background-hover: var(--salt-palette-interact-cta-background-hover);
-  --salt-selectable-cta-background-selected: var(--salt-palette-interact-cta-background-active);
-  --salt-selectable-cta-background-selectedDisabled: var(--salt-palette-interact-cta-background-activeDisabled);
-
-  --salt-selectable-primary-foreground: var(--salt-palette-interact-foreground);
-  --salt-selectable-primary-foreground-selected: var(--salt-palette-interact-primary-foreground-active);
-  --salt-selectable-primary-foreground-selectedDisabled: var(--salt-palette-interact-primary-foreground-activeDisabled);
-  --salt-selectable-primary-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
-  --salt-selectable-primary-foreground-hover: var(--salt-palette-interact-primary-foreground-hover);
-  --salt-selectable-primary-background: var(--salt-palette-interact-background);
-  --salt-selectable-primary-background-disabled: var(--salt-palette-interact-background-disabled);
-  --salt-selectable-primary-background-hover: var(--salt-palette-interact-primary-background-hover);
-  --salt-selectable-primary-background-selected: var(--salt-palette-interact-primary-background-active);
-  --salt-selectable-primary-background-selectedDisabled: var(--salt-palette-interact-primary-background-activeDisabled);
-
-  --salt-selectable-secondary-foreground: var(--salt-palette-interact-foreground);
-  --salt-selectable-secondary-foreground-selected: var(--salt-palette-interact-secondary-foreground-active);
-  --salt-selectable-secondary-foreground-selectedDisabled: var(--salt-palette-interact-secondary-foreground-activeDisabled);
-  --salt-selectable-secondary-foreground-disabled: var(--salt-palette-interact-foreground-disabled);
-  --salt-selectable-secondary-foreground-hover: var(--salt-palette-interact-secondary-foreground-hover);
-  --salt-selectable-secondary-background: var(--salt-palette-interact-background);
-  --salt-selectable-secondary-background-disabled: var(--salt-palette-interact-background-disabled);
-  --salt-selectable-secondary-background-hover: var(--salt-palette-interact-secondary-background-hover);
-  --salt-selectable-secondary-background-selected: var(--salt-palette-interact-secondary-background-active);
-  --salt-selectable-secondary-background-selectedDisabled: var(--salt-palette-interact-secondary-background-activeDisabled);
-}

package/css/characteristics/separable.css

@@ -1,7 +0,0 @@
-.salt-theme {
-  --salt-separable-borderStyle: solid;
-
-  --salt-separable-primary-borderColor: var(--salt-palette-neutral-primary-separator);
-  --salt-separable-secondary-borderColor: var(--salt-palette-neutral-secondary-separator);
-  --salt-separable-tertiary-borderColor: var(--salt-palette-neutral-tertiary-separator);
-}

package/css/characteristics/status.css

@@ -1,16 +0,0 @@
-.salt-theme {
-  --salt-status-info-foreground: var(--salt-palette-info-foreground);
-  --salt-status-success-foreground: var(--salt-palette-success-foreground);
-  --salt-status-warning-foreground: var(--salt-palette-warning-foreground);
-  --salt-status-error-foreground: var(--salt-palette-error-foreground);
-
-  --salt-status-info-borderColor: var(--salt-palette-info-border);
-  --salt-status-success-borderColor: var(--salt-palette-success-border);
-  --salt-status-warning-borderColor: var(--salt-palette-warning-border);
-  --salt-status-error-borderColor: var(--salt-palette-error-border);
-
-  --salt-status-info-background-emphasize: var(--salt-palette-info-background-emphasize);
-  --salt-status-success-background-emphasize: var(--salt-palette-success-background-emphasize);
-  --salt-status-warning-background-emphasize: var(--salt-palette-warning-background-emphasize);
-  --salt-status-error-background-emphasize: var(--salt-palette-error-background-emphasize);
-}

package/css/characteristics/taggable.css

@@ -1,15 +0,0 @@
-.salt-theme {
-  --salt-taggable-cursor-hover: pointer;
-  --salt-taggable-cursor-active: pointer;
-  --salt-taggable-cursor-disabled: not-allowed;
-
-  --salt-taggable-background: var(--salt-palette-interact-primary-background);
-  --salt-taggable-background-hover: var(--salt-palette-interact-primary-background-hover);
-  --salt-taggable-background-active: var(--salt-palette-interact-primary-background-active);
-  --salt-taggable-background-disabled: var(--salt-palette-interact-primary-background-disabled);
-
-  --salt-taggable-foreground: var(--salt-palette-interact-primary-foreground);
-  --salt-taggable-foreground-hover: var(--salt-palette-interact-primary-foreground-hover);
-  --salt-taggable-foreground-active: var(--salt-palette-interact-primary-foreground-active);
-  --salt-taggable-foreground-disabled: var(--salt-palette-interact-primary-foreground-disabled);
-}

package/css/characteristics/target.css

@@ -1,10 +0,0 @@
-.salt-theme {
-  --salt-target-background-hover: var(--salt-palette-interact-background-hover);
-
-  --salt-target-borderColor-hover: var(--salt-palette-interact-border-hover);
-  --salt-target-borderStyle: dashed;
-  --salt-target-borderStyle-hover: solid;
-  --salt-target-borderStyle-disabled: dashed;
-
-  --salt-target-cursor-disabled: not-allowed;
-}

package/css/characteristics/text.css

@@ -1,192 +0,0 @@
-.salt-theme {
-  /* Misc */
-  --salt-text-letterSpacing: 0;
-  --salt-text-textAlign: left;
-  --salt-text-textAlign-embedded: center;
-  --salt-text-textDecoration: none;
-  --salt-text-textTransform: none;
-
-  /* Body text (should be used as default) */
-  --salt-text-fontFamily: var(--salt-typography-fontFamily);
-  --salt-text-fontWeight: var(--salt-typography-fontWeight-regular);
-  --salt-text-fontWeight-small: var(--salt-typography-fontWeight-light);
-  --salt-text-fontWeight-strong: var(--salt-typography-fontWeight-semiBold);
-
-  /* H1 */
-  --salt-text-h1-fontWeight: var(--salt-typography-fontWeight-bold);
-  --salt-text-h1-fontWeight-small: var(--salt-typography-fontWeight-medium);
-  --salt-text-h1-fontWeight-strong: var(--salt-typography-fontWeight-extraBold);
-
-  /* H2 */
-  --salt-text-h2-fontWeight: var(--salt-typography-fontWeight-semiBold);
-  --salt-text-h2-fontWeight-small: var(--salt-typography-fontWeight-regular);
-  --salt-text-h2-fontWeight-strong: var(--salt-typography-fontWeight-bold);
-
-  /* H3 */
-  --salt-text-h3-fontWeight: var(--salt-typography-fontWeight-semiBold);
-  --salt-text-h3-fontWeight-small: var(--salt-typography-fontWeight-regular);
-  --salt-text-h3-fontWeight-strong: var(--salt-typography-fontWeight-bold);
-
-  /* H4 */
-  --salt-text-h4-fontWeight: var(--salt-typography-fontWeight-semiBold);
-  --salt-text-h4-fontWeight-small: var(--salt-typography-fontWeight-regular);
-  --salt-text-h4-fontWeight-strong: var(--salt-typography-fontWeight-bold);
-
-  /* Label */
-  --salt-text-label-fontWeight: var(--salt-typography-fontWeight-regular);
-  --salt-text-label-fontWeight-small: var(--salt-typography-fontWeight-light);
-  --salt-text-label-fontWeight-strong: var(--salt-typography-fontWeight-semiBold);
-
-  /* Display text */
-  --salt-text-display1-fontWeight: var(--salt-typography-fontWeight-semiBold);
-  --salt-text-display1-fontWeight-strong: var(--salt-typography-fontWeight-bold);
-  --salt-text-display1-fontWeight-small: var(--salt-typography-fontWeight-regular);
-
-  --salt-text-display2-fontWeight: var(--salt-typography-fontWeight-semiBold);
-  --salt-text-display2-fontWeight-strong: var(--salt-typography-fontWeight-bold);
-  --salt-text-display2-fontWeight-small: var(--salt-typography-fontWeight-regular);
-
-  --salt-text-display3-fontWeight: var(--salt-typography-fontWeight-semiBold);
-  --salt-text-display3-fontWeight-strong: var(--salt-typography-fontWeight-bold);
-  --salt-text-display3-fontWeight-small: var(--salt-typography-fontWeight-regular);
-
-  /* Colors */
-  --salt-text-background-selected: var(--salt-palette-interact-background-active);
-
-  --salt-text-primary-foreground: var(--salt-palette-neutral-primary-foreground);
-  --salt-text-primary-foreground-disabled: var(--salt-palette-neutral-primary-foreground-disabled);
-  --salt-text-secondary-foreground: var(--salt-palette-neutral-secondary-foreground);
-  --salt-text-secondary-foreground-disabled: var(--salt-palette-neutral-secondary-foreground-disabled);
-
-  /* Link */
-  --salt-text-link-foreground-hover: var(--salt-palette-navigate-foreground-hover);
-  --salt-text-link-foreground-active: var(--salt-palette-navigate-foreground-active);
-  --salt-text-link-foreground-visited: var(--salt-palette-navigate-foreground-visited);
-  --salt-text-link-textDecoration: underline;
-  --salt-text-link-textDecoration-hover: none;
-  --salt-text-link-textDecoration-selected: underline;
-
-  /* Code */
-  --salt-text-code-fontFamily: var(--salt-typography-fontFamily-code);
-}
-
-/* Sizes by density */
-.salt-density-touch {
-  --salt-text-h1-fontSize: 42px;
-  --salt-text-h1-lineHeight: 54px;
-
-  --salt-text-h2-fontSize: 32px;
-  --salt-text-h2-lineHeight: 42px;
-
-  --salt-text-h3-fontSize: 24px;
-  --salt-text-h3-lineHeight: 32px;
-
-  --salt-text-h4-fontSize: 16px;
-  --salt-text-h4-lineHeight: 20px;
-
-  --salt-text-label-fontSize: 14px;
-  --salt-text-label-lineHeight: 18px;
-
-  --salt-text-fontSize: 16px;
-  --salt-text-lineHeight: 20px;
-  --salt-text-minHeight: 20px;
-
-  --salt-text-display1-fontSize: 84px;
-  --salt-text-display1-lineHeight: 109px;
-
-  --salt-text-display2-fontSize: 58px;
-  --salt-text-display2-lineHeight: 76px;
-
-  --salt-text-display3-fontSize: 42px;
-  --salt-text-display3-lineHeight: 54px;
-}
-
-.salt-density-low {
-  --salt-text-h1-fontSize: 32px;
-  --salt-text-h1-lineHeight: 42px;
-
-  --salt-text-h2-fontSize: 24px;
-  --salt-text-h2-lineHeight: 32px;
-
-  --salt-text-h3-fontSize: 18px;
-  --salt-text-h3-lineHeight: 24px;
-
-  --salt-text-h4-fontSize: 14px;
-  --salt-text-h4-lineHeight: 18px;
-
-  --salt-text-label-fontSize: 12px;
-  --salt-text-label-lineHeight: 16px;
-
-  --salt-text-fontSize: 14px;
-  --salt-text-lineHeight: 18px;
-  --salt-text-minHeight: 18px;
-
-  --salt-text-display1-fontSize: 68px;
-  --salt-text-display1-lineHeight: 88px;
-
-  --salt-text-display2-fontSize: 46px;
-  --salt-text-display2-lineHeight: 60px;
-
-  --salt-text-display3-fontSize: 32px;
-  --salt-text-display3-lineHeight: 42px;
-}
-
-.salt-density-medium {
-  --salt-text-h1-fontSize: 24px;
-  --salt-text-h1-lineHeight: 32px;
-
-  --salt-text-h2-fontSize: 18px;
-  --salt-text-h2-lineHeight: 24px;
-
-  --salt-text-h3-fontSize: 14px;
-  --salt-text-h3-lineHeight: 18px;
-
-  --salt-text-h4-fontSize: 12px;
-  --salt-text-h4-lineHeight: 16px;
-
-  --salt-text-label-fontSize: 11px;
-  --salt-text-label-lineHeight: 14px;
-
-  --salt-text-fontSize: 12px;
-  --salt-text-lineHeight: 16px;
-  --salt-text-minHeight: 16px;
-
-  --salt-text-display1-fontSize: 54px;
-  --salt-text-display1-lineHeight: 70px;
-
-  --salt-text-display2-fontSize: 36px;
-  --salt-text-display2-lineHeight: 47px;
-
-  --salt-text-display3-fontSize: 24px;
-  --salt-text-display3-lineHeight: 32px;
-}
-
-.salt-density-high {
-  --salt-text-h1-fontSize: 18px;
-  --salt-text-h1-lineHeight: 24px;
-
-  --salt-text-h2-fontSize: 14px;
-  --salt-text-h2-lineHeight: 18px;
-
-  --salt-text-h3-fontSize: 12px;
-  --salt-text-h3-lineHeight: 16px;
-
-  --salt-text-h4-fontSize: 11px;
-  --salt-text-h4-lineHeight: 14px;
-
-  --salt-text-label-fontSize: 10px;
-  --salt-text-label-lineHeight: 13px;
-
-  --salt-text-fontSize: 11px;
-  --salt-text-lineHeight: 14px;
-  --salt-text-minHeight: 14px;
-
-  --salt-text-display1-fontSize: 42px;
-  --salt-text-display1-lineHeight: 54px;
-
-  --salt-text-display2-fontSize: 28px;
-  --salt-text-display2-lineHeight: 36px;
-
-  --salt-text-display3-fontSize: 18px;
-  --salt-text-display3-lineHeight: 24px;
-}

package/css/foundations/animation.css

@@ -1,155 +0,0 @@
-.salt-density-touch,
-.salt-density-low,
-.salt-density-medium,
-.salt-density-high {
-  --salt-animation-opacity-start: 0;
-  --salt-animation-opacity-end: 1;
-  --salt-animation-scale-start: 0;
-  --salt-animation-scale-end: 1;
-  --salt-animation-transform-start: 100%;
-  --salt-animation-transform-end: 0;
-  --salt-animation-duration: 0.3s;
-  --salt-animation-timing-function: ease-in;
-
-  /* Slide Animations */
-  --salt-animation-slide-in-top: slide-in-top var(--salt-animation-duration) var(--salt-animation-timing-function);
-  --salt-animation-slide-in-left: slide-in-left var(--salt-animation-duration) var(--salt-animation-timing-function);
-  --salt-animation-slide-in-right: slide-in-right var(--salt-animation-duration) var(--salt-animation-timing-function);
-  --salt-animation-slide-in-bottom: slide-in-bottom var(--salt-animation-duration) var(--salt-animation-timing-function);
-
-  --salt-animation-slide-out-top: slide-out-top var(--salt-animation-duration) var(--salt-animation-timing-function);
-  --salt-animation-slide-out-left: slide-out-left var(--salt-animation-duration) var(--salt-animation-timing-function);
-  --salt-animation-slide-out-right: slide-out-right var(--salt-animation-duration) var(--salt-animation-timing-function);
-  --salt-animation-slide-out-bottom: slide-out-bottom var(--salt-animation-duration) var(--salt-animation-timing-function);
-
-  /* Fade Animations */
-  --salt-animation-fade-in-back: fade-in-back var(--salt-animation-duration) var(--salt-animation-timing-function);
-  --salt-animation-fade-in-forward: fade-in-forward var(--salt-animation-duration) var(--salt-animation-timing-function);
-  --salt-animation-fade-in-center: fade-in-center var(--salt-animation-duration) var(--salt-animation-timing-function);
-  --salt-animation-fade-out-back: fade-out-back var(--salt-animation-duration) ease-out both;
-}
-
-/*Slide keyframes */
-@keyframes slide-in-top {
-  0% {
-    opacity: var(--salt-animation-opacity-start);
-    transform: translateY(var(--salt-animation-transform-start));
-  }
-  100% {
-    opacity: var(--salt-animation-opacity-end);
-    transform: translateY(var(--salt-animation-transform-end));
-  }
-}
-@keyframes slide-out-top {
-  0% {
-    opacity: var(--salt-animation-opacity-end);
-    transform: translateY(var(--salt-animation-transform-end));
-  }
-  100% {
-    opacity: var(--salt-animation-opacity-start);
-    transform: translateY(var(--salt-animation-transform-start));
-  }
-}
-@keyframes slide-in-left {
-  0% {
-    opacity: var(--salt-animation-opacity-start);
-    transform: translateX(calc(-1 * var(--salt-animation-transform-start)));
-  }
-  100% {
-    opacity: var(--salt-animation-opacity-end);
-    transform: translateX(var(--salt-animation-transform-end));
-  }
-}
-@keyframes slide-out-left {
-  0% {
-    opacity: var(--salt-animation-opacity-end);
-    transform: translateX(var(--salt-animation-transform-end));
-  }
-  100% {
-    opacity: var(--salt-animation-opacity-start);
-    transform: translateX(calc(-1 * var(--salt-animation-transform-start)));
-  }
-}
-@keyframes slide-in-right {
-  0% {
-    opacity: var(--salt-animation-opacity-start);
-    transform: translateX(var(--salt-animation-transform-start));
-  }
-  100% {
-    opacity: var(--salt-animation-opacity-end);
-    transform: translateX(var(--salt-animation-transform-end));
-  }
-}
-@keyframes slide-out-right {
-  0% {
-    opacity: var(--salt-animation-opacity-end);
-    transform: translateX(var(--salt-animation-transform-end));
-  }
-  100% {
-    opacity: var(--salt-animation-opacity-start);
-    transform: translateX(var(--salt-animation-transform-start));
-  }
-}
-@keyframes slide-in-bottom {
-  0% {
-    opacity: var(--salt-animation-opacity-start);
-    transform: translateY(calc(-1 * var(--salt-animation-transform-start)));
-  }
-  100% {
-    opacity: var(--salt-animation-opacity-end);
-    transform: translateY(var(--salt-animation-transform-end));
-  }
-}
-@keyframes slide-out-bottom {
-  0% {
-    opacity: var(--salt-animation-opacity-end);
-    transform: translateY(var(--salt-animation-transform-end));
-  }
-  100% {
-    opacity: var(--salt-animation-opacity-start);
-    transform: translateY(calc(-1 * var(--salt-animation-transform-start)));
-  }
-}
-/* Fade keyframes */
-@keyframes fade-in-back {
-  0% {
-    --salt-animation-scale-start: 1.4;
-    opacity: var(--salt-animation-opacity-start);
-    transform: scale(var(--salt-animation-scale-start));
-  }
-
-  100% {
-    opacity: var(--salt-animation-opacity-end);
-    transform: scale(var(--salt-animation-scale-end));
-  }
-}
-@keyframes fade-in-forward {
-  0% {
-    --salt-animation-scale-start: 0.6;
-    opacity: var(--salt-animation-opacity-start);
-    transform: scale(var(--salt-animation-scale-start));
-  }
-
-  100% {
-    opacity: var(--salt-animation-opacity-end);
-    transform: scale(var(--salt-animation-scale-end));
-  }
-}
-@keyframes fade-in-center {
-  0% {
-    opacity: var(--salt-animation-opacity-start);
-  }
-
-  100% {
-    opacity: var(--salt-animation-opacity-end);
-  }
-}
-
-@keyframes fade-out-back {
-  0% {
-    opacity: var(--salt-animation-opacity-end);
-  }
-  100% {
-    opacity: var(--salt-animation-opacity-start);
-  }
-}

package/css/foundations/color.css

@@ -1,114 +0,0 @@
-.salt-theme {
-  /* Color palette will stay the same no matter of theming */
-  --salt-color-white: rgb(255, 255, 255);
-  --salt-color-black: rgb(0, 0, 0);
-
-  --salt-color-red-10: rgb(255, 227, 224);
-  --salt-color-red-20: rgb(255, 207, 201);
-  --salt-color-red-30: rgb(255, 187, 178);
-  --salt-color-red-40: rgb(255, 167, 156);
-  --salt-color-red-50: rgb(255, 148, 133);
-  --salt-color-red-100: rgb(255, 128, 111);
-  --salt-color-red-200: rgb(255, 108, 88);
-  --salt-color-red-300: rgb(255, 89, 66);
-  --salt-color-red-400: rgb(237, 65, 42);
-  --salt-color-red-500: rgb(227, 43, 22);
-  --salt-color-red-600: rgb(196, 32, 16);
-  --salt-color-red-700: rgb(166, 21, 11);
-  --salt-color-red-800: rgb(136, 10, 5);
-  --salt-color-red-900: rgb(65, 37, 34);
-
-  --salt-color-orange-10: rgb(255, 232, 191);
-  --salt-color-orange-20: rgb(254, 223, 166);
-  --salt-color-orange-30: rgb(254, 214, 142);
-  --salt-color-orange-40: rgb(254, 205, 118);
-  --salt-color-orange-50: rgb(254, 197, 94);
-  --salt-color-orange-100: rgb(250, 181, 81);
-  --salt-color-orange-200: rgb(246, 165, 68);
-  --salt-color-orange-300: rgb(242, 149, 56);
-  --salt-color-orange-400: rgb(238, 133, 43);
-  --salt-color-orange-500: rgb(234, 115, 25);
-  --salt-color-orange-600: rgb(224, 101, 25);
-  --salt-color-orange-700: rgb(214, 85, 19);
-  --salt-color-orange-800: rgb(204, 68, 13);
-  --salt-color-orange-900: rgb(54, 44, 36);
-
-  --salt-color-green-10: rgb(209, 244, 201);
-  --salt-color-green-20: rgb(184, 232, 182);
-  --salt-color-green-30: rgb(160, 221, 164);
-  --salt-color-green-40: rgb(136, 210, 145);
-  --salt-color-green-50: rgb(112, 199, 127);
-  --salt-color-green-100: rgb(93, 189, 116);
-  --salt-color-green-200: rgb(77, 180, 105);
-  --salt-color-green-300: rgb(60, 171, 96);
-  --salt-color-green-400: rgb(48, 156, 90);
-  --salt-color-green-500: rgb(36, 135, 75);
-  --salt-color-green-600: rgb(24, 114, 61);
-  --salt-color-green-700: rgb(12, 93, 46);
-  --salt-color-green-800: rgb(1, 73, 32);
-  --salt-color-green-900: rgb(35, 52, 43);
-
-  --salt-color-teal-10: rgb(218, 240, 240);
-  --salt-color-teal-20: rgb(199, 232, 232);
-  --salt-color-teal-30: rgb(180, 224, 225);
-  --salt-color-teal-40: rgb(162, 217, 218);
-  --salt-color-teal-50: rgb(141, 205, 209);
-  --salt-color-teal-100: rgb(123, 193, 200);
-  --salt-color-teal-200: rgb(99, 181, 192);
-  --salt-color-teal-300: rgb(73, 160, 172);
-  --salt-color-teal-400: rgb(48, 149, 166);
-  --salt-color-teal-500: rgb(0, 130, 151);
-  --salt-color-teal-600: rgb(27, 107, 133);
-  --salt-color-teal-700: rgb(0, 85, 113);
-  --salt-color-teal-800: rgb(1, 65, 86);
-  --salt-color-teal-900: rgb(0, 49, 76);
-
-  --salt-color-blue-10: rgb(203, 231, 249);
-  --salt-color-blue-20: rgb(183, 222, 246);
-  --salt-color-blue-30: rgb(164, 213, 244);
-  --salt-color-blue-40: rgb(144, 204, 242);
-  --salt-color-blue-50: rgb(125, 195, 240);
-  --salt-color-blue-100: rgb(100, 177, 228);
-  --salt-color-blue-200: rgb(75, 159, 216);
-  --salt-color-blue-300: rgb(51, 141, 205);
-  --salt-color-blue-400: rgb(46, 132, 198);
-  --salt-color-blue-500: rgb(38, 112, 169);
-  --salt-color-blue-600: rgb(21, 92, 147);
-  --salt-color-blue-700: rgb(0, 71, 123);
-  --salt-color-blue-800: rgb(39, 60, 77);
-  --salt-color-blue-900: rgb(35, 47, 56);
-
-  --salt-color-purple-10: rgb(249, 224, 247);
-  --salt-color-purple-20: rgb(247, 212, 244);
-  --salt-color-purple-30: rgb(245, 201, 241);
-  --salt-color-purple-40: rgb(243, 189, 238);
-  --salt-color-purple-50: rgb(241, 178, 235);
-  --salt-color-purple-100: rgb(223, 156, 225);
-  --salt-color-purple-200: rgb(205, 135, 215);
-  --salt-color-purple-300: rgb(192, 116, 203);
-  --salt-color-purple-400: rgb(169, 97, 181);
-  --salt-color-purple-500: rgb(150, 78, 162);
-  --salt-color-purple-600: rgb(129, 60, 141);
-  --salt-color-purple-700: rgb(103, 46, 122);
-  --salt-color-purple-800: rgb(83, 37, 109);
-  --salt-color-purple-900: rgb(59, 16, 84);
-
-  --salt-color-gray-10: rgb(242, 244, 246);
-  --salt-color-gray-20: rgb(234, 237, 239);
-  --salt-color-gray-30: rgb(224, 228, 233);
-  --salt-color-gray-40: rgb(217, 221, 227);
-  --salt-color-gray-50: rgb(206, 210, 217);
-  --salt-color-gray-60: rgb(197, 201, 208);
-  --salt-color-gray-70: rgb(180, 183, 190);
-  --salt-color-gray-80: rgb(159, 163, 170);
-  --salt-color-gray-90: rgb(132, 135, 142);
-  --salt-color-gray-100: rgb(116, 119, 127);
-  --salt-color-gray-200: rgb(97, 101, 110);
-  --salt-color-gray-300: rgb(76, 80, 91);
-  --salt-color-gray-400: rgb(68, 72, 79);
-  --salt-color-gray-500: rgb(59, 63, 70);
-  --salt-color-gray-600: rgb(47, 49, 54);
-  --salt-color-gray-700: rgb(42, 44, 47);
-  --salt-color-gray-800: rgb(36, 37, 38);
-  --salt-color-gray-900: rgb(22, 22, 22);
-}

package/css/foundations/delay.css

@@ -1,6 +0,0 @@
-.salt-theme {
-  --salt-delay-instant: 100;
-  --salt-delay-perceptible: 300;
-  --salt-delay-notable: 1000;
-  --salt-delay-cutoff: 10000;
-}