@sorocraft/ui 1.2.68 → 1.2.69

package/dist/styles/scss/variables.scss

@@ -1,330 +0,0 @@
-@use "./colors.scss" as *;
-
-$base-font-size: 16px;
-
-/* Border radius */
-$border-radius: 0.475rem;
-$oval-border-radius: 3.75rem;
-$less-oval-border-radius: 1.5rem;
-$btn-border-radius: 3.75rem;
-$card-border-radius: 0.85rem;
-$badge-border-radius: 0.425rem;
-$input-border-radius: 3.75rem;
-$toolbar-border-radius: 0.85rem;
-$message-border-radius: 1.75rem;
-
-/* Fonts */
-$font-family: var(--sorocraft-font-family, Helvetica);
-
-$gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
-$body-font-size: 1rem;
-$body-font-weight: 400;
-$body-line-height: 1.5;
-
-/* WIDTH */
-$sidebar-full-width: 320px;
-$sidebar-collapsed-width: 80px;
-$sidebar-submenu-width: 300px;
-$right-drawer-width: 420px;
-
-$tooltip-size: 0.75rem;
-$container-padding: 2rem;
-$container-mobile-padding: 1.25rem;
-$mobile-padding: 15px;
-
-/* HEIGHT */
-$header-height: 4rem;
-$secondary-header-height: 2.75rem;
-
-/* CARD */
-$card-header-padding: 1.75rem;
-$card-body-padding: 1.75rem;
-$card-footer-gap: 0.5rem;
-
-/* TABLE */
-
-/* MODAL */
-$modal-width-sm: 500px;
-$modal-width-md: 700px;
-$modal-width-lg: 900px;
-$modal-margin: 1.75rem;
-$modal-header-padding: 1.75rem;
-$modal-padding: 1.75rem;
-$modal-footer-gap: 0.5rem;
-
-/* BADGE */
-
-$badge-padding-x: 0.5rem;
-$badge-padding-y: 0.325rem;
-$badge-font-size: 0.85rem;
-$badge-font-weight: 600;
-
-/* Menu */
-
-/* Input */
-
-/* EDITOR */
-
-/* HEADER */
-$header-padding: 1rem;
-
-/* Z-INDEX */
-$z-layer-0: 0;
-$z-layer-1: 1;
-$z-layer-2: 10;
-
-/* SIZES */
-$size-xs: 0;
-$size-sm: 576px;
-$size-md: 768px;
-$size-lg: 992px;
-$size-xl: 1200px;
-$size-xxl: 1440px;
-$avatar-sizes: (
-	xxs: 24px,
-	xs: 32px,
-	sm: 48px,
-	md: 64px,
-	lg: 96px,
-	xl: 128px,
-	xxl: 512px,
-);
-
-/* SHADOW */
-$task-card-shadow: 0px 0px 10px 0px rgba(56, 71, 109, 0.075);
-$task-card-hover-shadow: 0px 0px 25px 0px rgba(56, 71, 109, 0.075);
-$task-drawer-shadow: 0px 10px 10px 0px rgba(56, 71, 109, 0.25);
-$table-loading-message-box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
-$menu-dropdown-box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
-$tooltip-box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
-$card-box-shadow: 0px 10px 35px 0px rgba(56, 71, 109, 0.075);
-$card-hover-box-shadow: 0px 50px 20px -40px rgba(0, 0, 0, 0.1),
-	0px 30px 50px 0px rgba(50, 50, 93, 0.25);
-$shadow-around: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
-$highlighted-message-shadow: 0px 0px 20px 0px
-	rgba(
-		$color: $color-secondary,
-		$alpha: 0.5,
-	);
-$box-right-shadow: 2px 0px 5px -3px rgba(0, 0, 0, 0.15);
-$image-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.15);
-$feature-card-shadow: 0px 8px 16px -8px rgba(0, 0, 0, 0.1),
-	0px 13px 27px -12px rgba(50, 50, 93, 0.25);
-$feature-card-hover-shadow: 0px 100px 50px -40px rgba(0, 0, 0, 0.1),
-	0px 60px 100px 0px rgba(50, 50, 93, 0.25);
-$input-shadow-around: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
-
-/**/
-$uiTypeStyles: (
-	light: (
-		$color-light,
-		$color-text-muted,
-		$color-light-active,
-		$color-light-inverse,
-	),
-	lightDark: (
-		$color-dark-light,
-		$color-dark,
-		$color-dark,
-		$color-dark-inverse,
-	),
-	lightDanger: (
-		$color-danger-light,
-		$color-danger,
-		$color-danger,
-		$color-danger-inverse,
-	),
-	lightInfo: (
-		$color-info-light,
-		$color-info,
-		$color-info,
-		$color-info-inverse,
-	),
-	lightPrimary: (
-		$color-primary-light,
-		$color-primary,
-		$color-primary,
-		$color-primary-inverse,
-	),
-	lightSecondary: (
-		$color-secondary-light,
-		$color-secondary,
-		$color-secondary,
-		$color-secondary-inverse,
-	),
-	lightWarning: (
-		$color-warning-light,
-		$color-warning,
-		$color-warning,
-		$color-warning-inverse,
-	),
-	lightSuccess: (
-		$color-success-light,
-		$color-success,
-		$color-success,
-		$color-success-inverse,
-	),
-	primary: (
-		$color-primary,
-		$color-primary-inverse,
-		$color-primary-active,
-		$color-primary-inverse,
-	),
-	secondary: (
-		$color-secondary,
-		$color-secondary-inverse,
-		$color-secondary-active,
-		$color-secondary-inverse,
-	),
-	danger: (
-		$color-danger,
-		$color-danger-inverse,
-		$color-danger-active,
-		$color-danger-inverse,
-	),
-	dark: (
-		$color-dark,
-		$color-dark-inverse,
-		$color-dark-active,
-		$color-dark-inverse,
-	),
-	info: (
-		$color-info,
-		$color-info-inverse,
-		$color-info-active,
-		$color-info-inverse,
-	),
-	success: (
-		$color-success,
-		$color-success-inverse,
-		$color-success-active,
-		$color-success-inverse,
-	),
-	warning: (
-		$color-warning,
-		$color-warning-inverse,
-		$color-warning-active,
-		$color-warning-inverse,
-	),
-	whiteText: (
-		transparent,
-		$color-white,
-		transparent,
-		$color-gray-300,
-	),
-	default: (
-		$color-white,
-		$color-gray-700,
-		$color-primary,
-		$color-primary-inverse,
-	),
-	borderedPrimary: (
-		$color-white,
-		$color-primary,
-		$color-primary,
-		$color-primary-inverse,
-	),
-	borderedSecondary: (
-		$color-white,
-		$color-secondary,
-		$color-secondary,
-		$color-secondary-inverse,
-	),
-);
-
-/* BUTTON */
-$btn-font-weight: 500;
-$btn-line-height: 1;
-$btn-disabled-opacity: 0.65;
-$btn-font-size: 0.925rem;
-//
-$button-sizes: (
-	xs: (
-		32px,
-		6px,
-		16px,
-		4px,
-	),
-	sm: (
-		36px,
-		8px,
-		16px,
-		4px,
-	),
-	md: (
-		40px,
-		8px,
-		16px,
-		8px,
-	),
-	lg: (
-		48px,
-		12px,
-		16px,
-		8px,
-	),
-	xl: (
-		52px,
-		14px,
-		24px,
-		8px,
-	),
-	xxl: (
-		56px,
-		16px,
-		24px,
-		8px,
-	),
-	xxxl: (
-		64px,
-		12px,
-		24px,
-		8px,
-	),
-);
-
-/* TEXT */
-
-// Font sizes and line heights
-$text-sizes: (
-	"xxxl": (
-		2.5rem,
-		56px,
-	),
-	"xxl": (
-		2rem,
-		40px,
-	),
-	"xl": (
-		1.5rem,
-		32px,
-	),
-	"lg": (
-		1.25rem,
-		28px,
-	),
-	"md": (
-		1rem,
-		24px,
-	),
-	"sm": (
-		0.875rem,
-		20px,
-	),
-	"xs": (
-		0.75rem,
-		16px,
-	),
-	"xxs": (
-		0.625rem,
-		14px,
-	),
-);
-
-// Font weights
-$text-weights: (
-	"light": 300,
-	"regular": 400,
-	"medium": 500,
-	"bold": 600,
-);