tycho-components 0.0.4 → 0.0.5-SNAPSHOT-1

package/src/new-styles/base/_tokens.scss

@@ -1,329 +0,0 @@
-:root {
-  --background-accent: var(--accent-30);
-  --background-default: var(--neutral-light-100);
-  --background-inverse: var(--neutral-dark-99);
-  --border-accent-1: var(--neutral-light-50);
-  --border-accent-2: var(--neutral-light-40);
-  --border-accent-3: var(--accent-20);
-  --border-button: var(--accent-30);
-  --border-button-white: var(--accent-100);
-  --border-error: var(--semantic-danger-50);
-  --border-error-hover: var(--semantic-danger-30);
-  --border-hover: var(--accent-50);
-  --border-only-high-contrast: #ffffff00;
-  --border-subtle-1: var(--neutral-light-90);
-  --border-subtle-2: var(--neutral-light-80);
-  --border-subtle-3: var(--neutral-light-80);
-  --border-subtle-4: var(--neutral-light-100);
-  --button-contrast: #00000000;
-  --button-danger-active: var(--semantic-danger-70);
-  --button-danger-default: var(--semantic-danger-50);
-  --button-danger-hover: var(--semantic-danger-60);
-  --button-primary-active: var(--accent-50);
-  --button-primary-default: var(--accent-30);
-  --button-primary-hover: var(--accent-40);
-  --button-secondary-active: var(--neutral-dark-40);
-  --button-secondary-default: var(--neutral-dark-20);
-  --button-secondary-hover: var(--neutral-dark-30);
-  --button-tertiary-active: var(--accent-90);
-  --button-tertiary-default: var(--accent-100);
-  --button-tertiary-hover: var(--accent-95);
-  --icon-accent: var(--accent-30);
-  --icon-accent-hover: var(--accent-50);
-  --icon-dark-fixed: var(--neutral-light-0);
-  --icon-disabled: var(--neutral-light-70);
-  --icon-error: var(--semantic-danger-40);
-  --icon-error-hover: var(--semantic-danger-30);
-  --icon-error-on-hover: var(--semantic-danger-30);
-  --icon-info: var(--semantic-info-50);
-  --icon-light-fixed: var(--neutral-light-100);
-  --icon-on-color-accent: var(--accent-30);
-  --icon-on-color-dark: var(--neutral-light-0);
-  --icon-on-color-light: var(--neutral-light-100);
-  --icon-on-disabled: var(--neutral-light-60);
-  --icon-placeholder: var(--neutral-light-50);
-  --icon-primary: var(--neutral-light-0);
-  --icon-secondary: var(--neutral-light-30);
-  --icon-success: var(--semantic-success-60);
-  --icon-tertiary: var(--neutral-light-40);
-  --icon-warning: var(--semantic-warning-50);
-  --layer-disabled: var(--neutral-dark-10);
-  --layer-field: var(--neutral-dark-20);
-  --layer-field-active: var(--accent-99);
-  --layer-field-hover: var(--accent-95);
-  --layer-hover-1: var(--neutral-light-95);
-  --layer-hover-2: var(--neutral-light-90);
-  --layer-hover-3: var(--neutral-light-80);
-  --layer-layer-1: var(--neutral-light-99);
-  --layer-layer-2: var(--neutral-light-95);
-  --layer-layer-3: var(--neutral-light-90);
-  --layer-semantic-danger: var(--semantic-danger-95);
-  --layer-semantic-info: var(--semantic-info-95);
-  --layer-semantic-success: var(--semantic-success-95);
-  --layer-semantic-warning: var(--semantic-warning-95);
-  --layer-tooltip: var(--neutral-dark-99);
-  --link-default: var(--semantic-info-40);
-  --link-hover: var(--semantic-info-60);
-  --link-visited: var(--neutral-dark-60);
-  --miscellaneous-brand-gradient-1: #0a5dff00;
-  --miscellaneous-brand-gradient-2: #0a5dff14;
-  --miscellaneous-scrim: #00000080;
-  --miscellaneous-scroll: #00000040;
-  --miscellaneous-scroll-hover: var(--neutral-dark-40);
-  --miscellaneous-shadow-1: #18274b1f;
-  --miscellaneous-shadow-2: #18274b14;
-  --miscellaneous-skeleton: var(--neutral-dark-10);
-  --miscellaneous-skeleton-light: var(--neutral-dark-30);
-  --tag-blue-accent: var(--accent-60);
-  --tag-blue-low: var(--accent-90);
-  --tag-gray-accent: var(--neutral-light-20);
-  --tag-gray-low: var(--neutral-light-90);
-  --tag-green-accent: var(--semantic-success-70);
-  --tag-green-low: var(--semantic-success-90);
-  --tag-red-accent: var(--semantic-danger-50);
-  --tag-red-low: var(--semantic-danger-90);
-  --tag-violet-accent: var(--semantic-info-50);
-  --tag-violet-low: var(--semantic-info-90);
-  --tag-yellow-accent: var(--semantic-warning-80);
-  --tag-yellow-low: var(--semantic-warning-95);
-  --text-accent: var(--accent-30);
-  --text-accent-hover: var(--accent-50);
-  --text-dark-fixed: var(--neutral-light-0);
-  --text-disabled: var(--neutral-light-70);
-  --text-error: var(--semantic-danger-40);
-  --text-error-hover: var(--semantic-danger-30);
-  --text-error-on-hover: var(--semantic-danger-30);
-  --text-info: var(--semantic-info-50);
-  --text-light-fixed: var(--neutral-light-100);
-  --text-on-color-accent: var(--accent-30);
-  --text-on-color-dark: var(--neutral-light-0);
-  --text-on-color-light: var(--neutral-light-100);
-  --text-on-disabled: var(--neutral-light-60);
-  --text-placeholder: var(--neutral-light-50);
-  --text-placeholder-hover: var(--neutral-light-40);
-  --text-primary: var(--neutral-light-0);
-  --text-secondary: var(--neutral-light-30);
-  --text-success: var(--semantic-success-60);
-  --text-tertiary: var(--neutral-light-40);
-  --text-warning: var(--semantic-warning-50);
-}
-
-body.dark-mode {
-  --background-accent: var(--accent-10);
-  --background-default: var(--neutral-dark-99);
-  --background-inverse: var(--neutral-light-100);
-  --border-accent-1: var(--neutral-dark-40);
-  --border-accent-2: var(--neutral-dark-30);
-  --border-accent-3: var(--accent-95);
-  --border-button: var(--accent-60);
-  --border-button-white: var(--accent-100);
-  --border-error: var(--semantic-danger-70);
-  --border-error-hover: var(--semantic-danger-80);
-  --border-hover: var(--accent-80);
-  --border-only-high-contrast: #ffffff00;
-  --border-subtle-1: var(--neutral-dark-80);
-  --border-subtle-2: var(--neutral-dark-70);
-  --border-subtle-3: var(--neutral-dark-70);
-  --border-subtle-4: var(--neutral-dark-100);
-  --button-contrast: #00000000;
-  --button-danger-active: var(--semantic-danger-80);
-  --button-danger-default: var(--semantic-danger-60);
-  --button-danger-hover: var(--semantic-danger-70);
-  --button-primary-active: var(--accent-80);
-  --button-primary-default: var(--accent-60);
-  --button-primary-hover: var(--accent-70);
-  --button-secondary-active: var(--neutral-light-20);
-  --button-secondary-default: var(--neutral-light-0);
-  --button-secondary-hover: var(--neutral-light-10);
-  --button-tertiary-active: var(--accent-40);
-  --button-tertiary-default: var(--accent-10);
-  --button-tertiary-hover: var(--accent-20);
-  --icon-accent: var(--accent-80);
-  --icon-accent-hover: var(--accent-60);
-  --icon-dark-fixed: var(--neutral-dark-100);
-  --icon-disabled: var(--neutral-dark-70);
-  --icon-error: var(--semantic-danger-70);
-  --icon-error-hover: var(--semantic-danger-80);
-  --icon-error-on-hover: var(--semantic-danger-80);
-  --icon-info: var(--semantic-info-80);
-  --icon-light-fixed: var(--neutral-dark-0);
-  --icon-on-color-accent: var(--accent-95);
-  --icon-on-color-dark: var(--neutral-dark-0);
-  --icon-on-color-light: var(--neutral-dark-100);
-  --icon-on-disabled: var(--neutral-dark-60);
-  --icon-placeholder: var(--neutral-dark-50);
-  --icon-primary: var(--neutral-dark-0);
-  --icon-secondary: var(--neutral-dark-30);
-  --icon-success: var(--semantic-success-80);
-  --icon-tertiary: var(--neutral-dark-40);
-  --icon-warning: var(--semantic-warning-70);
-  --layer-disabled: var(--neutral-dark-95);
-  --layer-field: var(--neutral-light-30);
-  --layer-field-active: var(--neutral-dark-100);
-  --layer-field-hover: var(--neutral-dark-80);
-  --layer-hover-1: var(--neutral-dark-90);
-  --layer-hover-2: var(--neutral-dark-80);
-  --layer-hover-3: var(--neutral-dark-70);
-  --layer-layer-1: var(--neutral-dark-95);
-  --layer-layer-2: var(--neutral-dark-90);
-  --layer-layer-3: var(--neutral-light-80);
-  --layer-semantic-danger: var(--semantic-danger-20);
-  --layer-semantic-info: var(--semantic-info-20);
-  --layer-semantic-success: var(--semantic-success-20);
-  --layer-semantic-warning: var(--semantic-warning-40);
-  --layer-tooltip: var(--neutral-dark-0);
-  --link-default: var(--semantic-info-80);
-  --link-hover: var(--semantic-info-50);
-  --link-visited: var(--neutral-dark-40);
-  --miscellaneous-brand-gradient-1: #0a5dff00;
-  --miscellaneous-brand-gradient-2: #0a5dff26;
-  --miscellaneous-scrim: #000000b2;
-  --miscellaneous-scroll: var(--neutral-dark-80);
-  --miscellaneous-scroll-hover: var(--neutral-dark-60);
-  --miscellaneous-shadow-1: #000000e5;
-  --miscellaneous-shadow-2: #000000b2;
-  --miscellaneous-skeleton: var(--neutral-dark-99);
-  --miscellaneous-skeleton-light: var(--neutral-dark-80);
-  --tag-blue-accent: var(--accent-60);
-  --tag-blue-low: var(--accent-40);
-  --tag-gray-accent: var(--neutral-dark-20);
-  --tag-gray-low: var(--neutral-dark-80);
-  --tag-green-accent: var(--semantic-success-80);
-  --tag-green-low: var(--semantic-success-40);
-  --tag-red-accent: var(--semantic-danger-70);
-  --tag-red-low: var(--semantic-danger-20);
-  --tag-violet-accent: var(--semantic-info-80);
-  --tag-violet-low: var(--semantic-info-20);
-  --tag-yellow-accent: var(--semantic-warning-80);
-  --tag-yellow-low: var(--semantic-warning-20);
-  --text-accent: var(--accent-80);
-  --text-accent-hover: var(--accent-60);
-  --text-dark-fixed: var(--neutral-dark-100);
-  --text-disabled: var(--neutral-dark-70);
-  --text-error: var(--semantic-danger-70);
-  --text-error-hover: var(--semantic-danger-80);
-  --text-error-on-hover: var(--semantic-danger-80);
-  --text-info: var(--semantic-info-80);
-  --text-light-fixed: var(--neutral-dark-0);
-  --text-on-color-accent: var(--accent-95);
-  --text-on-color-dark: var(--neutral-dark-0);
-  --text-on-color-light: var(--neutral-dark-100);
-  --text-on-disabled: var(--neutral-dark-60);
-  --text-placeholder: var(--neutral-dark-50);
-  --text-placeholder-hover: var(--neutral-dark-40);
-  --text-primary: var(--neutral-dark-0);
-  --text-secondary: var(--neutral-dark-30);
-  --text-success: var(--semantic-success-80);
-  --text-tertiary: var(--neutral-dark-40);
-  --text-warning: var(--semantic-warning-70);
-}
-
-body.high-contrast {
-  --background-accent: var(--high-contrast-dark);
-  --background-default: var(--high-contrast-dark);
-  --background-inverse: var(--high-contrast-dark);
-  --border-accent-1: var(--high-contrast-light);
-  --border-accent-2: var(--high-contrast-light);
-  --border-accent-3: var(--high-contrast-light);
-  --border-button: var(--high-contrast-light);
-  --border-button-white: var(--high-contrast-light);
-  --border-error: var(--high-contrast-light);
-  --border-error-hover: var(--high-contrast-yellow);
-  --border-hover: var(--high-contrast-yellow);
-  --border-only-high-contrast: var(--high-contrast-light);
-  --border-subtle-1: var(--high-contrast-light);
-  --border-subtle-2: var(--high-contrast-light);
-  --border-subtle-3: var(--high-contrast-light);
-  --border-subtle-4: var(--high-contrast-light);
-  --button-contrast: var(--high-contrast-dark);
-  --button-danger-active: var(--high-contrast-blue);
-  --button-danger-default: var(--high-contrast-light);
-  --button-danger-hover: var(--high-contrast-yellow);
-  --button-primary-active: var(--high-contrast-blue);
-  --button-primary-default: var(--high-contrast-light);
-  --button-primary-hover: var(--high-contrast-yellow);
-  --button-secondary-active: var(--high-contrast-light);
-  --button-secondary-default: var(--high-contrast-light);
-  --button-secondary-hover: var(--high-contrast-green);
-  --button-tertiary-active: var(--high-contrast-blue);
-  --button-tertiary-default: var(--high-contrast-light);
-  --button-tertiary-hover: var(--high-contrast-yellow);
-  --icon-accent: var(--high-contrast-light);
-  --icon-accent-hover: var(--high-contrast-yellow);
-  --icon-dark-fixed: var(--high-contrast-dark);
-  --icon-disabled: var(--high-contrast-light);
-  --icon-error: var(--high-contrast-light);
-  --icon-error-hover: var(--high-contrast-yellow);
-  --icon-error-on-hover: var(--high-contrast-dark);
-  --icon-info: var(--high-contrast-light);
-  --icon-light-fixed: var(--high-contrast-light);
-  --icon-on-color-accent: var(--high-contrast-dark);
-  --icon-on-color-dark: var(--high-contrast-dark);
-  --icon-on-color-light: var(--high-contrast-dark);
-  --icon-on-disabled: var(--high-contrast-dark);
-  --icon-placeholder: var(--high-contrast-dark);
-  --icon-primary: var(--high-contrast-light);
-  --icon-secondary: var(--high-contrast-yellow);
-  --icon-success: var(--high-contrast-light);
-  --icon-tertiary: var(--high-contrast-green);
-  --icon-warning: var(--high-contrast-light);
-  --layer-disabled: var(--high-contrast-light);
-  --layer-field: var(--high-contrast-light);
-  --layer-field-active: var(--high-contrast-blue);
-  --layer-field-hover: var(--high-contrast-yellow);
-  --layer-hover-1: var(--high-contrast-yellow);
-  --layer-hover-2: var(--high-contrast-yellow);
-  --layer-hover-3: var(--high-contrast-yellow);
-  --layer-layer-1: var(--high-contrast-dark);
-  --layer-layer-2: var(--high-contrast-dark);
-  --layer-layer-3: var(--high-contrast-dark);
-  --layer-semantic-danger: var(--high-contrast-dark);
-  --layer-semantic-info: var(--high-contrast-dark);
-  --layer-semantic-success: var(--high-contrast-dark);
-  --layer-semantic-warning: var(--high-contrast-dark);
-  --layer-tooltip: var(--high-contrast-light);
-  --link-default: var(--high-contrast-light);
-  --link-hover: var(--high-contrast-yellow);
-  --link-visited: var(--high-contrast-blue);
-  --miscellaneous-brand-gradient-1: var(--high-contrast-dark);
-  --miscellaneous-brand-gradient-2: var(--high-contrast-dark);
-  --miscellaneous-scrim: #000000e5;
-  --miscellaneous-scroll: var(--high-contrast-light);
-  --miscellaneous-scroll-hover: var(--high-contrast-yellow);
-  --miscellaneous-shadow-1: #00000000;
-  --miscellaneous-shadow-2: #00000000;
-  --miscellaneous-skeleton: var(--high-contrast-dark);
-  --miscellaneous-skeleton-light: var(--high-contrast-light);
-  --tag-blue-accent: var(--high-contrast-green);
-  --tag-blue-low: var(--high-contrast-light);
-  --tag-gray-accent: var(--high-contrast-green);
-  --tag-gray-low: var(--high-contrast-light);
-  --tag-green-accent: var(--high-contrast-green);
-  --tag-green-low: var(--high-contrast-light);
-  --tag-red-accent: var(--high-contrast-green);
-  --tag-red-low: var(--high-contrast-light);
-  --tag-violet-accent: var(--high-contrast-green);
-  --tag-violet-low: var(--high-contrast-light);
-  --tag-yellow-accent: var(--high-contrast-green);
-  --tag-yellow-low: var(--high-contrast-light);
-  --text-accent: var(--high-contrast-light);
-  --text-accent-hover: var(--high-contrast-yellow);
-  --text-dark-fixed: var(--high-contrast-dark);
-  --text-disabled: var(--high-contrast-light);
-  --text-error: var(--high-contrast-light);
-  --text-error-hover: var(--high-contrast-yellow);
-  --text-error-on-hover: var(--high-contrast-dark);
-  --text-info: var(--high-contrast-light);
-  --text-light-fixed: var(--high-contrast-light);
-  --text-on-color-accent: var(--high-contrast-dark);
-  --text-on-color-dark: var(--high-contrast-dark);
-  --text-on-color-light: var(--high-contrast-dark);
-  --text-on-disabled: var(--high-contrast-dark);
-  --text-placeholder: var(--high-contrast-yellow);
-  --text-placeholder-hover: var(--high-contrast-dark);
-  --text-primary: var(--high-contrast-light);
-  --text-secondary: var(--high-contrast-yellow);
-  --text-success: var(--high-contrast-light);
-  --text-tertiary: var(--high-contrast-green);
-  --text-warning: var(--high-contrast-light);
-}

package/src/new-styles/base/_typographs.scss

@@ -1,348 +0,0 @@
-// typographs styles
-
-@mixin button-large {
-  font-size: 20px;
-  font-weight: 600;
-  line-height: 100%;
-  letter-spacing: 0.32px;
-}
-
-@mixin button-medium {
-  font-size: 16px;
-  font-weight: 600;
-  line-height: 100%;
-  letter-spacing: 0.32px;
-  text-transform: uppercase;
-}
-
-@mixin button-small {
-  font-size: 14px;
-  font-weight: 700;
-  line-height: 100%;
-  letter-spacing: 0.32px;
-  text-transform: uppercase;
-}
-
-@mixin label-large-1 {
-  font-size: 20px;
-  font-weight: 400;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin label-large-2 {
-  font-size: 20px;
-  font-weight: 700;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin label-medium-1 {
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin label-medium-2 {
-  font-size: 16px;
-  font-weight: 700;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin label-small-1 {
-  font-size: 14px;
-  font-weight: 400;
-  line-height: 100%;
-  letter-spacing: 0px;
-}
-
-@mixin label-small-2 {
-  font-size: 14px;
-  font-weight: 700;
-  line-height: 100%;
-  letter-spacing: 0px;
-}
-
-@mixin tag-large-1 {
-  font-size: 16px;
-  font-weight: 500;
-  line-height: 100%;
-  letter-spacing: 1px;
-  text-transform: uppercase;
-}
-
-@mixin tag-large-2 {
-  font-family: 'Lora';
-  font-size: 20px;
-  font-weight: 800;
-  line-height: 100%;
-  letter-spacing: 1px;
-  text-transform: uppercase;
-}
-
-@mixin tag-medium-1 {
-  font-size: 14px;
-  font-weight: 500;
-  line-height: 100%;
-  letter-spacing: 1px;
-  text-transform: uppercase;
-}
-
-@mixin tag-medium-2 {
-  font-family: 'Lora';
-  font-size: 14px;
-  font-weight: 800;
-  line-height: 100%;
-  letter-spacing: 1px;
-  text-transform: uppercase;
-}
-
-@mixin tag-small-1 {
-  font-size: 12px;
-  font-weight: 500;
-  line-height: 100%;
-  letter-spacing: 1px;
-  text-transform: uppercase;
-}
-
-@mixin tag-small-2 {
-  font-family: 'Lora';
-  font-size: 12px;
-  font-weight: 800;
-  line-height: 100%;
-  letter-spacing: 1px;
-  text-transform: uppercase;
-}
-
-@mixin helper-large-1 {
-  font-size: 14px;
-  font-weight: 400;
-  line-height: 100%;
-  letter-spacing: 0.16px;
-}
-
-@mixin helper-large-2 {
-  font-size: 14px;
-  font-weight: 700;
-  line-height: 120%;
-  letter-spacing: 0.16px;
-}
-
-@mixin helper-medium-1 {
-  font-size: 12px;
-  font-weight: 400;
-  line-height: 100%;
-  letter-spacing: 0.16px;
-}
-
-@mixin helper-medium-2 {
-  font-size: 12px;
-  font-weight: 700;
-  line-height: 120%;
-  letter-spacing: 0.16px;
-}
-
-@mixin helper-small-1 {
-  font-size: 10px;
-  font-weight: 400;
-  line-height: 100%;
-  letter-spacing: 0.16px;
-}
-
-@mixin helper-small-2 {
-  font-size: 10px;
-  font-weight: 700;
-  line-height: 120%;
-  letter-spacing: 0.16px;
-}
-
-@mixin body-large-1 {
-  font-size: 20px;
-  font-weight: 400;
-  line-height: 150%;
-  letter-spacing: 0px;
-}
-
-@mixin body-large-2 {
-  font-size: 20px;
-  font-weight: 700;
-  line-height: 150%;
-  letter-spacing: 0px;
-}
-
-// sets as important to override MuiTooltip-tooltip
-@mixin body-medium-1 {
-  font-size: 16px !important;
-  font-weight: 400 !important;
-  line-height: 150% !important;
-  letter-spacing: 0px !important;
-}
-
-@mixin body-medium-2 {
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 150%;
-  letter-spacing: 0px;
-}
-
-@mixin body-small-1 {
-  font-size: 14px;
-  font-weight: 400;
-  line-height: 150%;
-  letter-spacing: 0px;
-}
-
-@mixin body-small-2 {
-  font-size: 14px;
-  font-weight: 400;
-  line-height: 150%;
-  letter-spacing: 0px;
-}
-
-@mixin link-large {
-  font-size: 20px;
-  font-weight: 400;
-  line-height: 120%;
-  letter-spacing: 0px;
-  decoration: underline;
-}
-
-@mixin link-medium {
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 120%;
-  letter-spacing: 0px;
-  decoration: underline;
-}
-
-@mixin link-small {
-  font-size: 14px;
-  font-weight: 700;
-  line-height: 120%;
-  letter-spacing: 0px;
-  decoration: underline;
-}
-
-@mixin heading-x-large {
-  font-family: 'Lora';
-  font-size: 64px;
-  font-weight: 500;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin heading-large {
-  font-family: 'Lora';
-  font-size: 56px;
-  font-weight: 500;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin heading-medium {
-  font-family: 'Lora';
-  font-size: 48px;
-  font-weight: 500;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin heading-small {
-  font-family: 'Lora';
-  font-size: 40px;
-  font-weight: 500;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin heading-x-small {
-  font-family: 'Lora';
-  font-size: 32px;
-  font-weight: 500;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin subtitle-large-1 {
-  font-size: 32px;
-  font-weight: 300;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin subtitle-large-2 {
-  font-size: 32px;
-  font-weight: 600;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin subtitle-medium-1 {
-  font-size: 28px;
-  font-weight: 300;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin subtitle-medium-2 {
-  font-size: 28px;
-  font-weight: 600;
-  line-height: 120%;
-  letter-spacing: 0px;
-}
-
-@mixin subtitle-small-1 {
-  font-size: 20px;
-  font-weight: 300;
-  line-height: 120%;
-  letter-spacing: 1px;
-}
-
-@mixin subtitle-small-2 {
-  font-size: 20px;
-  font-weight: 600;
-  line-height: 120%;
-  letter-spacing: 1px;
-}
-
-@mixin display-x-large {
-  font-family: 'Lora';
-  font-size: 144px;
-  font-weight: 300;
-  line-height: 100%;
-  letter-spacing: 0px;
-}
-
-@mixin display-large {
-  font-family: 'Lora';
-  font-size: 120px;
-  font-weight: 300;
-  line-height: 100%;
-  letter-spacing: 0px;
-}
-
-@mixin display-medium {
-  font-family: 'Lora';
-  font-size: 112px;
-  font-weight: 300;
-  line-height: 100%;
-  letter-spacing: 0px;
-}
-
-@mixin display-small {
-  font-family: 'Lora';
-  font-size: 96px;
-  font-weight: 300;
-  line-height: 100%;
-  letter-spacing: 0px;
-}
-
-@mixin display-x-small {
-  font-family: 'Lora';
-  font-size: 80px;
-  font-weight: 300;
-  line-height: 100%;
-  letter-spacing: 0px;
-}

package/src/new-styles/main.scss

@@ -1,27 +0,0 @@
-@import 'base/borders';
-@import 'base/colors';
-@import 'base/displays';
-@import 'base/margins';
-@import 'base/spacing';
-@import 'base/tokens';
-@import 'base/typographs';
-@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400;500;600;700;800&family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,200,0..1,0&display=swap');
-
-.MuiTooltip-tooltip {
-  display: flex;
-  align-items: center;
-  background-color: var(--layer-tooltip) !important;
-  height: 40px;
-  max-width: 280px;
-  padding: var(--spacing-100) var(--spacing-150);
-  border-radius: var(--radius-100);
-  @include body-medium-1;
-}
-
-.MuiTooltip-arrow {
-  color: var(--layer-tooltip) !important;
-}
-
-.pointer {
-  cursor: pointer;
-}

package/src/react-app-env.d.ts

@@ -1,5 +0,0 @@
-declare module '*.png';
-declare module '*.svg';
-declare module '*.jpeg';
-declare module '*.jpg';
-declare module 'react-easy-edit';