diff --git a/packages/eui/changelogs/upcoming/8054.md b/packages/eui/changelogs/upcoming/8054.md new file mode 100644 index 00000000000..5b862043dd5 --- /dev/null +++ b/packages/eui/changelogs/upcoming/8054.md @@ -0,0 +1,3 @@ +**Breaking changes** + +- Removed all `src/theme/legacy` Sass exports diff --git a/packages/eui/src/themes/legacy/_colors_dark.scss b/packages/eui/src/themes/legacy/_colors_dark.scss deleted file mode 100644 index f99ad0d4dac..00000000000 --- a/packages/eui/src/themes/legacy/_colors_dark.scss +++ /dev/null @@ -1,49 +0,0 @@ -// stylelint-disable color-no-hex - -// This extra import allows any variables that are created via functions to work when loaded into JS -@import '../../global_styling/functions/index'; - -// These colors stay the same no matter the theme -$euiColorGhost: #FFF !default; -$euiColorInk: #000 !default; - -// Core -$euiColorPrimary: #1BA9F5 !default; -$euiColorAccent: #F990C0 !default; - -// Status -$euiColorSuccess: #7DE2D1 !default; -$euiColorWarning: #FFCE7A !default; -$euiColorDanger: #F66 !default; - -// Grays -$euiColorEmptyShade: #1D1E24 !default; -$euiColorLightestShade: #25262E !default; -$euiColorLightShade: #343741 !default; -$euiColorMediumShade: #535966 !default; -$euiColorDarkShade: #98A2B3 !default; -$euiColorDarkestShade: #D4DAE5 !default; -$euiColorFullShade: #FFF !default; - -// Backgrounds -$euiPageBackgroundColor: shade($euiColorLightestShade, 45%) !default; -$euiColorHighlight: #2E2D25 !default; - -// Variations from core -$euiTextColor: #DFE5EF !default; -$euiTitleColor: $euiTextColor !default; -$euiTextSubduedColor: makeHighContrastColor($euiColorMediumShade) !default; -$euiColorDisabled: shade($euiTextColor, 70%) !default; - -// Contrasty text variants -$euiColorPrimaryText: makeHighContrastColor($euiColorPrimary) !default; -$euiColorSuccessText: makeHighContrastColor($euiColorSuccess) !default; -$euiColorAccentText: makeHighContrastColor($euiColorAccent) !default; -$euiColorWarningText: makeHighContrastColor($euiColorWarning) !default; -$euiColorDangerText: makeHighContrastColor($euiColorDanger) !default; -$euiColorDisabledText: makeDisabledContrastColor($euiColorDisabled) !default; -$euiLinkColor: $euiColorPrimaryText !default; - -// Charts -$euiColorChartLines: $euiColorLightShade !default; -$euiColorChartBand: tint($euiColorLightestShade, 2.5%) !default; diff --git a/packages/eui/src/themes/legacy/_colors_light.scss b/packages/eui/src/themes/legacy/_colors_light.scss deleted file mode 100644 index a1ad69b0df6..00000000000 --- a/packages/eui/src/themes/legacy/_colors_light.scss +++ /dev/null @@ -1,49 +0,0 @@ -// stylelint-disable color-no-hex - -// This extra import allows any variables that are created via functions to work when loaded into JS -@import '../../global_styling/functions/index'; - -// These colors stay the same no matter the theme -$euiColorGhost: #FFF !default; -$euiColorInk: #000 !default; - -// Core -$euiColorPrimary: #006BB4 !default; -$euiColorAccent: #DD0A73 !default; - -// Status -$euiColorSuccess: #017D73 !default; -$euiColorWarning: #F5A700 !default; -$euiColorDanger: #BD271E !default; - -// Grays -$euiColorEmptyShade: #FFF !default; -$euiColorLightestShade: #F5F7FA !default; -$euiColorLightShade: #D3DAE6 !default; -$euiColorMediumShade: #98A2B3 !default; -$euiColorDarkShade: #69707D !default; -$euiColorDarkestShade: #343741 !default; -$euiColorFullShade: #000 !default; - -// Backgrounds -$euiPageBackgroundColor: tint($euiColorLightestShade, 50%) !default; -$euiColorHighlight: #FFFCDD !default; - -// Every color below must be based mathematically on the set above and in a particular order. -$euiTextColor: $euiColorDarkestShade !default; -$euiTitleColor: shade($euiTextColor, 50%) !default; -$euiTextSubduedColor: makeHighContrastColor($euiColorMediumShade) !default; -$euiColorDisabled: tint($euiTextColor, 70%) !default; - -// Contrasty text variants -$euiColorPrimaryText: makeHighContrastColor($euiColorPrimary) !default; -$euiColorSuccessText: makeHighContrastColor($euiColorSuccess) !default; -$euiColorAccentText: makeHighContrastColor($euiColorAccent) !default; -$euiColorWarningText: makeHighContrastColor($euiColorWarning) !default; -$euiColorDangerText: makeHighContrastColor($euiColorDanger) !default; -$euiColorDisabledText: makeDisabledContrastColor($euiColorDisabled) !default; -$euiLinkColor: $euiColorPrimaryText !default; - -// Charts -$euiColorChartLines: shade($euiColorLightestShade, 3%) !default; -$euiColorChartBand: $euiColorLightestShade !default; diff --git a/packages/eui/src/themes/legacy/_globals.scss b/packages/eui/src/themes/legacy/_globals.scss deleted file mode 100644 index 0394733cb98..00000000000 --- a/packages/eui/src/themes/legacy/_globals.scss +++ /dev/null @@ -1,11 +0,0 @@ -// Helper file for supplying EUI globals (invisibles only) -// Must be imported AFTER a colors modifier file - -// Functions need to be first, since we use them in our variables and mixin definitions -@import '../../global_styling/functions/index'; - -// Variables come next, and are used in some mixins -@import '../../global_styling/variables/index'; - -// Mixins provide generic code expansion through helpers -@import '../../global_styling/mixins/index'; diff --git a/packages/eui/src/themes/legacy/legacy_dark.scss b/packages/eui/src/themes/legacy/legacy_dark.scss deleted file mode 100644 index 29a24f349f9..00000000000 --- a/packages/eui/src/themes/legacy/legacy_dark.scss +++ /dev/null @@ -1,11 +0,0 @@ -// These are variable overwrites used only for this theme. -@import 'colors_dark'; - -// Global styling -@import '../../global_styling/index'; - -// Global reset -@import './reset/index'; - -// Components -@import '../../components/index'; diff --git a/packages/eui/src/themes/legacy/legacy_light.scss b/packages/eui/src/themes/legacy/legacy_light.scss deleted file mode 100644 index 85778023067..00000000000 --- a/packages/eui/src/themes/legacy/legacy_light.scss +++ /dev/null @@ -1,11 +0,0 @@ -// This is the default theme. -@import 'colors_light'; - -// Global styling -@import '../../global_styling/index'; - -// Global reset -@import './reset/index'; - -// Components -@import '../../components/index'; diff --git a/packages/eui/src/themes/legacy/reset/_index.scss b/packages/eui/src/themes/legacy/reset/_index.scss deleted file mode 100644 index 4a15b73c70c..00000000000 --- a/packages/eui/src/themes/legacy/reset/_index.scss +++ /dev/null @@ -1,2 +0,0 @@ -@import 'reset'; -@import 'scrollbar'; diff --git a/packages/eui/src/themes/legacy/reset/_reset.scss b/packages/eui/src/themes/legacy/reset/_reset.scss deleted file mode 100644 index ed15cbfcd7b..00000000000 --- a/packages/eui/src/themes/legacy/reset/_reset.scss +++ /dev/null @@ -1,161 +0,0 @@ -// This file allows multi-line selectors to make it more readable -// stylelint-disable selector-list-comma-newline-after - -/** - * Adapted from Eric Meyer's reset (http://meyerweb.com/eric/tools/css/reset/, v2.0 | 20110126). - * - */ - -*, *::before, *::after { - box-sizing: border-box; -} - -html, body, div, span, applet, object, iframe, -h1, h2, h3, h4, h5, h6, p, blockquote, pre, -a, abbr, acronym, address, big, cite, code, -del, dfn, em, img, ins, kbd, q, s, samp, -small, strike, strong, sub, sup, tt, var, -b, u, i, center, -dl, dt, dd, ol, ul, li, -fieldset, form, label, legend, -table, caption, tbody, tfoot, thead, tr, th, td, -article, aside, canvas, details, embed, -figure, figcaption, footer, header, hgroup, -menu, nav, output, ruby, section, summary, -time, mark, audio, video { - margin: 0; - padding: 0; - border: none; - vertical-align: baseline; -} - -code, pre, kbd, samp { - font-family: $euiCodeFontFamily; -} - -h1, h2, h3, h4, h5, h6, p { - font-family: inherit; - font-weight: inherit; - font-size: inherit; -} - -input, textarea, select, button { - font-family: $euiFontFamily; -} - -em { - font-style: italic; -} - -strong { - font-weight: $euiFontWeightBold; -} - -/* HTML5 display-role reset for older browsers */ -article, aside, details, figcaption, figure, -footer, header, hgroup, menu, nav, section { - display: block; -} - -html { - @include euiFont; - font-size: $euiFontSize; - color: $euiTextColor; - height: 100%; - background-color: $euiPageBackgroundColor; -} - -body { - line-height: $euiBodyLineHeight; -} - -*:focus { - outline: none; - - // stylelint-disable selector-no-vendor-prefix - // Disables border that shows up when tabbing in Firefox. - &::-moz-focus-inner { - border: none; - } - - &:-moz-focusring { - outline: none; - } -} - -a { - text-decoration: none; - color: $euiColorPrimary; - - &:hover { - text-decoration: none; - } - - &:focus { - text-decoration: none; - outline: none; - } -} - -a:hover, button, [role='button'] { - cursor: pointer; -} - -input { - margin: 0; - padding: 0; - - &:disabled { - opacity: 1; /* required on iOS */ - } -} - -button { - background: none; - border: none; - padding: 0; - margin: 0; - outline: none; - font-size: inherit; - color: inherit; - border-radius: 0; - - &:hover { - cursor: pointer; - } -} - -ol, ul { - list-style: none; -} - -blockquote, q { - quotes: none; -} - -blockquote::before, blockquote::after, -q::before, q::after { - content: ''; - content: none; -} - -table { - border-collapse: collapse; - border-spacing: 0; -} - -hr { - margin: 0; -} - -fieldset { - min-inline-size: auto; -} - -/* Chrome has an issue around RTL languages in SVGs when letter-spacing is negative - * https://bugs.chromium.org/p/chromium/issues/detail?id=966480 - */ - -svg text { - letter-spacing: normal !important; // stylelint-disable-line declaration-no-important -} diff --git a/packages/eui/src/themes/legacy/reset/_scrollbar.scss b/packages/eui/src/themes/legacy/reset/_scrollbar.scss deleted file mode 100644 index 4fc1e13ee3f..00000000000 --- a/packages/eui/src/themes/legacy/reset/_scrollbar.scss +++ /dev/null @@ -1,6 +0,0 @@ -// Declaring the top level scrollbar colors to match the theme also requires setting the sizes on Chrome -// so that it knows to use custom styles. Therefore, we just reuse the same scrollbar mixin with `thick` size. - -html { - @include euiScrollBar($euiColorDarkShade, shadeOrTint($euiPageBackgroundColor, 3%, 7%), 'thick'); -}