mirror of
https://github.com/akveo/ngx-admin.git
synced 2025-12-16 15:40:11 +01:00
Move material theme files from @nebular
This commit is contained in:
eugene-sinitsyn
Maksim Karatkevich
parent
9b88c7b03b
commit
42dc740e38
5 changed files with 839 additions and 2 deletions
370
src/app/@theme/styles/_material-dark.scss
Normal file
370
src/app/@theme/styles/_material-dark.scss
Normal file
|
|
@ -0,0 +1,370 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Akveo. All Rights Reserved.
|
||||
* Licensed under the MIT License. See License.txt in the project root for license information.
|
||||
*/
|
||||
|
||||
@import '~@nebular/theme/styles/core/functions';
|
||||
@import '~@nebular/theme/styles/core/mixins';
|
||||
|
||||
$theme: (
|
||||
color-primary-100: #fff2f7,
|
||||
color-primary-200: #ffd4e3,
|
||||
color-primary-300: #fc9abc,
|
||||
color-primary-400: #f24681,
|
||||
color-primary-500: #e91d63,
|
||||
color-primary-600: #c71451,
|
||||
color-primary-700: #a80d43,
|
||||
color-primary-800: #870935,
|
||||
color-primary-900: #70062a,
|
||||
|
||||
color-primary-transparent-100: rgba(233, 29, 99, 0.08),
|
||||
color-primary-transparent-200: rgba(233, 29, 99, 0.16),
|
||||
color-primary-transparent-300: rgba(233, 29, 99, 0.24),
|
||||
color-primary-transparent-400: rgba(233, 29, 99, 0.32),
|
||||
color-primary-transparent-500: rgba(233, 29, 99, 0.4),
|
||||
color-primary-transparent-600: rgba(233, 29, 99, 0.48),
|
||||
|
||||
color-success-100: #edfbd1,
|
||||
color-success-200: #d7f7a6,
|
||||
color-success-300: #b4e775,
|
||||
color-success-400: #8fcf50,
|
||||
color-success-500: #60af20,
|
||||
color-success-600: #499617,
|
||||
color-success-700: #357d10,
|
||||
color-success-800: #24650a,
|
||||
color-success-900: #175306,
|
||||
|
||||
color-success-transparent-100: rgba(96, 175, 32, 0.08),
|
||||
color-success-transparent-200: rgba(96, 175, 32, 0.16),
|
||||
color-success-transparent-300: rgba(96, 175, 32, 0.24),
|
||||
color-success-transparent-400: rgba(96, 175, 32, 0.32),
|
||||
color-success-transparent-500: rgba(96, 175, 32, 0.4),
|
||||
color-success-transparent-600: rgba(96, 175, 32, 0.48),
|
||||
|
||||
color-info-100: #ccf7fe,
|
||||
color-info-200: #99e9fd,
|
||||
color-info-300: #66d3f9,
|
||||
color-info-400: #40bbf4,
|
||||
color-info-500: #0495ee,
|
||||
color-info-600: #0273cc,
|
||||
color-info-700: #0256ab,
|
||||
color-info-800: #013d8a,
|
||||
color-info-900: #002b72,
|
||||
|
||||
color-info-transparent-100: rgba(4, 149, 238, 0.08),
|
||||
color-info-transparent-200: rgba(4, 149, 238, 0.16),
|
||||
color-info-transparent-300: rgba(4, 149, 238, 0.24),
|
||||
color-info-transparent-400: rgba(4, 149, 238, 0.32),
|
||||
color-info-transparent-500: rgba(4, 149, 238, 0.4),
|
||||
color-info-transparent-600: rgba(4, 149, 238, 0.48),
|
||||
|
||||
color-warning-100: #fff3cd,
|
||||
color-warning-200: #ffe49b,
|
||||
color-warning-300: #ffd169,
|
||||
color-warning-400: #ffbe43,
|
||||
color-warning-500: #ff9f05,
|
||||
color-warning-600: #db8003,
|
||||
color-warning-700: #b76302,
|
||||
color-warning-800: #934a01,
|
||||
color-warning-900: #7a3800,
|
||||
|
||||
color-warning-transparent-100: rgba(255, 159, 5, 0.08),
|
||||
color-warning-transparent-200: rgba(255, 159, 5, 0.16),
|
||||
color-warning-transparent-300: rgba(255, 159, 5, 0.24),
|
||||
color-warning-transparent-400: rgba(255, 159, 5, 0.32),
|
||||
color-warning-transparent-500: rgba(255, 159, 5, 0.4),
|
||||
color-warning-transparent-600: rgba(255, 159, 5, 0.48),
|
||||
|
||||
color-danger-100: #fbd2c8,
|
||||
color-danger-200: #f79e94,
|
||||
color-danger-300: #e75d5c,
|
||||
color-danger-400: #cf3341,
|
||||
color-danger-500: #b00020,
|
||||
color-danger-600: #970029,
|
||||
color-danger-700: #7e002e,
|
||||
color-danger-800: #66002f,
|
||||
color-danger-900: #54002f,
|
||||
|
||||
color-danger-transparent-100: rgba(176, 0, 32, 0.08),
|
||||
color-danger-transparent-200: rgba(176, 0, 32, 0.16),
|
||||
color-danger-transparent-300: rgba(176, 0, 32, 0.24),
|
||||
color-danger-transparent-400: rgba(176, 0, 32, 0.32),
|
||||
color-danger-transparent-500: rgba(176, 0, 32, 0.4),
|
||||
color-danger-transparent-600: rgba(176, 0, 32, 0.48),
|
||||
|
||||
color-basic-100: #ffffff,
|
||||
color-basic-200: #f5f5f5,
|
||||
color-basic-300: #f5f5f5,
|
||||
color-basic-400: #d4d4d4,
|
||||
color-basic-500: #b3b3b3,
|
||||
color-basic-600: #808080,
|
||||
color-basic-700: #4a4a4a,
|
||||
color-basic-800: #383838,
|
||||
color-basic-900: #292929,
|
||||
color-basic-1000: #1f1f1f,
|
||||
color-basic-1100: #141414,
|
||||
|
||||
color-basic-transparent-100: rgba(128, 128, 128, 0.08),
|
||||
color-basic-transparent-200: rgba(128, 128, 128, 0.16),
|
||||
color-basic-transparent-300: rgba(128, 128, 128, 0.24),
|
||||
color-basic-transparent-400: rgba(128, 128, 128, 0.32),
|
||||
color-basic-transparent-500: rgba(128, 128, 128, 0.4),
|
||||
color-basic-transparent-600: rgba(128, 128, 128, 0.48),
|
||||
|
||||
color-basic-control-transparent-100: rgba(255, 255, 255, 0.08),
|
||||
color-basic-control-transparent-200: rgba(255, 255, 255, 0.16),
|
||||
color-basic-control-transparent-300: rgba(255, 255, 255, 0.24),
|
||||
color-basic-control-transparent-400: rgba(255, 255, 255, 0.32),
|
||||
color-basic-control-transparent-500: rgba(255, 255, 255, 0.4),
|
||||
color-basic-control-transparent-600: rgba(255, 255, 255, 0.48),
|
||||
|
||||
color-basic-focus: color-basic-400,
|
||||
color-basic-hover: color-basic-200,
|
||||
color-basic-default: color-basic-300,
|
||||
color-basic-active: color-basic-400,
|
||||
color-basic-disabled: color-basic-transparent-300,
|
||||
color-basic-focus-border: color-basic-500,
|
||||
color-basic-hover-border: color-basic-hover,
|
||||
color-basic-default-border: color-basic-default,
|
||||
color-basic-active-border: color-basic-active,
|
||||
color-basic-disabled-border: color-basic-disabled,
|
||||
|
||||
color-basic-transparent-focus: color-basic-transparent-300,
|
||||
color-basic-transparent-hover: color-basic-transparent-200,
|
||||
color-basic-transparent-default: color-basic-transparent-100,
|
||||
color-basic-transparent-active: color-basic-transparent-300,
|
||||
color-basic-transparent-disabled: color-basic-transparent-200,
|
||||
color-basic-transparent-focus-border: color-basic-500,
|
||||
color-basic-transparent-hover-border: color-basic-500,
|
||||
color-basic-transparent-default-border: color-basic-500,
|
||||
color-basic-transparent-active-border: color-basic-500,
|
||||
color-basic-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
color-primary-focus: color-primary-600,
|
||||
color-primary-hover: color-primary-400,
|
||||
color-primary-default: color-primary-500,
|
||||
color-primary-active: color-primary-600,
|
||||
color-primary-disabled: color-basic-transparent-300,
|
||||
color-primary-focus-border: color-primary-700,
|
||||
color-primary-hover-border: color-primary-hover,
|
||||
color-primary-default-border: color-primary-default,
|
||||
color-primary-active-border: color-primary-active,
|
||||
color-primary-disabled-border: color-primary-disabled,
|
||||
|
||||
color-primary-transparent-focus: color-primary-transparent-300,
|
||||
color-primary-transparent-hover: color-primary-transparent-200,
|
||||
color-primary-transparent-default: color-primary-transparent-100,
|
||||
color-primary-transparent-active: color-primary-transparent-300,
|
||||
color-primary-transparent-disabled: color-basic-transparent-200,
|
||||
color-primary-transparent-focus-border: color-primary-500,
|
||||
color-primary-transparent-hover-border: color-primary-500,
|
||||
color-primary-transparent-default-border: color-primary-500,
|
||||
color-primary-transparent-active-border: color-primary-500,
|
||||
color-primary-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
color-success-focus: color-success-600,
|
||||
color-success-hover: color-success-400,
|
||||
color-success-default: color-success-500,
|
||||
color-success-active: color-success-600,
|
||||
color-success-disabled: color-basic-transparent-300,
|
||||
color-success-focus-border: color-success-700,
|
||||
color-success-hover-border: color-success-hover,
|
||||
color-success-default-border: color-success-default,
|
||||
color-success-active-border: color-success-active,
|
||||
color-success-disabled-border: color-success-disabled,
|
||||
|
||||
color-success-transparent-focus: color-success-transparent-300,
|
||||
color-success-transparent-hover: color-success-transparent-200,
|
||||
color-success-transparent-default: color-success-transparent-100,
|
||||
color-success-transparent-active: color-success-transparent-300,
|
||||
color-success-transparent-disabled: color-basic-transparent-200,
|
||||
color-success-transparent-focus-border: color-success-500,
|
||||
color-success-transparent-hover-border: color-success-500,
|
||||
color-success-transparent-default-border: color-success-500,
|
||||
color-success-transparent-active-border: color-success-500,
|
||||
color-success-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
color-info-focus: color-info-600,
|
||||
color-info-hover: color-info-400,
|
||||
color-info-default: color-info-500,
|
||||
color-info-active: color-info-600,
|
||||
color-info-disabled: color-basic-transparent-300,
|
||||
color-info-focus-border: color-info-700,
|
||||
color-info-hover-border: color-info-hover,
|
||||
color-info-default-border: color-info-default,
|
||||
color-info-active-border: color-info-active,
|
||||
color-info-disabled-border: color-info-disabled,
|
||||
|
||||
color-info-transparent-focus: color-info-transparent-300,
|
||||
color-info-transparent-hover: color-info-transparent-200,
|
||||
color-info-transparent-default: color-info-transparent-100,
|
||||
color-info-transparent-active: color-info-transparent-300,
|
||||
color-info-transparent-disabled: color-basic-transparent-200,
|
||||
color-info-transparent-focus-border: color-info-500,
|
||||
color-info-transparent-hover-border: color-info-500,
|
||||
color-info-transparent-default-border: color-info-500,
|
||||
color-info-transparent-active-border: color-info-500,
|
||||
color-info-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
color-warning-focus: color-warning-600,
|
||||
color-warning-hover: color-warning-400,
|
||||
color-warning-default: color-warning-500,
|
||||
color-warning-active: color-warning-600,
|
||||
color-warning-disabled: color-basic-transparent-300,
|
||||
color-warning-focus-border: color-warning-700,
|
||||
color-warning-hover-border: color-warning-hover,
|
||||
color-warning-default-border: color-warning-default,
|
||||
color-warning-active-border: color-warning-active,
|
||||
color-warning-disabled-border: color-warning-disabled,
|
||||
|
||||
color-warning-transparent-focus: color-warning-transparent-300,
|
||||
color-warning-transparent-hover: color-warning-transparent-200,
|
||||
color-warning-transparent-default: color-warning-transparent-100,
|
||||
color-warning-transparent-active: color-warning-transparent-300,
|
||||
color-warning-transparent-disabled: color-basic-transparent-200,
|
||||
color-warning-transparent-focus-border: color-warning-500,
|
||||
color-warning-transparent-hover-border: color-warning-500,
|
||||
color-warning-transparent-default-border: color-warning-500,
|
||||
color-warning-transparent-active-border: color-warning-500,
|
||||
color-warning-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
color-danger-focus: color-danger-600,
|
||||
color-danger-hover: color-danger-400,
|
||||
color-danger-default: color-danger-500,
|
||||
color-danger-active: color-danger-600,
|
||||
color-danger-disabled: color-basic-transparent-300,
|
||||
color-danger-focus-border: color-danger-700,
|
||||
color-danger-hover-border: color-danger-hover,
|
||||
color-danger-default-border: color-danger-default,
|
||||
color-danger-active-border: color-danger-active,
|
||||
color-danger-disabled-border: color-danger-disabled,
|
||||
|
||||
color-danger-transparent-focus: color-danger-transparent-300,
|
||||
color-danger-transparent-hover: color-danger-transparent-200,
|
||||
color-danger-transparent-default: color-danger-transparent-100,
|
||||
color-danger-transparent-active: color-danger-transparent-300,
|
||||
color-danger-transparent-disabled: color-basic-transparent-200,
|
||||
color-danger-transparent-focus-border: color-danger-500,
|
||||
color-danger-transparent-hover-border: color-danger-500,
|
||||
color-danger-transparent-default-border: color-danger-500,
|
||||
color-danger-transparent-active-border: color-danger-500,
|
||||
color-danger-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
color-control-focus: color-basic-300,
|
||||
color-control-hover: color-basic-200,
|
||||
color-control-default: color-basic-100,
|
||||
color-control-active: color-basic-300,
|
||||
color-control-disabled: color-basic-transparent-300,
|
||||
color-control-focus-border: color-basic-500,
|
||||
color-control-hover-border: color-control-hover,
|
||||
color-control-default-border: color-control-default,
|
||||
color-control-active-border: color-control-active,
|
||||
color-control-disabled-border: color-control-disabled,
|
||||
|
||||
color-control-transparent-focus: color-basic-control-transparent-300,
|
||||
color-control-transparent-hover: color-basic-control-transparent-200,
|
||||
color-control-transparent-default: color-basic-control-transparent-100,
|
||||
color-control-transparent-active: color-basic-control-transparent-300,
|
||||
color-control-transparent-disabled: color-basic-transparent-200,
|
||||
color-control-transparent-focus-border: color-basic-100,
|
||||
color-control-transparent-hover-border: color-basic-100,
|
||||
color-control-transparent-default-border: color-basic-100,
|
||||
color-control-transparent-active-border: color-basic-100,
|
||||
color-control-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
background-basic-color-1: color-basic-800,
|
||||
background-basic-color-2: color-basic-900,
|
||||
background-basic-color-3: color-basic-1000,
|
||||
background-basic-color-4: color-basic-1100,
|
||||
|
||||
background-alternative-color-1: color-basic-100,
|
||||
background-alternative-color-2: color-basic-200,
|
||||
background-alternative-color-3: color-basic-300,
|
||||
background-alternative-color-4: color-basic-400,
|
||||
|
||||
border-basic-color-1: color-basic-800,
|
||||
border-basic-color-2: color-basic-900,
|
||||
border-basic-color-3: color-basic-1000,
|
||||
border-basic-color-4: color-basic-1100,
|
||||
border-basic-color-5: color-basic-1100,
|
||||
|
||||
border-alternative-color-1: color-basic-100,
|
||||
border-alternative-color-2: color-basic-200,
|
||||
border-alternative-color-3: color-basic-300,
|
||||
border-alternative-color-4: color-basic-400,
|
||||
border-alternative-color-5: color-basic-500,
|
||||
|
||||
border-primary-color-1: color-primary-500,
|
||||
border-primary-color-2: color-primary-600,
|
||||
border-primary-color-3: color-primary-700,
|
||||
border-primary-color-4: color-primary-800,
|
||||
border-primary-color-5: color-primary-900,
|
||||
|
||||
border-success-color-1: color-success-500,
|
||||
border-success-color-2: color-success-600,
|
||||
border-success-color-3: color-success-700,
|
||||
border-success-color-4: color-success-800,
|
||||
border-success-color-5: color-success-900,
|
||||
|
||||
border-info-color-1: color-info-500,
|
||||
border-info-color-2: color-info-600,
|
||||
border-info-color-3: color-info-700,
|
||||
border-info-color-4: color-info-800,
|
||||
border-info-color-5: color-info-900,
|
||||
|
||||
border-warning-color-1: color-warning-500,
|
||||
border-warning-color-2: color-warning-600,
|
||||
border-warning-color-3: color-warning-700,
|
||||
border-warning-color-4: color-warning-800,
|
||||
border-warning-color-5: color-warning-900,
|
||||
|
||||
border-danger-color-1: color-danger-500,
|
||||
border-danger-color-2: color-danger-600,
|
||||
border-danger-color-3: color-danger-700,
|
||||
border-danger-color-4: color-danger-800,
|
||||
border-danger-color-5: color-danger-900,
|
||||
|
||||
text-basic-color: color-basic-100,
|
||||
text-alternate-color: color-basic-900,
|
||||
text-control-color: color-basic-100,
|
||||
text-disabled-color: color-basic-transparent-600,
|
||||
text-hint-color: color-basic-600,
|
||||
|
||||
text-primary-color: color-primary-default,
|
||||
text-primary-focus-color: color-primary-focus,
|
||||
text-primary-hover-color: color-primary-hover,
|
||||
text-primary-active-color: color-primary-active,
|
||||
text-primary-disabled-color: color-primary-400,
|
||||
|
||||
text-success-color: color-success-default,
|
||||
text-success-focus-color: color-success-focus,
|
||||
text-success-hover-color: color-success-hover,
|
||||
text-success-active-color: color-success-active,
|
||||
text-success-disabled-color: color-success-400,
|
||||
|
||||
text-info-color: color-info-default,
|
||||
text-info-focus-color: color-info-focus,
|
||||
text-info-hover-color: color-info-hover,
|
||||
text-info-active-color: color-info-active,
|
||||
text-info-disabled-color: color-info-400,
|
||||
|
||||
text-warning-color: color-warning-default,
|
||||
text-warning-focus-color: color-warning-focus,
|
||||
text-warning-hover-color: color-warning-hover,
|
||||
text-warning-active-color: color-warning-active,
|
||||
text-warning-disabled-color: color-warning-400,
|
||||
|
||||
text-danger-color: color-danger-default,
|
||||
text-danger-focus-color: color-danger-focus,
|
||||
text-danger-hover-color: color-danger-hover,
|
||||
text-danger-active-color: color-danger-active,
|
||||
text-danger-disabled-color: color-danger-400,
|
||||
|
||||
shadow: '0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2)',
|
||||
outline-color: color-basic-700,
|
||||
|
||||
font-family-primary: unquote('Roboto, sans-serif')
|
||||
);
|
||||
|
||||
$nb-themes: nb-register-theme($theme, material-dark, dark);
|
||||
370
src/app/@theme/styles/_material-light.scss
Normal file
370
src/app/@theme/styles/_material-light.scss
Normal file
|
|
@ -0,0 +1,370 @@
|
|||
/**
|
||||
* @license
|
||||
* Copyright Akveo. All Rights Reserved.
|
||||
* Licensed under the MIT License. See License.txt in the project root for license information.
|
||||
*/
|
||||
|
||||
@import '~@nebular/theme/styles/core/functions';
|
||||
@import '~@nebular/theme/styles/core/mixins';
|
||||
|
||||
$theme: (
|
||||
color-primary-100: #e8cbfe,
|
||||
color-primary-200: #ce97fd,
|
||||
color-primary-300: #ae63f9,
|
||||
color-primary-400: #903df4,
|
||||
color-primary-500: #6200ee,
|
||||
color-primary-600: #4b00cc,
|
||||
color-primary-700: #3800ab,
|
||||
color-primary-800: #27008a,
|
||||
color-primary-900: #1b0072,
|
||||
|
||||
color-primary-transparent-100: rgba(98, 0, 238, 0.08),
|
||||
color-primary-transparent-200: rgba(98, 0, 238, 0.16),
|
||||
color-primary-transparent-300: rgba(98, 0, 238, 0.24),
|
||||
color-primary-transparent-400: rgba(98, 0, 238, 0.32),
|
||||
color-primary-transparent-500: rgba(98, 0, 238, 0.4),
|
||||
color-primary-transparent-600: rgba(98, 0, 238, 0.48),
|
||||
|
||||
color-success-100: #edfbd1,
|
||||
color-success-200: #d7f7a6,
|
||||
color-success-300: #b4e775,
|
||||
color-success-400: #8fcf50,
|
||||
color-success-500: #60af20,
|
||||
color-success-600: #499617,
|
||||
color-success-700: #357d10,
|
||||
color-success-800: #24650a,
|
||||
color-success-900: #175306,
|
||||
|
||||
color-success-transparent-100: rgba(96, 175, 32, 0.08),
|
||||
color-success-transparent-200: rgba(96, 175, 32, 0.16),
|
||||
color-success-transparent-300: rgba(96, 175, 32, 0.24),
|
||||
color-success-transparent-400: rgba(96, 175, 32, 0.32),
|
||||
color-success-transparent-500: rgba(96, 175, 32, 0.4),
|
||||
color-success-transparent-600: rgba(96, 175, 32, 0.48),
|
||||
|
||||
color-info-100: #ccf7fe,
|
||||
color-info-200: #99e9fd,
|
||||
color-info-300: #66d3f9,
|
||||
color-info-400: #40bbf4,
|
||||
color-info-500: #0495ee,
|
||||
color-info-600: #0273cc,
|
||||
color-info-700: #0256ab,
|
||||
color-info-800: #013d8a,
|
||||
color-info-900: #002b72,
|
||||
|
||||
color-info-transparent-100: rgba(4, 149, 238, 0.08),
|
||||
color-info-transparent-200: rgba(4, 149, 238, 0.16),
|
||||
color-info-transparent-300: rgba(4, 149, 238, 0.24),
|
||||
color-info-transparent-400: rgba(4, 149, 238, 0.32),
|
||||
color-info-transparent-500: rgba(4, 149, 238, 0.4),
|
||||
color-info-transparent-600: rgba(4, 149, 238, 0.48),
|
||||
|
||||
color-warning-100: #fff3cd,
|
||||
color-warning-200: #ffe49b,
|
||||
color-warning-300: #ffd169,
|
||||
color-warning-400: #ffbe43,
|
||||
color-warning-500: #ff9f05,
|
||||
color-warning-600: #db8003,
|
||||
color-warning-700: #b76302,
|
||||
color-warning-800: #934a01,
|
||||
color-warning-900: #7a3800,
|
||||
|
||||
color-warning-transparent-100: rgba(255, 159, 5, 0.08),
|
||||
color-warning-transparent-200: rgba(255, 159, 5, 0.16),
|
||||
color-warning-transparent-300: rgba(255, 159, 5, 0.24),
|
||||
color-warning-transparent-400: rgba(255, 159, 5, 0.32),
|
||||
color-warning-transparent-500: rgba(255, 159, 5, 0.4),
|
||||
color-warning-transparent-600: rgba(255, 159, 5, 0.48),
|
||||
|
||||
color-danger-100: #fbd2c8,
|
||||
color-danger-200: #f79e94,
|
||||
color-danger-300: #e75d5c,
|
||||
color-danger-400: #cf3341,
|
||||
color-danger-500: #b00020,
|
||||
color-danger-600: #970029,
|
||||
color-danger-700: #7e002e,
|
||||
color-danger-800: #66002f,
|
||||
color-danger-900: #54002f,
|
||||
|
||||
color-danger-transparent-100: rgba(176, 0, 32, 0.08),
|
||||
color-danger-transparent-200: rgba(176, 0, 32, 0.16),
|
||||
color-danger-transparent-300: rgba(176, 0, 32, 0.24),
|
||||
color-danger-transparent-400: rgba(176, 0, 32, 0.32),
|
||||
color-danger-transparent-500: rgba(176, 0, 32, 0.4),
|
||||
color-danger-transparent-600: rgba(176, 0, 32, 0.48),
|
||||
|
||||
color-basic-100: #ffffff,
|
||||
color-basic-200: #f5f5f5,
|
||||
color-basic-300: #ebebeb,
|
||||
color-basic-400: #e0e0e0,
|
||||
color-basic-500: #b3b3b3,
|
||||
color-basic-600: #838383,
|
||||
color-basic-700: #636363,
|
||||
color-basic-800: #424242,
|
||||
color-basic-900: #242424,
|
||||
color-basic-1000: #1b1b1b,
|
||||
color-basic-1100: #000000,
|
||||
|
||||
color-basic-transparent-100: rgba(131, 131, 131, 0.08),
|
||||
color-basic-transparent-200: rgba(131, 131, 131, 0.16),
|
||||
color-basic-transparent-300: rgba(131, 131, 131, 0.24),
|
||||
color-basic-transparent-400: rgba(131, 131, 131, 0.32),
|
||||
color-basic-transparent-500: rgba(131, 131, 131, 0.4),
|
||||
color-basic-transparent-600: rgba(131, 131, 131, 0.48),
|
||||
|
||||
color-basic-control-transparent-100: rgba(255, 255, 255, 0.08),
|
||||
color-basic-control-transparent-200: rgba(255, 255, 255, 0.16),
|
||||
color-basic-control-transparent-300: rgba(255, 255, 255, 0.24),
|
||||
color-basic-control-transparent-400: rgba(255, 255, 255, 0.32),
|
||||
color-basic-control-transparent-500: rgba(255, 255, 255, 0.4),
|
||||
color-basic-control-transparent-600: rgba(255, 255, 255, 0.48),
|
||||
|
||||
color-basic-focus: color-basic-400,
|
||||
color-basic-hover: color-basic-200,
|
||||
color-basic-default: color-basic-300,
|
||||
color-basic-active: color-basic-400,
|
||||
color-basic-disabled: color-basic-transparent-300,
|
||||
color-basic-focus-border: color-basic-500,
|
||||
color-basic-hover-border: color-basic-hover,
|
||||
color-basic-default-border: color-basic-default,
|
||||
color-basic-active-border: color-basic-active,
|
||||
color-basic-disabled-border: color-basic-disabled,
|
||||
|
||||
color-basic-transparent-focus: color-basic-transparent-300,
|
||||
color-basic-transparent-hover: color-basic-transparent-200,
|
||||
color-basic-transparent-default: color-basic-transparent-100,
|
||||
color-basic-transparent-active: color-basic-transparent-300,
|
||||
color-basic-transparent-disabled: color-basic-transparent-200,
|
||||
color-basic-transparent-focus-border: color-basic-500,
|
||||
color-basic-transparent-hover-border: color-basic-500,
|
||||
color-basic-transparent-default-border: color-basic-500,
|
||||
color-basic-transparent-active-border: color-basic-500,
|
||||
color-basic-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
color-primary-focus: color-primary-600,
|
||||
color-primary-hover: color-primary-400,
|
||||
color-primary-default: color-primary-500,
|
||||
color-primary-active: color-primary-600,
|
||||
color-primary-disabled: color-basic-transparent-300,
|
||||
color-primary-focus-border: color-primary-700,
|
||||
color-primary-hover-border: color-primary-hover,
|
||||
color-primary-default-border: color-primary-default,
|
||||
color-primary-active-border: color-primary-active,
|
||||
color-primary-disabled-border: color-primary-disabled,
|
||||
|
||||
color-primary-transparent-focus: color-primary-transparent-300,
|
||||
color-primary-transparent-hover: color-primary-transparent-200,
|
||||
color-primary-transparent-default: color-primary-transparent-100,
|
||||
color-primary-transparent-active: color-primary-transparent-300,
|
||||
color-primary-transparent-disabled: color-basic-transparent-200,
|
||||
color-primary-transparent-focus-border: color-primary-500,
|
||||
color-primary-transparent-hover-border: color-primary-500,
|
||||
color-primary-transparent-default-border: color-primary-500,
|
||||
color-primary-transparent-active-border: color-primary-500,
|
||||
color-primary-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
color-success-focus: color-success-600,
|
||||
color-success-hover: color-success-400,
|
||||
color-success-default: color-success-500,
|
||||
color-success-active: color-success-600,
|
||||
color-success-disabled: color-basic-transparent-300,
|
||||
color-success-focus-border: color-success-700,
|
||||
color-success-hover-border: color-success-hover,
|
||||
color-success-default-border: color-success-default,
|
||||
color-success-active-border: color-success-active,
|
||||
color-success-disabled-border: color-success-disabled,
|
||||
|
||||
color-success-transparent-focus: color-success-transparent-300,
|
||||
color-success-transparent-hover: color-success-transparent-200,
|
||||
color-success-transparent-default: color-success-transparent-100,
|
||||
color-success-transparent-active: color-success-transparent-300,
|
||||
color-success-transparent-disabled: color-basic-transparent-200,
|
||||
color-success-transparent-focus-border: color-success-500,
|
||||
color-success-transparent-hover-border: color-success-500,
|
||||
color-success-transparent-default-border: color-success-500,
|
||||
color-success-transparent-active-border: color-success-500,
|
||||
color-success-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
color-info-focus: color-info-600,
|
||||
color-info-hover: color-info-400,
|
||||
color-info-default: color-info-500,
|
||||
color-info-active: color-info-600,
|
||||
color-info-disabled: color-basic-transparent-300,
|
||||
color-info-focus-border: color-info-700,
|
||||
color-info-hover-border: color-info-hover,
|
||||
color-info-default-border: color-info-default,
|
||||
color-info-active-border: color-info-active,
|
||||
color-info-disabled-border: color-info-disabled,
|
||||
|
||||
color-info-transparent-focus: color-info-transparent-300,
|
||||
color-info-transparent-hover: color-info-transparent-200,
|
||||
color-info-transparent-default: color-info-transparent-100,
|
||||
color-info-transparent-active: color-info-transparent-300,
|
||||
color-info-transparent-disabled: color-basic-transparent-200,
|
||||
color-info-transparent-focus-border: color-info-500,
|
||||
color-info-transparent-hover-border: color-info-500,
|
||||
color-info-transparent-default-border: color-info-500,
|
||||
color-info-transparent-active-border: color-info-500,
|
||||
color-info-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
color-warning-focus: color-warning-600,
|
||||
color-warning-hover: color-warning-400,
|
||||
color-warning-default: color-warning-500,
|
||||
color-warning-active: color-warning-600,
|
||||
color-warning-disabled: color-basic-transparent-300,
|
||||
color-warning-focus-border: color-warning-700,
|
||||
color-warning-hover-border: color-warning-hover,
|
||||
color-warning-default-border: color-warning-default,
|
||||
color-warning-active-border: color-warning-active,
|
||||
color-warning-disabled-border: color-warning-disabled,
|
||||
|
||||
color-warning-transparent-focus: color-warning-transparent-300,
|
||||
color-warning-transparent-hover: color-warning-transparent-200,
|
||||
color-warning-transparent-default: color-warning-transparent-100,
|
||||
color-warning-transparent-active: color-warning-transparent-300,
|
||||
color-warning-transparent-disabled: color-basic-transparent-200,
|
||||
color-warning-transparent-focus-border: color-warning-500,
|
||||
color-warning-transparent-hover-border: color-warning-500,
|
||||
color-warning-transparent-default-border: color-warning-500,
|
||||
color-warning-transparent-active-border: color-warning-500,
|
||||
color-warning-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
color-danger-focus: color-danger-600,
|
||||
color-danger-hover: color-danger-400,
|
||||
color-danger-default: color-danger-500,
|
||||
color-danger-active: color-danger-600,
|
||||
color-danger-disabled: color-basic-transparent-300,
|
||||
color-danger-focus-border: color-danger-700,
|
||||
color-danger-hover-border: color-danger-hover,
|
||||
color-danger-default-border: color-danger-default,
|
||||
color-danger-active-border: color-danger-active,
|
||||
color-danger-disabled-border: color-danger-disabled,
|
||||
|
||||
color-danger-transparent-focus: color-danger-transparent-300,
|
||||
color-danger-transparent-hover: color-danger-transparent-200,
|
||||
color-danger-transparent-default: color-danger-transparent-100,
|
||||
color-danger-transparent-active: color-danger-transparent-300,
|
||||
color-danger-transparent-disabled: color-basic-transparent-200,
|
||||
color-danger-transparent-focus-border: color-danger-500,
|
||||
color-danger-transparent-hover-border: color-danger-500,
|
||||
color-danger-transparent-default-border: color-danger-500,
|
||||
color-danger-transparent-active-border: color-danger-500,
|
||||
color-danger-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
color-control-focus: color-basic-300,
|
||||
color-control-hover: color-basic-200,
|
||||
color-control-default: color-basic-100,
|
||||
color-control-active: color-basic-300,
|
||||
color-control-disabled: color-basic-transparent-300,
|
||||
color-control-focus-border: color-basic-500,
|
||||
color-control-hover-border: color-control-hover,
|
||||
color-control-default-border: color-control-default,
|
||||
color-control-active-border: color-control-active,
|
||||
color-control-disabled-border: color-control-disabled,
|
||||
|
||||
color-control-transparent-focus: color-basic-control-transparent-300,
|
||||
color-control-transparent-hover: color-basic-control-transparent-200,
|
||||
color-control-transparent-default: color-basic-control-transparent-100,
|
||||
color-control-transparent-active: color-basic-control-transparent-300,
|
||||
color-control-transparent-disabled: color-basic-transparent-200,
|
||||
color-control-transparent-focus-border: color-basic-100,
|
||||
color-control-transparent-hover-border: color-basic-100,
|
||||
color-control-transparent-default-border: color-basic-100,
|
||||
color-control-transparent-active-border: color-basic-100,
|
||||
color-control-transparent-disabled-border: color-basic-transparent-300,
|
||||
|
||||
background-basic-color-1: color-basic-100,
|
||||
background-basic-color-2: color-basic-200,
|
||||
background-basic-color-3: color-basic-300,
|
||||
background-basic-color-4: color-basic-400,
|
||||
|
||||
background-alternative-color-1: color-basic-800,
|
||||
background-alternative-color-2: color-basic-900,
|
||||
background-alternative-color-3: color-basic-1000,
|
||||
background-alternative-color-4: color-basic-1100,
|
||||
|
||||
border-basic-color-1: color-basic-100,
|
||||
border-basic-color-2: color-basic-200,
|
||||
border-basic-color-3: color-basic-300,
|
||||
border-basic-color-4: color-basic-400,
|
||||
border-basic-color-5: color-basic-500,
|
||||
|
||||
border-alternative-color-1: color-basic-800,
|
||||
border-alternative-color-2: color-basic-900,
|
||||
border-alternative-color-3: color-basic-1000,
|
||||
border-alternative-color-4: color-basic-1100,
|
||||
border-alternative-color-5: color-basic-1100,
|
||||
|
||||
border-primary-color-1: color-primary-500,
|
||||
border-primary-color-2: color-primary-600,
|
||||
border-primary-color-3: color-primary-700,
|
||||
border-primary-color-4: color-primary-800,
|
||||
border-primary-color-5: color-primary-900,
|
||||
|
||||
border-success-color-1: color-success-500,
|
||||
border-success-color-2: color-success-600,
|
||||
border-success-color-3: color-success-700,
|
||||
border-success-color-4: color-success-800,
|
||||
border-success-color-5: color-success-900,
|
||||
|
||||
border-info-color-1: color-info-500,
|
||||
border-info-color-2: color-info-600,
|
||||
border-info-color-3: color-info-700,
|
||||
border-info-color-4: color-info-800,
|
||||
border-info-color-5: color-info-900,
|
||||
|
||||
border-warning-color-1: color-warning-500,
|
||||
border-warning-color-2: color-warning-600,
|
||||
border-warning-color-3: color-warning-700,
|
||||
border-warning-color-4: color-warning-800,
|
||||
border-warning-color-5: color-warning-900,
|
||||
|
||||
border-danger-color-1: color-danger-500,
|
||||
border-danger-color-2: color-danger-600,
|
||||
border-danger-color-3: color-danger-700,
|
||||
border-danger-color-4: color-danger-800,
|
||||
border-danger-color-5: color-danger-900,
|
||||
|
||||
text-basic-color: color-basic-800,
|
||||
text-alternate-color: color-basic-100,
|
||||
text-control-color: color-basic-100,
|
||||
text-disabled-color: color-basic-transparent-600,
|
||||
text-hint-color: color-basic-600,
|
||||
|
||||
text-primary-color: color-primary-default,
|
||||
text-primary-focus-color: color-primary-focus,
|
||||
text-primary-hover-color: color-primary-hover,
|
||||
text-primary-active-color: color-primary-active,
|
||||
text-primary-disabled-color: color-primary-400,
|
||||
|
||||
text-success-color: color-success-default,
|
||||
text-success-focus-color: color-success-focus,
|
||||
text-success-hover-color: color-success-hover,
|
||||
text-success-active-color: color-success-active,
|
||||
text-success-disabled-color: color-success-400,
|
||||
|
||||
text-info-color: color-info-default,
|
||||
text-info-focus-color: color-info-focus,
|
||||
text-info-hover-color: color-info-hover,
|
||||
text-info-active-color: color-info-active,
|
||||
text-info-disabled-color: color-info-400,
|
||||
|
||||
text-warning-color: color-warning-default,
|
||||
text-warning-focus-color: color-warning-focus,
|
||||
text-warning-hover-color: color-warning-hover,
|
||||
text-warning-active-color: color-warning-active,
|
||||
text-warning-disabled-color: color-warning-400,
|
||||
|
||||
text-danger-color: color-danger-default,
|
||||
text-danger-focus-color: color-danger-focus,
|
||||
text-danger-hover-color: color-danger-hover,
|
||||
text-danger-active-color: color-danger-active,
|
||||
text-danger-disabled-color: color-danger-400,
|
||||
|
||||
shadow: '0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2)',
|
||||
outline-color: color-basic-transparent-200,
|
||||
|
||||
font-family-primary: unquote('Roboto, sans-serif')
|
||||
);
|
||||
|
||||
$nb-themes: nb-register-theme($theme, material-light, default);
|
||||
|
|
@ -1,4 +1,51 @@
|
|||
import { NbJSThemeOptions, MATERIAL_DARK_THEME as baseTheme } from '@nebular/theme';
|
||||
import { NbJSThemeOptions } from '@nebular/theme';
|
||||
|
||||
const palette = {
|
||||
primary: '#e91d63',
|
||||
success: '#60af20',
|
||||
info: '#0495ee',
|
||||
warning: '#ff9f05',
|
||||
danger: '#b00020',
|
||||
};
|
||||
|
||||
export const baseTheme: NbJSThemeOptions = {
|
||||
name: 'material-dark',
|
||||
base: 'dark',
|
||||
variables: {
|
||||
fontMain: 'Roboto, sans-serif',
|
||||
fontSecondary: 'Roboto, sans-serif',
|
||||
|
||||
bg: '#383838',
|
||||
bg2: '#292929',
|
||||
bg3: '#1f1f1f',
|
||||
bg4: '#141414',
|
||||
|
||||
border: '#383838',
|
||||
border2: '#292929',
|
||||
border3: '#1f1f1f',
|
||||
border4: '#141414',
|
||||
border5: '#141414',
|
||||
|
||||
fg: '#808080',
|
||||
fgHeading: '#1a2138', // ?
|
||||
fgText: '#1a2138', // ?
|
||||
fgHighlight: palette.primary,
|
||||
layoutBg: '#1f1f1f',
|
||||
separator: '#1f1f1f',
|
||||
|
||||
primary: palette.primary,
|
||||
success: palette.success,
|
||||
info: palette.info,
|
||||
warning: palette.warning,
|
||||
danger: palette.danger,
|
||||
|
||||
primaryLight: '#f24681',
|
||||
successLight: '#8fcf50',
|
||||
infoLight: '#40bbf4',
|
||||
warningLight: '#ffbe43',
|
||||
dangerLight: '#cf3341',
|
||||
},
|
||||
};
|
||||
|
||||
const baseThemeVariables = baseTheme.variables;
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,51 @@
|
|||
import { NbJSThemeOptions, MATERIAL_LIGHT_THEME as baseTheme } from '@nebular/theme';
|
||||
import { NbJSThemeOptions } from '@nebular/theme';
|
||||
|
||||
const palette = {
|
||||
primary: '#6200ee',
|
||||
success: '#60af20',
|
||||
info: '#0495ee',
|
||||
warning: '#ff9f05',
|
||||
danger: '#b00020',
|
||||
};
|
||||
|
||||
export const baseTheme: NbJSThemeOptions = {
|
||||
name: 'material-light',
|
||||
base: 'default',
|
||||
variables: {
|
||||
fontMain: 'Roboto, sans-serif',
|
||||
fontSecondary: 'Roboto, sans-serif',
|
||||
|
||||
bg: '#ffffff',
|
||||
bg2: '#f5f5f5',
|
||||
bg3: '#ebebeb',
|
||||
bg4: '#e0e0e0',
|
||||
|
||||
border: '#ffffff',
|
||||
border2: '#f5f5f5',
|
||||
border3: '#ebebeb',
|
||||
border4: '#e0e0e0',
|
||||
border5: '#b3b3b3',
|
||||
|
||||
fg: '#838383',
|
||||
fgHeading: '#1a2138', // ?
|
||||
fgText: '#1a2138', // ?
|
||||
fgHighlight: palette.primary,
|
||||
layoutBg: '#ebebeb',
|
||||
separator: '#ebebeb',
|
||||
|
||||
primary: palette.primary,
|
||||
success: palette.success,
|
||||
info: palette.info,
|
||||
warning: palette.warning,
|
||||
danger: palette.danger,
|
||||
|
||||
primaryLight: '#903df4',
|
||||
successLight: '#8fcf50',
|
||||
infoLight: '#40bbf4',
|
||||
warningLight: '#ffbe43',
|
||||
dangerLight: '#cf3341',
|
||||
},
|
||||
};
|
||||
|
||||
const baseThemeVariables = baseTheme.variables;
|
||||
|
||||
|
|
|
|||
|
|
@ -2,6 +2,9 @@
|
|||
@import '~@nebular/theme/styles/theming';
|
||||
// @nebular out of the box themes
|
||||
@import '~@nebular/theme/styles/themes';
|
||||
// material themes
|
||||
@import './material-dark';
|
||||
@import './material-light';
|
||||
|
||||
$nb-themes: nb-register-theme((
|
||||
layout-padding-top: 2.25rem,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue