Skip to content

Commit

Permalink
[Visual Refresh] Provide legacy JSON theme tokens (#8115)
Browse files Browse the repository at this point in the history
  • Loading branch information
@mgadewoll @tkajtoch
mgadewoll authored and tkajtoch committed Nov 27, 2024
1 parent 643344b commit fd9a6ab
Show file tree
Hide file tree
Showing 14 changed files with 1,327 additions and 13 deletions.
5 changes: 4 additions & 1 deletion packages/eui-theme-borealis/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,12 @@
"scripts": {
"build:workspaces": "yarn workspaces foreach -Rti --from @elastic/eui-theme-borealis --exclude @elastic/eui-theme-borealis run build",
"build:clean": "rimraf lib/",
"build": "yarn build:clean && yarn build:compile && yarn build:compile:cjs && yarn build:types",
"build": "yarn build:clean && yarn build:compile && yarn build:compile:cjs && yarn build:types && yarn copy-files",
"build:compile": "tsc --project ./tsconfig.json",
"build:compile:cjs": "NODE_ENV=production NO_COREJS_POLYFILL=true babel src --out-dir=lib/cjs --extensions .js,.ts,.tsx --source-maps=true",
"build:types": "NODE_ENV=production tsc --project tsconfig.types.json",
"build-pack": "yarn build && npm pack",
"copy-files": "node ./scripts/copy-json-files.js",
"lint": "yarn tsc --noEmit && yarn lint-es && yarn lint-sass",
"lint-es": "eslint --cache src/**/*.ts --max-warnings 0",
"lint-sass": "yarn stylelint \"**/*.scss\" --quiet-deprecation-warnings",
Expand Down Expand Up @@ -64,6 +65,8 @@
"files": [
"lib/",
"src/**/*.scss",
"src/eui_theme_borealis_light.json",
"src/eui_theme_borealis_dark.json",
"README.md"
],
"installConfig": {
Expand Down
40 changes: 40 additions & 0 deletions packages/eui-theme-borealis/scripts/copy-json-files.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
const path = require('path');
const util = require('util');
const fs = require('fs');
const copyFilePromise = util.promisify(fs.copyFile);

const chalk = require('chalk');

const sourceDirectory = 'src';
const destinationDirectory = 'lib';

async function copyJsonFiles() {
// Copy static legacy JSON token files from /src to /lib
const jsonFilesToCopy = [
'eui_theme_borealis_light.json',
'eui_theme_borealis_dark.json',
'eui_theme_borealis_light.json.d.ts',
'eui_theme_borealis_dark.json.d.ts',
];
await Promise.all(
jsonFilesToCopy.map((fileName) => {
const source = path.join(sourceDirectory, fileName);
const destination = path.join(destinationDirectory, fileName);

if (!fs.existsSync(destinationDirectory)) {
fs.mkdirSync(destinationDirectory);
}

return copyFilePromise(source, destination, (err) => {
if (err) throw err;
console.log(
chalk`{green ✔} Finished copying {gray ${source}} to {gray ${destination}}`
);
});
})
);
}

if (require.main === module) {
copyJsonFiles();
}
314 changes: 314 additions & 0 deletions packages/eui-theme-borealis/src/eui_theme_borealis_dark.json
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,314 @@
{
"euiZDataGrid": 999,
"euiZHeaderBelowDataGrid": 998,
"euiZDataGridCellPopover": 1000,
"euiDataGridCellPaddingS": "4px",
"euiDataGridCellPaddingM": "6px",
"euiDataGridCellPaddingL": "8px",
"euiTableHoverColor": "rgba(255, 255, 255, 0.06)",
"euiTableSelectedColor": "#243147",
"euiTableHoverSelectedColor": "rgba(255, 255, 255, 0.06)",
"euiTableActionsBorderColor": "#2B394F",
"euiTableHoverClickableColor": "rgba(255, 255, 255, 0.06)",
"euiTableFocusClickableColor": "rgba(255, 255, 255, 0.06)",
"euiContrastRatioText": 4.5,
"euiContrastRatioGraphic": 3,
"euiContrastRatioDisabled": 2,
"euiAnimSlightBounce": "cubic-bezier(0.34, 1.61, 0.7, 1)",
"euiAnimSlightResistance": "cubic-bezier(0.694, 0.0482, 0.335, 1)",
"euiAnimSpeedExtraFast": "90ms",
"euiAnimSpeedFast": "150ms",
"euiAnimSpeedNormal": "250ms",
"euiAnimSpeedSlow": "350ms",
"euiAnimSpeedExtraSlow": "500ms",
"euiBorderWidthThin": "1px",
"euiBorderWidthThick": "2px",
"euiBorderColor": "#2B394F",
"euiBorderRadius": "6px",
"euiBorderRadiusSmall": "4px",
"euiBorderThick": "2px solid #2B394F",
"euiBorderThin": "1px solid #2B394F",
"euiBorderEditable": "2px dotted #2B394F",
"euiButtonHeight": "40px",
"euiButtonHeightSmall": "32px",
"euiButtonHeightXSmall": "24px",
"euiButtonColorDisabled": "#1D2A3E",
"euiButtonColorDisabledText": "#6A7FA0",
"euiButtonColorGhostDisabled": "#1D2A3E",
"euiButtonTypes": {
"primary": "#599DFF",
"accent": "#ED6BA2",
"accentSecondary": "#00BEB8",
"success": "#23BE8F",
"warning": "#FCD279",
"danger": "#F66D64",
"ghost": "#07101F",
"text": "#8E9FBC"
},
"euiPaletteColorBlind": {
"euiColorVis0": {
"graphic": "#00BEB8",
"behindText": "#00BEB8"
},
"euiColorVis1": {
"graphic": "#98E6E2",
"behindText": "#98E6E2"
},
"euiColorVis2": {
"graphic": "#599DFF",
"behindText": "#599DFF"
},
"euiColorVis3": {
"graphic": "#B4D5FF",
"behindText": "#B4D5FF"
},
"euiColorVis4": {
"graphic": "#ED6BA2",
"behindText": "#ED6BA2"
},
"euiColorVis5": {
"graphic": "#FFBED5",
"behindText": "#FFBED5"
},
"euiColorVis6": {
"graphic": "#F66D64",
"behindText": "#F66D64"
},
"euiColorVis7": {
"graphic": "#FFC0B8",
"behindText": "#FFC0B8"
},
"euiColorVis8": {
"graphic": "#E6AB01",
"behindText": "#E6AB01"
},
"euiColorVis9": {
"graphic": "#FCD279",
"behindText": "#FCD279"
}
},
"euiPaletteColorBlindKeys": "'euiColorVis0', 'euiColorVis1', 'euiColorVis2', 'euiColorVis3', 'euiColorVis4', 'euiColorVis5', 'euiColorVis6', 'euiColorVis7', 'euiColorVis8', 'euiColorVis9'",
"euiColorVis0": "#00BEB8",
"euiColorVis1": "#98E6E2",
"euiColorVis2": "#599DFF",
"euiColorVis3": "#B4D5FF",
"euiColorVis4": "#ED6BA2",
"euiColorVis5": "#FFBED5",
"euiColorVis6": "#F66D64",
"euiColorVis7": "#FFC0B8",
"euiColorVis8": "#E6AB01",
"euiColorVis9": "#FCD279",
"euiColorVis0_behindText": "#00BEB8",
"euiColorVis1_behindText": "#98E6E2",
"euiColorVis2_behindText": "#599DFF",
"euiColorVis3_behindText": "#B4D5FF",
"euiColorVis4_behindText": "#ED6BA2",
"euiColorVis5_behindText": "#FFBED5",
"euiColorVis6_behindText": "#F66D64",
"euiColorVis7_behindText": "#FFC0B8",
"euiColorVis8_behindText": "#E6AB01",
"euiColorVis9_behindText": "#FCD279",
"euiFontWeightLight": 300,
"euiFontWeightRegular": 400,
"euiFontWeightMedium": 450,
"euiFontWeightSemiBold": 500,
"euiFontWeightBold": 600,
"euiCodeFontWeightRegular": 400,
"euiCodeFontWeightBold": 600,
"euiFormMaxWidth": "400px",
"euiFormControlHeight": "40px",
"euiFormControlCompressedHeight": "32px",
"euiFormControlPadding": "12px",
"euiFormControlCompressedPadding": "8px",
"euiFormControlBorderRadius": "6px",
"euiFormControlCompressedBorderRadius": "4px",
"euiRadioSize": "16px",
"euiCheckBoxSize": "16px",
"euiCheckboxBorderRadius": "4px",
"euiSwitchHeight": "20px",
"euiSwitchWidth": "44px",
"euiSwitchThumbSize": "20px",
"euiSwitchIconHeight": "16px",
"euiSwitchHeightCompressed": "16px",
"euiSwitchWidthCompressed": "28px",
"euiSwitchThumbSizeCompressed": "16px",
"euiSwitchHeightMini": "10px",
"euiSwitchWidthMini": "22px",
"euiSwitchThumbSizeMini": "10px",
"euiFormBackgroundColor": "#07101F",
"euiFormBackgroundDisabledColor": "#1D2A3E",
"euiFormBackgroundReadOnlyColor": "#0B1628",
"euiFormBorderOpaqueColor": "#5054af",
"euiFormBorderColor": "#485975",
"euiFormBorderDisabledColor": "#485975",
"euiFormCustomControlDisabledIconColor": "#6A7FA0",
"euiFormCustomControlBorderColor": "#485975",
"euiFormControlDisabledColor": "#485975",
"euiFormControlBoxShadow": "0 0 rgba(0, 0, 0, 0)",
"euiFormControlPlaceholderText": "#8E9FBC",
"euiFormInputGroupLabelBackground": "#243147",
"euiFormInputGroupBorder": "none",
"euiSwitchOffColor": "#8E9FBC",
"euiFormControlIconSizes": {
"small": "12px",
"medium": "16px",
"large": "24px",
"xLarge": "32px",
"xxLarge": "40px"
},
"euiFormControlLayoutGroupInputHeight": "38px",
"euiFormControlLayoutGroupInputCompressedHeight": "30px",
"euiFormControlLayoutGroupInputCompressedBorderRadius": "2px",
"euiHeaderBackgroundColor": "#0B1628",
"euiHeaderDarkBackgroundColor": "#0B1628",
"euiHeaderBorderColor": "#2B394F",
"euiHeaderBreadcrumbColor": "#0D2F5E",
"euiHeaderHeight": "48px",
"euiHeaderChildSize": "40px",
"euiHeaderHeightCompensation": "48px",
"euiPageDefaultMaxWidth": "1200px",
"euiPageSidebarMinWidth": "192px",
"euiPanelPaddingModifiers": {
"paddingSmall": "8px",
"paddingMedium": "16px",
"paddingLarge": "24px"
},
"euiPanelBorderRadiusModifiers": {
"borderRadiusNone": 0,
"borderRadiusMedium": "6px"
},
"euiPanelBackgroundColorModifiers": {
"transparent": "rgba(0, 0, 0, 0)",
"plain": "#0B1628",
"subdued": "#07101F",
"accent": "#351725",
"accentSecondary": "#03282B",
"primary": "#0A2342",
"success": "#092A26",
"warning": "#2C2721",
"danger": "#351721"
},
"euiBreakpoints": {
"xs": 0,
"s": "575px",
"m": "768px",
"l": "992px",
"xl": "1200px"
},
"euiBreakpointKeys": "'xs', 's', 'm', 'l', 'xl'",
"euiShadowColor": "#000000",
"euiSize": "16px",
"euiSizeXS": "4px",
"euiSizeS": "8px",
"euiSizeM": "12px",
"euiSizeL": "24px",
"euiSizeXL": "32px",
"euiSizeXXL": "40px",
"euiScrollBar": "16px",
"euiScrollBarCorner": "4px",
"euiScrollBarCornerThin": "6px",
"euiFocusRingColor": "#599DFF",
"euiFocusRingAnimStartColor": "rgba(0, 0, 0, 0)",
"euiFocusRingAnimStartSize": "2px",
"euiFocusRingAnimStartSizeLarge": "10px",
"euiFocusRingSizeLarge": "4px",
"euiFocusRingSize": "2px",
"euiFocusTransparency": 0.8,
"euiFocusTransparencyPercent": "80%",
"euiFocusBackgroundColor": "#243147",
"euiFontFamily": "'Inter', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Helvetica', 'Arial', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'",
"euiCodeFontFamily": "'Roboto Mono', 'Consolas', 'Menlo', 'Courier', monospace",
"euiFontFeatureSettings": "calt 1 kern 1 liga 1",
"euiTextScale": "1,875, 1.5, 1.25, 1, .875, .75",
"euiFontSize": "14px",
"euiFontSizeXS": "12px",
"euiFontSizeS": "14px",
"euiFontSizeM": "16px",
"euiFontSizeL": "20px",
"euiFontSizeXL": "24px",
"euiFontSizeXXL": "30px",
"euiLineHeight": 1.5,
"euiBodyLineHeight": 1.142857143,
"euiTitles": {
"xxxs": {
"font-size": "12px",
"line-height": "1.1429rem",
"font-weight": 600
},
"xxs": {
"font-size": "14px",
"line-height": "1.4286rem",
"font-weight": 600
},
"xs": {
"font-size": "16px",
"line-height": "1.7143rem",
"font-weight": 600
},
"s": {
"font-size": "20px",
"line-height": "1.7143rem",
"font-weight": 600
},
"m": {
"font-size": "24px",
"line-height": "2rem",
"font-weight": 600
},
"l": {
"font-size": "30px",
"line-height": "2.5714rem",
"font-weight": 600
}
},
"euiZLevel0": 0,
"euiZLevel1": 1000,
"euiZLevel2": 2000,
"euiZLevel3": 3000,
"euiZLevel4": 4000,
"euiZLevel5": 5000,
"euiZLevel6": 6000,
"euiZLevel7": 7000,
"euiZLevel8": 8000,
"euiZLevel9": 9000,
"euiZToastList": 9000,
"euiZModal": 8000,
"euiZMask": 6000,
"euiZNavigation": 6000,
"euiZContentMenu": 2000,
"euiZHeader": 1000,
"euiZFlyout": 1000,
"euiZMaskBelowHeader": 1000,
"euiZContent": 0,
"euiColorGhost": "#FFFFFF",
"euiColorInk": "#000000",
"euiColorPrimary": "#599DFF",
"euiColorAccent": "#ED6BA2",
"euiColorAccentSecondary": "#00BEB8",
"euiColorSuccess": "#23BE8F",
"euiColorWarning": "#FCD279",
"euiColorDanger": "#F66D64",
"euiColorEmptyShade": "#0B1628",
"euiColorLightestShade": "#172336",
"euiColorLightShade": "#243147",
"euiColorMediumShade": "#516381",
"euiColorDarkShade": "#7186A8",
"euiColorDarkestShade": "#CAD3E2",
"euiColorFullShade": "#FFFFFF",
"euiPageBackgroundColor": "#07101F",
"euiColorHighlight": "#1750BA",
"euiTextColor": "#E3E8F2",
"euiTitleColor": "#ECF1F9",
"euiTextSubduedColor": "#8E9FBC",
"euiColorDisabled": "#1D2A3E",
"euiColorPrimaryText": "#599DFF",
"euiColorSuccessText": "#23BE8F",
"euiColorAccentText": "#ED6BA2",
"euiColorAccentSecondaryText": "#00BEB8",
"euiColorWarningText": "#FCD279",
"euiColorDangerText": "#F66D64",
"euiColorDisabledText": "#6A7FA0",
"euiLinkColor": "#599DFF",
"euiColorChartLines": "#7186A8",
"euiColorChartBand": "#243147"
}
Loading

0 comments on commit fd9a6ab

Please sign in to comment.