@heliux-org/ui-style 1.0.22

package/src/Themes/dark/_dark-theme-content-colors.scss

@@ -0,0 +1,240 @@
+@mixin define-dark-theme-content-colors() {
+  // Green
+  --color-green-dark: var(--color-green-900);
+  --color-green-dark-hover: var(--color-green-900);
+  --color-green-dark-selected: var(--color-green-700);
+
+  // Green
+  --color-green-med: var(--color-green-700);
+  --color-green-med-hover: var(--color-green-800);
+  --color-green-med-selected: var(--color-green-600);
+  --color-green-med-selected-with-opacity: rgba(9, 108, 67, 0.6);
+
+  // Green
+  --color-green-light: var(--color-green-600);
+  --color-green-light-hover: var(--color-green-700);
+  --color-green-light-selected: var(--color-green-600);
+
+  // Yellow
+  --color-yellow-dark: var(--color-yellow-900);
+  --color-yellow-dark-hover: var(--color-yellow-900);
+  --color-yellow-dark-selected: var(--color-yellow-700);
+  --color-yellow-dark-rgb: 255, 213, 51;
+
+  // Yellow
+  --color-yellow-med: var(--color-yellow-700);
+  --color-yellow-med-hover: var(--color-yellow-800);
+  --color-yellow-med-selected: var(--color-yellow-600);
+
+  // Yellow
+  --color-yellow-light: var(--color-yellow-600);
+  --color-yellow-light-hover: var(--color-yellow-700);
+  --color-yellow-light-selected: var(--color-yellow-600);
+
+  // Red
+  --color-red-dark: var(--color-red-900);
+  --color-red-dark-hover: var(--color-red-900);
+  --color-red-dark-selected: var(--color-red-700);
+
+  // Red
+  --color-red-med: var(--color-red-700);
+  --color-red-med-hover: var(--color-red-800);
+  --color-red-med-selected: var(--color-red-600);
+  --color-red-med-selected-with-opacity: rgba(136, 67, 67, 0.6);
+
+  // Red
+  --color-red-light: var(--color-red-600);
+  --color-red-light-hover: var(--color-red-700);
+  --color-red-light-selected: var(--color-red-600);
+
+  // Solar Flare
+  --color-solar-flare-dark: var(--color-solar-flare-900);
+  --color-solar-flare-dark-hover: var(--color-solar-flare-900);
+  --color-solar-flare-dark-selected: var(--color-solar-flare-700);
+
+  // Solar Flare
+  --color-solar-flare-med: var(--color-solar-flare-700);
+  --color-solar-flare-med-hover: var(--color-solar-flare-800);
+  --color-solar-flare-med-selected: var(--color-solar-flare-600);
+
+  // Solar Flare
+  --color-solar-flare-light: var(--color-solar-flare-600);
+  --color-solar-flare-light-hover: var(--color-solar-flare-700);
+  --color-solar-flare-light-selected: var(--color-solar-flare-600);
+
+  // Purple
+  --color-purple-dark: var(--color-purple-900);
+  --color-purple-dark-hover: var(--color-purple-900);
+  --color-purple-dark-selected: var(--color-purple-700);
+
+  // Purple
+  --color-purple-med: var(--color-purple-700);
+  --color-purple-med-hover: var(--color-purple-800);
+  --color-purple-med-selected: var(--color-purple-600);
+
+  // Purple
+  --color-purple-light: var(--color-purple-600);
+  --color-purple-light-hover: var(--color-purple-700);
+  --color-purple-light-selected: var(--color-purple-600);
+
+  // Pink
+  --color-pink-dark: var(--color-pink-900);
+  --color-pink-dark-hover: var(--color-pink-900);
+  --color-pink-dark-selected: var(--color-pink-700);
+
+  // Pink
+  --color-pink-med: var(--color-pink-700);
+  --color-pink-med-hover: var(--color-pink-800);
+  --color-pink-med-selected: var(--color-pink-600);
+
+  // Pink
+  --color-pink-light: var(--color-pink-600);
+  --color-pink-light-hover: var(--color-pink-700);
+  --color-pink-light-selected: var(--color-pink-600);
+
+  // Steel
+  --color-steel-dark: var(--color-steel-900);
+  --color-steel-dark-hover: var(--color-steel-900);
+  --color-steel-dark-selected: var(--color-steel-700);
+
+  // Steel
+  --color-steel-med: var(--color-steel-700);
+  --color-steel-med-hover: var(--color-steel-800);
+  --color-steel-med-selected: var(--color-steel-600);
+
+  // Steel
+  --color-steel-light: var(--color-steel-600);
+  --color-steel-light-hover: var(--color-steel-700);
+  --color-steel-light-selected: var(--color-steel-600);
+
+  // Aquamarine
+  --color-teal-dark: var(--color-teal-900);
+  --color-teal-dark-hover: var(--color-teal-900);
+  --color-teal-dark-selected: var(--color-teal-700);
+
+  // Chili Blue
+  --color-teal-med: var(--color-teal-700);
+  --color-teal-med-hover: var(--color-teal-800);
+  --color-teal-med-selected: var(--color-teal-600);
+
+  // River
+  --color-teal-light: var(--color-teal-600);
+  --color-teal-light-hover: var(--color-teal-700);
+  --color-teal-light-selected: var(--color-teal-600);
+
+  // Lime
+  --color-lime-dark: var(--color-lime-900);
+  --color-lime-dark-hover: var(--color-lime-900);
+  --color-lime-dark-selected: var(--color-lime-700);
+
+  // Lime
+  --color-lime-med: var(--color-lime-700);
+  --color-lime-med-hover: var(--color-lime-800);
+  --color-lime-med-selected: var(--color-lime-600);
+
+  // Lime
+  --color-lime-light: var(--color-lime-600);
+  --color-lime-light-hover: var(--color-lime-700);
+  --color-lime-light-selected: var(--color-lime-600);
+
+  // Blackish
+  --color-orange-dark: var(--color-orange-900);
+  --color-orange-dark-hover: var(--color-orange-900);
+  --color-orange-dark-selected: var(--color-orange-700);
+
+  // Brown
+  --color-orange-med: var(--color-orange-700);
+  --color-orange-med-hover: var(--color-orange-800);
+  --color-orange-med-selected: var(--color-orange-600);
+
+  // Orchid
+  --color-orange-light: var(--color-orange-600);
+  --color-orange-light-hover: var(--color-orange-700);
+  --color-orange-light-selected: var(--color-orange-600);
+
+  // Gray
+  --color-gray-dark: var(--color-gray-900);
+  --color-gray-dark-hover: var(--color-gray-900);
+  --color-gray-dark-selected: var(--color-gray-700);
+
+  // Gray
+  --color-gray-med: var(--color-gray-700);
+  --color-gray-med-hover: var(--color-gray-800);
+  --color-gray-med-selected: var(--color-gray-600);
+
+  // Gray
+  --color-gray-light: var(--color-gray-600);
+  --color-gray-light-hover: var(--color-gray-700);
+  --color-gray-light-selected: var(--color-gray-600);
+
+  // obsidian
+  --color-obsidian-dark: var(--color-obsidian-900);
+  --color-obsidian-dark-hover: var(--color-obsidian-900);
+  --color-obsidian-dark-selected: var(--color-obsidian-700);
+
+  // obsidian
+  --color-obsidian-med: var(--color-obsidian-700);
+  --color-obsidian-med-hover: var(--color-obsidian-800);
+  --color-obsidian-med-selected: var(--color-obsidian-600);
+
+  // obsidian
+  --color-obsidian-light: var(--color-obsidian-600);
+  --color-obsidian-light-hover: var(--color-obsidian-700);
+  --color-obsidian-light-selected: var(--color-obsidian-600);
+
+  // Sand
+  --color-sand-dark: var(--color-sand-900);
+  --color-sand-dark-hover: var(--color-sand-900);
+  --color-sand-dark-selected: var(--color-sand-700);
+
+  // Sand
+  --color-sand-med: var(--color-sand-700);
+  --color-sand-med-hover: var(--color-sand-800);
+  --color-sand-med-selected: var(--color-sand-600);
+
+  // Sand
+  --color-sand-light: var(--color-sand-600);
+  --color-sand-light-hover: var(--color-sand-700);
+  --color-sand-light-selected: var(--color-sand-600);
+
+
+  // obsidian
+  --color-sky: var(--color-steel-700);
+  --color-sky-hover: var(--color-red-900);
+  --color-sky-selected: var(--color-red-600);
+
+  // Coffee
+  --color-coffee: var(--color-red-700);
+  --color-coffee-hover: var(--color-red-800);
+  --color-coffee-selected: var(--color-red-600);
+
+  // Royal
+  --color-royal: var(--color-teal-600);
+  --color-royal-hover: var(--color-red-800);
+  --color-royal-selected: var(--color-red-600);
+
+  // Teal
+  --color-teal: var(--color-red-700);
+  --color-teal-hover: var(--color-red-800);
+  --color-teal-selected: var(--color-red-600);
+
+  // Lavender
+  --color-lavender: var(--color-red-700);
+  --color-lavender-hover: var(--color-red-800);
+  --color-lavender-selected: var(--color-red-600);
+
+  // Steel
+  --color-steel: var(--color-red-600);
+  --color-steel-hover: var(--color-red-800);
+  --color-steel-selected: var(--color-red-600);
+
+  // Lilac
+  --color-lilac: var(--color-red-700);
+  --color-lilac-hover: var(--color-red-800);
+  --color-lilac-selected: var(--color-red-600);
+
+  // Pecan
+  --color-pecan: var(--color-red-700);
+  --color-pecan-hover: var(--color-red-800);
+  --color-pecan-selected: var(--color-red-600);
+}

package/src/Themes/dark/_dark-theme-legacy-settings.scss

@@ -0,0 +1,4 @@
+// DARK THEME SETTINGS: This partial Defines a Unified settings map for the DARK THEME Scope.
+// - Map collect function is used in order to merge multiple maps.
+
+$theme-dark-legacy-settings: map-collect($theme-dark-legacy-keys);

package/src/Themes/dark/_dark-theme-settings.scss

@@ -0,0 +1,4 @@
+// DARK THEME SETTINGS: This partial Defines a Unified settings map for the DARK THEME Scope.
+// - Map collect function is used in order to merge multiple maps.
+
+$theme-dark-settings: map-collect($theme-dark-keys, $theme-dark-shadow-keys);

package/src/Themes/hacker/_hacker-theme-content-colors.scss

@@ -0,0 +1,240 @@
+@mixin define-hacker-theme-content-colors() {
+  // Green
+  --color-green-dark: var(--color-green-900);
+  --color-green-dark-hover: var(--color-green-900);
+  --color-green-dark-selected: var(--color-green-700);
+
+  // Green
+  --color-green-med: var(--color-green-700);
+  --color-green-med-hover: var(--color-green-800);
+  --color-green-med-selected: var(--color-green-600);
+  --color-green-med-selected-with-opacity: rgba(9, 108, 67, 0.6);
+
+  // Green
+  --color-green-light: var(--color-green-600);
+  --color-green-light-hover: var(--color-green-700);
+  --color-green-light-selected: var(--color-green-600);
+
+  // Yellow
+  --color-yellow-dark: var(--color-yellow-900);
+  --color-yellow-dark-hover: var(--color-yellow-900);
+  --color-yellow-dark-selected: var(--color-yellow-700);
+  --color-yellow-dark-rgb: 255, 213, 51;
+
+  // Yellow
+  --color-yellow-med: var(--color-yellow-700);
+  --color-yellow-med-hover: var(--color-yellow-800);
+  --color-yellow-med-selected: var(--color-yellow-600);
+
+  // Yellow
+  --color-yellow-light: var(--color-yellow-600);
+  --color-yellow-light-hover: var(--color-yellow-700);
+  --color-yellow-light-selected: var(--color-yellow-600);
+
+  // Red
+  --color-red-dark: var(--color-red-900);
+  --color-red-dark-hover: var(--color-red-900);
+  --color-red-dark-selected: var(--color-red-700);
+
+  // Red
+  --color-red-med: var(--color-red-700);
+  --color-red-med-hover: var(--color-red-800);
+  --color-red-med-selected: var(--color-red-600);
+  --color-red-med-selected-with-opacity: rgba(136, 67, 67, 0.6);
+
+  // Red
+  --color-red-light: var(--color-red-600);
+  --color-red-light-hover: var(--color-red-700);
+  --color-red-light-selected: var(--color-red-600);
+
+  // Solar Flare
+  --color-solar-flare-dark: var(--color-solar-flare-900);
+  --color-solar-flare-dark-hover: var(--color-solar-flare-900);
+  --color-solar-flare-dark-selected: var(--color-solar-flare-700);
+
+  // Solar Flare
+  --color-solar-flare-med: var(--color-solar-flare-700);
+  --color-solar-flare-med-hover: var(--color-solar-flare-800);
+  --color-solar-flare-med-selected: var(--color-solar-flare-600);
+
+  // Solar Flare
+  --color-solar-flare-light: var(--color-solar-flare-600);
+  --color-solar-flare-light-hover: var(--color-solar-flare-700);
+  --color-solar-flare-light-selected: var(--color-solar-flare-600);
+
+  // Purple
+  --color-purple-dark: var(--color-purple-900);
+  --color-purple-dark-hover: var(--color-purple-900);
+  --color-purple-dark-selected: var(--color-purple-700);
+
+  // Purple
+  --color-purple-med: var(--color-purple-700);
+  --color-purple-med-hover: var(--color-purple-800);
+  --color-purple-med-selected: var(--color-purple-600);
+
+  // Purple
+  --color-purple-light: var(--color-purple-600);
+  --color-purple-light-hover: var(--color-purple-700);
+  --color-purple-light-selected: var(--color-purple-600);
+
+  // Pink
+  --color-pink-dark: var(--color-pink-900);
+  --color-pink-dark-hover: var(--color-pink-900);
+  --color-pink-dark-selected: var(--color-pink-700);
+
+  // Pink
+  --color-pink-med: var(--color-pink-700);
+  --color-pink-med-hover: var(--color-pink-800);
+  --color-pink-med-selected: var(--color-pink-600);
+
+  // Pink
+  --color-pink-light: var(--color-pink-600);
+  --color-pink-light-hover: var(--color-pink-700);
+  --color-pink-light-selected: var(--color-pink-600);
+
+  // Steel
+  --color-steel-dark: var(--color-steel-900);
+  --color-steel-dark-hover: var(--color-steel-900);
+  --color-steel-dark-selected: var(--color-steel-700);
+
+  // Steel
+  --color-steel-med: var(--color-steel-700);
+  --color-steel-med-hover: var(--color-steel-800);
+  --color-steel-med-selected: var(--color-steel-600);
+
+  // Steel
+  --color-steel-light: var(--color-steel-600);
+  --color-steel-light-hover: var(--color-steel-700);
+  --color-steel-light-selected: var(--color-steel-600);
+
+  // Aquamarine
+  --color-teal-dark: var(--color-teal-900);
+  --color-teal-dark-hover: var(--color-teal-900);
+  --color-teal-dark-selected: var(--color-teal-700);
+
+  // Chili Blue
+  --color-teal-med: var(--color-teal-700);
+  --color-teal-med-hover: var(--color-teal-800);
+  --color-teal-med-selected: var(--color-teal-600);
+
+  // River
+  --color-teal-light: var(--color-teal-600);
+  --color-teal-light-hover: var(--color-teal-700);
+  --color-teal-light-selected: var(--color-teal-600);
+
+  // Lime
+  --color-lime-dark: var(--color-lime-900);
+  --color-lime-dark-hover: var(--color-lime-900);
+  --color-lime-dark-selected: var(--color-lime-700);
+
+  // Lime
+  --color-lime-med: var(--color-lime-700);
+  --color-lime-med-hover: var(--color-lime-800);
+  --color-lime-med-selected: var(--color-lime-600);
+
+  // Lime
+  --color-lime-light: var(--color-lime-600);
+  --color-lime-light-hover: var(--color-lime-700);
+  --color-lime-light-selected: var(--color-lime-600);
+
+  // Blackish
+  --color-orange-dark: var(--color-orange-900);
+  --color-orange-dark-hover: var(--color-orange-900);
+  --color-orange-dark-selected: var(--color-orange-700);
+
+  // Brown
+  --color-orange-med: var(--color-orange-700);
+  --color-orange-med-hover: var(--color-orange-800);
+  --color-orange-med-selected: var(--color-orange-600);
+
+  // Orchid
+  --color-orange-light: var(--color-orange-600);
+  --color-orange-light-hover: var(--color-orange-700);
+  --color-orange-light-selected: var(--color-orange-600);
+
+  // Gray
+  --color-gray-dark: var(--color-gray-900);
+  --color-gray-dark-hover: var(--color-gray-900);
+  --color-gray-dark-selected: var(--color-gray-700);
+
+  // Gray
+  --color-gray-med: var(--color-gray-700);
+  --color-gray-med-hover: var(--color-gray-800);
+  --color-gray-med-selected: var(--color-gray-600);
+
+  // Gray
+  --color-gray-light: var(--color-gray-600);
+  --color-gray-light-hover: var(--color-gray-700);
+  --color-gray-light-selected: var(--color-gray-600);
+
+  // obsidian
+  --color-obsidian-dark: var(--color-obsidian-900);
+  --color-obsidian-dark-hover: var(--color-obsidian-900);
+  --color-obsidian-dark-selected: var(--color-obsidian-700);
+
+  // obsidian
+  --color-obsidian-med: var(--color-obsidian-700);
+  --color-obsidian-med-hover: var(--color-obsidian-800);
+  --color-obsidian-med-selected: var(--color-obsidian-600);
+
+  // obsidian
+  --color-obsidian-light: var(--color-obsidian-600);
+  --color-obsidian-light-hover: var(--color-obsidian-700);
+  --color-obsidian-light-selected: var(--color-obsidian-600);
+
+  // Sand
+  --color-sand-dark: var(--color-sand-900);
+  --color-sand-dark-hover: var(--color-sand-900);
+  --color-sand-dark-selected: var(--color-sand-700);
+
+  // Sand
+  --color-sand-med: var(--color-sand-700);
+  --color-sand-med-hover: var(--color-sand-800);
+  --color-sand-med-selected: var(--color-sand-600);
+
+  // Sand
+  --color-sand-light: var(--color-sand-600);
+  --color-sand-light-hover: var(--color-sand-700);
+  --color-sand-light-selected: var(--color-sand-600);
+
+
+  // obsidian
+  --color-sky: var(--color-steel-700);
+  --color-sky-hover: var(--color-red-900);
+  --color-sky-selected: var(--color-red-600);
+
+  // Coffee
+  --color-coffee: var(--color-red-700);
+  --color-coffee-hover: var(--color-red-800);
+  --color-coffee-selected: var(--color-red-600);
+
+  // Royal
+  --color-royal: var(--color-teal-600);
+  --color-royal-hover: var(--color-red-800);
+  --color-royal-selected: var(--color-red-600);
+
+  // Teal
+  --color-teal: var(--color-red-700);
+  --color-teal-hover: var(--color-red-800);
+  --color-teal-selected: var(--color-red-600);
+
+  // Lavender
+  --color-lavender: var(--color-red-700);
+  --color-lavender-hover: var(--color-red-800);
+  --color-lavender-selected: var(--color-red-600);
+
+  // Steel
+  --color-steel: var(--color-red-600);
+  --color-steel-hover: var(--color-red-800);
+  --color-steel-selected: var(--color-red-600);
+
+  // Lilac
+  --color-lilac: var(--color-red-700);
+  --color-lilac-hover: var(--color-red-800);
+  --color-lilac-selected: var(--color-red-600);
+
+  // Pecan
+  --color-pecan: var(--color-red-700);
+  --color-pecan-hover: var(--color-red-800);
+  --color-pecan-selected: var(--color-red-600);
+}

package/src/Themes/hacker/_hacker-theme-legacy-settings.scss

@@ -0,0 +1,4 @@
+// HACLER THEME SETTINGS: This partial Defines a Unified settings map for the HACKER THEME Scope.
+// - Map collect function is used in order to merge multiple maps.
+
+$theme-hacker-legacy-settings: map-collect($theme-hacker-legacy-palette, $theme-hacker-legacy-keys);

package/src/Themes/hacker/_hacker-theme-settings.scss

@@ -0,0 +1,4 @@
+// HACKER THEME SETTINGS: This partial Defines a Unified settings map for the HACKER THEME Scope.
+// - Map collect function is used in order to merge multiple maps.
+
+$theme-hacker-settings: map-collect($theme-hacker-keys, $theme-hacker-shadow-keys);

package/src/_common.scss

@@ -0,0 +1,9 @@
+// COMMON DEPENDENCIES:
+// - This partial loads all functions,internal-mixins,configs and variables.
+// - It should be used inside an external project component scope in order to access vibe dependencies.
+
+// Dependencies
+@import "functions";
+@import "internal-mixins";
+@import "config";
+@import "utilities/utilities-maps";

package/src/_config.scss

@@ -0,0 +1,17 @@
+// CONFIG : MAIN LOADER
+// This partial loads all project's related tokens and maps
+// - Loading order is important.
+
+// Tokens
+@import "config/tokens/config-core-tokens";
+@import "config/tokens/config-basic-theme-tokens";
+@import "config/tokens/config-dark-theme-tokens";
+@import "config/tokens/config-black-theme-tokens";
+@import "config/tokens/config-hacker-theme-tokens";
+
+// Maps
+@import "config/maps/config-core-maps";
+@import "config/maps/config-basic-theme-maps";
+@import "config/maps/config-dark-theme-maps";
+@import "config/maps/config-black-theme-maps";
+@import "config/maps/config-hacker-theme-maps";

package/src/_core.scss

@@ -0,0 +1,12 @@
+// GLOBAL SCOPE LOADER: CORE
+// This partial loads Core scope related Partials.
+// - This partials Generates Core custom properties using a mixin and a settings map.
+//   - Mixin is "generate-custom-properties".
+//   - Map is "$core-settings-map" which is a map collected from all other core scope maps.
+// - Core properties are Global and Generic and goes under :root
+
+@import "core/core-settings";
+
+:root {
+  @include generate-custom-properties($core-settings-map);
+}

package/src/_functions.scss

@@ -0,0 +1,8 @@
+// FUNCTIONS: This partial loads global scope functions.
+
+// Functions imports
+@import "functions/camelize";
+@import "functions/capitalize";
+@import "functions/contain";
+@import "functions/map-collect";
+@import "functions/extract-rgb";

package/src/_internal-mixins.scss

@@ -0,0 +1,5 @@
+// MIXINS: This partial loads global scope internal-mixins.
+
+// Mixins imports
+@import "internal-mixins/generate-custom-properties";
+@import "internal-mixins/utilities";

package/src/_mixins.scss

@@ -0,0 +1,3 @@
+@import "mixins/common";
+@import "mixins/states";
+@import "mixins/typography";

package/src/_themes.scss

@@ -0,0 +1,5 @@
+// GLOBAL SCOPE LOADER: THEMES
+@import "Themes/basic-theme";
+@import "Themes/dark-theme";
+@import "Themes/black-theme";
+@import "Themes/hacker-theme";

package/src/config/maps/_config-basic-theme-maps.scss

@@ -0,0 +1,7 @@
+// CONFIG: BASIC THEME Maps
+// This partial loads Theme Basic's config maps
+
+@import "themes/basic/palette/palette";
+@import "themes/basic/palette/legacy/legacy-pallete";
+@import "themes/basic/keys/keys";
+@import "themes/basic/keys/legacy/legacy-keys";

package/src/config/maps/_config-black-theme-maps.scss

@@ -0,0 +1,4 @@
+// CONFIG: BLACK THEME Maps
+// This partial loads Theme Black's config maps
+@import "themes/black/keys/black-theme-keys";
+@import "themes/black/keys/legacy/black-theme-legacy-keys";

package/src/config/maps/_config-core-maps.scss

@@ -0,0 +1,12 @@
+// CONFIG: BASIC THEME MAPS
+// This partial loads Core config maps
+
+@import "core/core-motion-map";
+@import "core/core-borders";
+@import "core/core-spacing-map";
+@import "core/core-radius-map";
+@import "core/core-shadows-map";
+@import "core/core-common-map";
+@import "core/core-fonts-map-deprecated";
+@import "core/core-typography-map";
+@import "core/core-typography-map-deprecated";

package/src/config/maps/_config-dark-theme-maps.scss

@@ -0,0 +1,4 @@
+// CONFIG: DARK THEME Maps
+// This partial loads Theme Hacker config maps
+@import "themes/dark/keys/dark-theme-keys";
+@import "themes/dark/keys/legacy/dark-theme-legacy-keys";

package/src/config/maps/_config-hacker-theme-maps.scss

@@ -0,0 +1,5 @@
+// CONFIG: HACKER THEME Maps
+// This partial loads Theme Hacker's config maps
+@import "themes/hacker/palette/legacy/hacker-theme-legacy-palette";
+@import "themes/hacker/keys/hacker-theme-keys";
+@import "themes/hacker/keys/legacy/hacker-theme-legacy-keys";

package/src/config/maps/core/_core-borders.scss

@@ -0,0 +1,9 @@
+// CORE MAP: BORDERS
+// This partial defines border-related map.
+// - Map include border scope tokens.
+// - Maps are collected into the $core-settings-map and are interpolated into custom properties.
+
+$core-border-map: (
+  border-width: $border-width,
+  border-style: $border-style
+);

package/src/config/maps/core/_core-common-map.scss

@@ -0,0 +1,9 @@
+// COR MAP: COMMON
+// This partial defines common and global values map.
+// - Maps include misc common and global tokens.
+// - Maps are collected into the $core-settings-map and are interpolated into custom properties.
+
+$core-common-map: (
+  disabled-component-opacity: $disabled-component-opacity,
+  effect-divider-halo: $effect-divider-halo
+);

package/src/config/maps/core/_core-fonts-map-deprecated.scss

@@ -0,0 +1,37 @@
+// CORE MAP: FONTS
+// This partial defines font-related maps.
+// - Maps include Font scope tokens.
+// - Maps are collected into the $core-settings-map and are interpolated into custom properties.
+
+$core-fonts-map: (
+  font-family: $font-family,
+  title-font-family: $title-font-family,
+  h1-font-family: $h1-font-family,
+  font-smoothing-webkit: $font-smoothing-webkit,
+  font-smoothing-moz: $font-smoothing-moz
+);
+
+$core-font-weight-map: (
+  font-weight-very-light: $font-weight-very-light,
+  font-weight-light: $font-weight-light,
+  font-weight-normal: $font-weight-normal,
+  font-weight-bold: $font-weight-bold
+);
+
+$core-font-size-scale-map: (
+  font-size-10: $font-size-10,
+  font-size-20: $font-size-20,
+  font-size-30: $font-size-30,
+  font-size-40: $font-size-40,
+  font-size-50: $font-size-50,
+  font-size-60: $font-size-60
+);
+
+$core-font-line-height-scale-map: (
+  font-line-height-10: $font-line-height-10,
+  font-line-height-20: $font-line-height-20,
+  font-line-height-30: $font-line-height-30,
+  font-line-height-40: $font-line-height-40,
+  font-line-height-50: $font-line-height-50,
+  font-line-height-60: $font-line-height-60
+);