[themes] added new theme
This commit is contained in:
parent
4d5880486d
commit
0cec65caae
|
@ -15,6 +15,7 @@ define([
|
|||
|
||||
var themes_map = {
|
||||
'theme-light': 'light',
|
||||
'theme-classic-light': 'light',
|
||||
'theme-dark': 'dark'
|
||||
}
|
||||
|
||||
|
@ -128,6 +129,7 @@ define([
|
|||
|
||||
return {
|
||||
THEME_LIGHT_ID: 'theme-light',
|
||||
THEME_CLASSIC_LIGHT_ID: 'theme-classic-light',
|
||||
THEME_DARK_ID: 'theme-dark',
|
||||
|
||||
init: function (api) {
|
||||
|
|
|
@ -77,6 +77,8 @@
|
|||
&.active:not(.disabled){
|
||||
.caret {
|
||||
transform: rotate(45deg);
|
||||
border-color: @icon-normal-pressed-ie;
|
||||
border-color: @icon-normal-pressed;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
121
apps/common/main/resources/less/colors-table-classic.less
Normal file
121
apps/common/main/resources/less/colors-table-classic.less
Normal file
|
@ -0,0 +1,121 @@
|
|||
|
||||
:root {
|
||||
.theme-classic-light {
|
||||
--toolbar-header-document: #446995;
|
||||
--toolbar-header-spreadsheet: #40865c;
|
||||
--toolbar-header-presentation: #aa5252;
|
||||
|
||||
--background-normal: #fff;
|
||||
--background-toolbar: #f1f1f1;
|
||||
--background-toolbar-additional: #f1f1f1;
|
||||
--background-primary-dialog-button: #7d858c;
|
||||
--background-tab-underline: #444;
|
||||
--background-notification-popover: #fcfed7;
|
||||
--background-notification-badge: #ffd112;
|
||||
--background-scrim: fade(#000, 20%);
|
||||
--background-loader: fade(#000, 65%);
|
||||
|
||||
--highlight-button-hover: #d8dadc;
|
||||
--highlight-button-pressed: #7d858c;
|
||||
--highlight-button-pressed-hover: #7d858c;
|
||||
--highlight-primary-dialog-button-hover: #666d73;
|
||||
--highlight-header-button-hover: fade(#fff, 20%);
|
||||
--highlight-header-button-pressed: fade(#000, 20%);
|
||||
--highlight-toolbar-tab-underline: #444;
|
||||
--highlight-text-select: #3494fb;
|
||||
|
||||
--border-toolbar: #cbcbcb;
|
||||
--border-divider: #cbcbcb;
|
||||
--border-regular-control: #cfcfcf;
|
||||
--border-toolbar-button-hover: #d8dadc;
|
||||
--border-preview-hover: #cfcfcf;
|
||||
--border-preview-select: #848484;
|
||||
--border-control-focus: #848484;
|
||||
--border-color-shading: fade(#000, 20%);
|
||||
--border-error: #d9534f;
|
||||
|
||||
--text-normal: #444;
|
||||
--text-normal-pressed: #444;
|
||||
--text-secondary: #a5a5a5;
|
||||
--text-tertiary: #a5a5a5;
|
||||
--text-link: #acbfff;
|
||||
--text-inverse: #333;
|
||||
--text-toolbar-header: fade(#fff, 80%);
|
||||
--text-contrast-background: #fff;
|
||||
|
||||
--icon-normal: #444;
|
||||
--icon-normal-pressed: #fff;
|
||||
--icon-inverse: #444;
|
||||
--icon-toolbar-header: fade(#fff, 80%);
|
||||
--icon-notification-badge: #000;
|
||||
--icon-contrast-popover: #fff;
|
||||
--icon-success: #5b9f27;
|
||||
|
||||
// Canvas colors
|
||||
--canvas-background: #666666;
|
||||
--canvas-content-background: #fff;
|
||||
--canvas-page-border: #555;
|
||||
|
||||
--canvas-ruler-background: #555;
|
||||
--canvas-ruler-margins-background: #444;
|
||||
--canvas-ruler-mark: #b2b2b2;
|
||||
--canvas-ruler-handle-border: #b2b2b2;
|
||||
--canvas-ruler-handle-border-disabled: #717171;
|
||||
|
||||
--canvas-high-contrast: #fff;
|
||||
--canvas-high-contrast-disabled: #888;
|
||||
|
||||
--canvas-cell-border: fade(#000, 10%);
|
||||
--canvas-cell-title-border: #757575;
|
||||
--canvas-cell-title-border-hover: #858585;
|
||||
--canvas-cell-title-border-selected: #9e9e9e;
|
||||
--canvas-cell-title-hover: #787878;
|
||||
--canvas-cell-title-selected: #939393;
|
||||
|
||||
--canvas-dark-cell-title: #111;
|
||||
--canvas-dark-cell-title-hover: #000;
|
||||
--canvas-dark-cell-title-selected: #333;
|
||||
--canvas-dark-cell-title-border: #282828;
|
||||
--canvas-dark-cell-title-border-hover: #191919;
|
||||
--canvas-dark-cell-title-border-selected: #474747;
|
||||
|
||||
--canvas-scroll-thumb: #404040;
|
||||
--canvas-scroll-thumb-hover: #999;
|
||||
--canvas-scroll-thumb-pressed: #adadad;
|
||||
--canvas-scroll-thumb-border: #2a2a2a;
|
||||
--canvas-scroll-thumb-border-hover: #2a2a2a;
|
||||
--canvas-scroll-thumb-border-pressed: #2a2a2a;
|
||||
--canvas-scroll-arrow: #999;
|
||||
--canvas-scroll-arrow-hover: #404040;
|
||||
--canvas-scroll-arrow-pressed: #404040;
|
||||
--canvas-scroll-thumb-target: #999;
|
||||
--canvas-scroll-thumb-target-hover: #404040;
|
||||
--canvas-scroll-thumb-target-pressed: #404040;
|
||||
|
||||
// Others
|
||||
|
||||
--button-small-normal-icon-offset-x: 0;
|
||||
--button-small-active-icon-offset-x: -20px;
|
||||
--button-large-normal-icon-offset-x: 0;
|
||||
--button-large-active-icon-offset-x: -31px;
|
||||
--button-huge-normal-icon-offset-x: 0;
|
||||
--button-huge-active-icon-offset-x: -40px;
|
||||
--button-xhuge-normal-icon-offset-x: 0;
|
||||
--button-xhuge-active-icon-offset-x: -28px;
|
||||
//--button-xhuge-normal-icon-offset-x: -37px;
|
||||
//--button-xhuge-active-icon-offset-x: -37px;
|
||||
|
||||
--modal-window-mask-opacity: 0.6;
|
||||
--image-border-types-filter: invert(100%) brightness(4);
|
||||
--image-border-types-filter-selected: invert(100%) brightness(4);
|
||||
--component-normal-icon-filter: invert(100%);
|
||||
|
||||
--component-normal-icon-opacity: .8;
|
||||
--component-hover-icon-opacity: .8;
|
||||
--component-active-icon-opacity: .8;
|
||||
--component-active-hover-icon-opacity: .8;
|
||||
--component-disabled-opacity: .3;
|
||||
|
||||
--menu-icon-item-checked-offset-x: -20px;
|
||||
}
|
||||
}
|
|
@ -466,6 +466,7 @@ define([
|
|||
cls : 'input-group-nr',
|
||||
data : [
|
||||
{ value: Common.UI.Themes.THEME_LIGHT_ID, displayValue: this.txtThemeLight },
|
||||
{ value: Common.UI.Themes.THEME_CLASSIC_LIGHT_ID, displayValue: "Classic light" },
|
||||
{ value: Common.UI.Themes.THEME_DARK_ID, displayValue: this.txtThemeDark }
|
||||
]
|
||||
});
|
||||
|
|
|
@ -10,6 +10,7 @@
|
|||
// Bootstrap overwrite
|
||||
@import "../../../../common/main/resources/less/variables.less";
|
||||
@import "../../../../common/main/resources/less/colors-table.less";
|
||||
@import "../../../../common/main/resources/less/colors-table-classic.less";
|
||||
@import "../../../../common/main/resources/less/colors-table-dark.less";
|
||||
|
||||
//
|
||||
|
|
Loading…
Reference in a new issue