@eui/styles 14.0.6 → 15.0.0-next.2

package/src/styles/eui-dev.scss

@@ -1,5 +1,5 @@
-// NORMALIZE, RESET & GENERICS
-@import '00-resets/module';
+// RESET
+@import '00-reset/module';
 
 // BASE
 @import '_base';
@@ -7,9 +7,6 @@
 // BASE ROOT VARS
 @import '02b-base-vars/module';
 
-// THEMES VARS
-@import '02c-themes-vars/module';
-
 // ASSETS
 @import '03-assets/module';
 
@@ -17,7 +14,7 @@
 @import '04-vendors/module';
 
 // MATERIAL
-@import '05-material/module';
+// @import '05-material/module';  // TODO v15 migration
 
 // SHARED and overrides
 @import '06-shared/module';

package/src/styles/eui-legacy-dev.scss

@@ -1,5 +1,6 @@
 // BASE
 @import '_base';
+@import '@eui/styles-base/src/styles/05-assets/icons-font/variables';
 
 // BASE ROOT VARS
 @import '02b-base-vars/module';

package/src/styles/eui-legacy.scss

@@ -2,6 +2,7 @@ $eui-assets-path: '@eui/styles-base/dist/assets';
 
 // BASE
 @import '_base';
+@import '@eui/styles-base/src/styles/05-assets/icons-font/variables';
 
 // BASE ROOT VARS
 @import '02b-base-vars/module';

package/src/styles/eui.scss

@@ -1,7 +1,7 @@
 $eui-assets-path: '@eui/styles-base/dist/assets';
 
-// NORMALIZE, RESET & GENERICS
-@import '00-resets/module';
+// RESET
+@import '00-reset/module';
 
 // BASE
 @import '_base';
@@ -9,9 +9,6 @@ $eui-assets-path: '@eui/styles-base/dist/assets';
 // BASE ROOT VARS
 @import '02b-base-vars/module';
 
-// THEMES VARS
-@import '02c-themes-vars/module';
-
 // ASSETS
 @import '03-assets/module';
 
@@ -19,7 +16,7 @@ $eui-assets-path: '@eui/styles-base/dist/assets';
 @import '04-vendors/module';
 
 // MATERIAL
-@import '05-material/module';
+// @import '05-material/module';  // TODO v15 migration
 
 // SHARED and overrides
 @import '06-shared/module';
@@ -36,3 +33,4 @@ $eui-assets-path: '@eui/styles-base/dist/assets';
 // UTILITIES
 @import '99-utilities/module';
 
+

package/src/styles/00-resets/_module.scss

@@ -1,2 +0,0 @@
-@import '@eui/styles-base/src/styles/00-resets/module';
-@import 'reset';

package/src/styles/00-resets/_reset.scss

@@ -1,141 +0,0 @@
-/* http://meyerweb.com/eric/tools/css/reset/
-   v2.0 | 20110126
-   License: none (public domain)
-*/
-
-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 {
-    border: 0;
-    font: inherit;
-    font-size: 100%;
-    margin: 0;
-    padding: 0;
-}
-
-/* HTML5 display-role reset for older browsers */
-article,
-aside,
-details,
-figcaption,
-figure,
-footer,
-header,
-hgroup,
-menu,
-nav,
-section {
-    display: block;
-}
-
-body {
-    line-height: 1;
-}
-
-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;
-}
-
-fieldset {
-    background-color: #fff;
-    border: none;
-    margin: 0;
-    padding: 0;
-}

package/src/styles/02c-themes-vars/_module.scss

@@ -1,95 +0,0 @@
-// TODO
-// @import 'compact/module';
-
-
-// $compact-factor: 0.96;
-
-// .form--compact {
-//     --eui-font-size-5xl: 2rem;
-//     --eui-font-size-4xl: #{$eui-font-size-4xl * $compact-factor};
-//     --eui-font-size-3xl: #{$eui-font-size-3xl * $compact-factor};
-//     --eui-font-size-2xl: #{$eui-font-size-2xl * $compact-factor};
-//     --eui-font-size-xl:  #{$eui-font-size-xl * $compact-factor};
-//     --eui-font-size-l:   #{$eui-font-size-l * $compact-factor};
-//     --eui-font-size-m:   #{$eui-font-size-m * $compact-factor};
-//     --eui-font-size-s:   #{$eui-font-size-s * $compact-factor};
-//     --eui-font-size-xs:  #{$eui-font-size-xs * $compact-factor};
-//     --eui-font-size-2xs: #{$eui-font-size-2xs * $compact-factor};
-//     // Spacings
-//     --eui-spacing-none: #{$eui-spacer-0};
-//     --eui-spacing: #{$eui-spacer * $compact-factor};
-//     --eui-spacing-3xs: 0.125rem;
-//     --eui-spacing-2xs: #{$eui-spacer-2xs * $compact-factor};
-//     --eui-spacing-1xs: #{$eui-spacer-s / 2 * $compact-factor};
-//     --eui-spacing-xs: #{$eui-spacer-xs * $compact-factor};
-//     --eui-spacing-s: #{$eui-spacer-s * $compact-factor};
-//     --eui-spacing-m: #{$eui-spacer-m * $compact-factor};
-//     --eui-spacing-l: #{$eui-spacer-l * $compact-factor};
-//     --eui-spacing-xl: #{$eui-spacer-xl * $compact-factor};
-//     --eui-spacing-2xl: #{$eui-spacer-2xl * $compact-factor};
-//     --eui-spacing-3xl: #{$eui-spacer-3xl * $compact-factor};
-//     --eui-spacing-4xl: #{$eui-spacer-4xl * $compact-factor};
-
-//     // Vertical layout
-//     .ux-form-group.ux-form-group--vertical {
-//         .ux-form-group--read-only {
-//             height: auto;
-//             padding: v(eui-base-spacing-2xs) v(eui-base-spacing-s) v(eui-base-spacing-2xs) 0 !important;
-//         }
-
-//         .ux-datepicker--read-only {
-//             height: auto;
-//             padding: v(eui-base-spacing-2xs) 0 !important;
-//         }
-//     }
-
-//     // Horizontal layout
-//     .row.ux-form-group {
-//         margin-bottom: v(eui-base-spacing-xs);
-//     }
-// }
-
-// // TO BE DEPRECATED !
-// $ultracompact-factor: 0.8;
-
-// .form--ultracompact {
-//     // --eui-font-size: 14px;
-//     --eui-font-size-5xl: 2rem;
-//     --eui-font-size-4xl: #{$eui-font-size-4xl * $ultracompact-factor};
-//     --eui-font-size-3xl: #{$eui-font-size-3xl * $ultracompact-factor};
-//     --eui-font-size-2xl: #{$eui-font-size-2xl * $ultracompact-factor};
-//     --eui-font-size-xl:  #{$eui-font-size-xl * $ultracompact-factor};
-//     --eui-font-size-l:   #{$eui-font-size-l * $ultracompact-factor};
-//     --eui-font-size-m:   #{$eui-font-size-m * $ultracompact-factor};
-//     --eui-font-size-s:   #{$eui-font-size-s * $ultracompact-factor};
-//     --eui-font-size-xs:  #{$eui-font-size-xs * $ultracompact-factor};
-//     --eui-font-size-2xs: #{$eui-font-size-2xs * $ultracompact-factor};
-//     --eui-spacing-none: #{$eui-spacer-0};
-//     --eui-spacing: #{$eui-spacer * $ultracompact-factor};
-//     --eui-spacing-3xs: 0.125rem;
-//     --eui-spacing-2xs: #{$eui-spacer-2xs * $ultracompact-factor};
-//     --eui-spacing-1xs: #{$eui-spacer-s / 2 * $ultracompact-factor};
-//     --eui-spacing-xs: #{$eui-spacer-xs * $ultracompact-factor};
-//     --eui-spacing-s: #{$eui-spacer-s * $ultracompact-factor};
-//     --eui-spacing-m: #{$eui-spacer-m * $ultracompact-factor};
-//     --eui-spacing-l: #{$eui-spacer-l * $ultracompact-factor};
-//     --eui-spacing-xl: #{$eui-spacer-xl * $ultracompact-factor};
-//     --eui-spacing-2xl: #{$eui-spacer-2xl * $ultracompact-factor};
-//     --eui-spacing-3xl: #{$eui-spacer-3xl * $ultracompact-factor};
-//     --eui-spacing-4xl: #{$eui-spacer-4xl * $ultracompact-factor};
-
-//     .ux-form-group--read-only {
-//         padding: v(eui-base-spacing-3xs) v(eui-base-spacing-s) v(eui-base-spacing-3xs) 0 !important;
-//     }
-
-//     .ux-datepicker--read-only {
-//         height: 1.5rem;
-//     }
-
-//     input[type="checkbox"].ux-input__checkbox + label::after {
-//         height: 3px;
-//         left: 2px;
-//         margin-top: -6px;
-//     }
-// }
-

package/src/styles/02c-themes-vars/_old-to-check/compact/_font-size.vars.scss

@@ -1,3 +0,0 @@
-html.eui-t-compact {
-    --eui-font-size: 14px;
-}

package/src/styles/02c-themes-vars/_old-to-check/compact/_global.vars.scss

@@ -1,4 +0,0 @@
-html.eui-t-compact {
-    --eui-scale-factor-base: 1;
-    --eui-line-height-base: 1.25;
-}

package/src/styles/02c-themes-vars/_old-to-check/compact/_layout.vars-next.scss

@@ -1,16 +0,0 @@
-html.eui-t-compact {
-    // eUI APP
-    --eui-app-header-height-default: 0;
-    --eui-app-header-height-active: 80px;
-    --eui-app-header-height-shrink: 0;
-
-    // Toolbar
-    --eui-app-toolbar-height: 40px;
-
-    // Sidebar
-    --eui-app-sidebar-width-default: 0;
-    --eui-app-sidebar-width-active: 245px;
-    --eui-app-sidebar-width-close-default: 0;
-    --eui-app-sidebar-width-close: 0;
-    --eui-app-sidebar-width-close-active: 60px;
-}

package/src/styles/02c-themes-vars/_old-to-check/compact/_layout.vars.scss

@@ -1,46 +0,0 @@
-html.eui-t-compact {
-    // APP-SHELL Layout
-    --eui-app-shell-header-height: 4rem;
-    --eui-app-shell-header-mobile-height: 4rem;
-    --eui-app-shell-header-profile-avatar-height: 40px;
-    --eui-app-shell-header-profile-avatar-width: 40px;
-    //
-    --eui-app-shell-sidebar-width: 15rem;
-    --eui-app-shell-sidebar-width--closed: 5rem;
-    // --eui-app-shell-sidebar-header-logo-height: 67px;
-    // --eui-app-shell-sidebar-header-logo-width: 135px;
-    --eui-app-shell-sidebar-header-logo-small-height: 40px;
-    --eui-app-shell-sidebar-header-logo-small-width: 60px;
-    // --eui-app-shell-sidebar-header-logo-eu-height: 60px;
-    // --eui-app-shell-sidebar-header-logo-eu-width: 90px;
-
-    // --eui-app-shell-filterbar-width: 18rem;
-    // --eui-app-shell-filterbar-width--closed: 5rem;
-
-    // Page Layout
-    --eui-page-header-with-subtitle-height: 3.5rem;
-    --eui-page-header-without-subtitle-height: 2rem;
-
-    // --eui-page-column--size-s: 50px;
-    // --eui-page-column--size-m: 150px;
-    // --eui-page-column--size-l: 200px;
-    // --eui-page-column--size-xl: 250px;
-    // --eui-page-column--size-xxl: 300px;
-    // --eui-page-column--size-xxxl: 350px;
-    --eui-page-column-footer-height: 2.5rem;
-
-    // eUI Layout
-    --eui-layout-header-height: 80px;
-    --eui-layout-header-logo-height: 64px;
-    --eui-layout-header-logo-width: 230px;
-    --eui-layout-nav-height: 40px;
-
-    // --eui-layout-sidebar-width: 250px;
-    // --eui-layout-sidebar-tablet-width: 200px;
-    // --eui-layout-sidebar-mobile-width: 150px;
-
-    // --eui-layout-largedesktop-body-width: 1400px;
-
-    --eui-layout-footer-height: 4rem;
-    --eui-layout-footer-height--compact: 3rem;
-}

package/src/styles/02c-themes-vars/_old-to-check/compact/_module-next.scss

@@ -1,4 +0,0 @@
-@import 'global.vars';
-@import 'font-size.vars';
-@import 'spacing.vars';
-@import 'layout.vars-next';

package/src/styles/02c-themes-vars/_old-to-check/compact/_module.scss

@@ -1,4 +0,0 @@
-@import 'global.vars';
-@import 'font-size.vars';
-@import 'spacing.vars';
-@import 'layout.vars';

package/src/styles/02c-themes-vars/_old-to-check/compact/_spacing.vars.scss

@@ -1 +0,0 @@
-// Auto-computed based on the --eui-font-base CSS var