[DE forms] Refactoring form theme colors

This commit is contained in:
Julia Radzhabova 2021-09-24 17:21:05 +03:00
parent 9fbce74da0
commit a957d80cf6
6 changed files with 21 additions and 14 deletions

View file

@ -83,9 +83,6 @@
@toolbarTopColor: @background-toolbar-ie;
@toolbarTopColor: @background-toolbar;
@toolbarFontSize: 12px;
@btnColored: #446995;
@btnActiveColored: #293F59;
@btnHoverColored: #375478;
@iconSpriteCommonPath: "../../../../common/forms/resources/img/glyphicons.png";
@icon-socnet-size: 40px;
@ -228,20 +225,20 @@
&.colored {
padding: 0 16px;
height: 28px;
background-color: @btnColored;
background-color: @background-accent-button;
border: 1px solid transparent;
border-radius: 3px;
color: #ffffff;
color: @text-contrast-background !important;
font-weight: 700;
&:hover:not(.disabled),
.over:not(.disabled) {
background-color: @btnHoverColored !important;
background-color: @highlight-accent-button-hover !important;
}
&:active:not(.disabled),
&.active:not(.disabled) {
background-color: @btnActiveColored !important;;
background-color: @highlight-accent-button-pressed !important;
}
}
}
@ -583,22 +580,22 @@
}
.asc-synchronizetip {
background-color: @btnColored;
color: @text-toolbar-header;
background-color: @background-contrast-popover;
color: @text-contrast-background;
.close {
&:before, &:after {
background-color: @text-toolbar-header;
background-color: @text-contrast-background;
}
}
}
.tip-arrow:after {
background-color: @btnColored;
background-color: @background-contrast-popover;
}
.btn-div {
display: inline-block;
border: 1px solid #fff;
border: 1px solid @border-regular-control;
border-radius: 2px;
padding: 3px 12px;
margin-top: 10px;

View file

@ -14,6 +14,7 @@
--background-notification-badge: #ffd112;
--background-scrim: fade(#000, 20%);
--background-loader: fade(#000, 65%);
--background-contrast-popover: #444444;
--highlight-button-hover: #d8dadc;
--highlight-button-pressed: #7d858c;

View file

@ -15,6 +15,7 @@
--background-scrim: fade(black, 60%);
--background-loader: fade(#181818, 90%);
--background-alt-key-hint: #FFD938;
--background-contrast-popover: #363636;
--highlight-button-hover: #555;
--highlight-button-pressed: #707070;

View file

@ -25,6 +25,8 @@
--background-scrim: fade(#000, 20%);
--background-loader: fade(#181818, 90%);
--background-alt-key-hint: #FFD938;
--background-accent-button: #446995;
--background-contrast-popover: #444444;
--highlight-button-hover: #e0e0e0;
--highlight-button-pressed: #cbcbcb;
@ -34,6 +36,8 @@
--highlight-header-button-pressed: fade(#fff, 25%);
--highlight-toolbar-tab-underline: #444;
--highlight-text-select: #3494fb;
--highlight-accent-button-hover: #375478;
--highlight-accent-button-pressed: #293F59;
--border-toolbar: #cbcbcb;
--border-divider: #dfdfdf;
@ -154,6 +158,8 @@
@background-scrim: var(--background-scrim);
@background-loader: var(--background-loader);
@background-alt-key-hint: var(--background-alt-key-hint);
@background-accent-button: var(--background-accent-button);
@background-contrast-popover: var(--background-contrast-popover);
// Highlight
// -------------------------
@ -165,6 +171,8 @@
@highlight-header-button-pressed: var(--highlight-header-button-pressed);
@highlight-toolbar-tab-underline: var(--highlight-toolbar-tab-underline);
@highlight-text-select: var(--highlight-text-select);
@highlight-accent-button-hover: var(--highlight-accent-button-hover);
@highlight-accent-button-pressed: var(--highlight-accent-button-pressed);
// Border
// -------------------------

View file

@ -115,7 +115,7 @@
<script src="../../common/main/lib/util/themeinit.js"></script>
</head>
<body class="embed-body theme-classic-light theme-type-light">
<body class="embed-body">
<script src="../../common/main/lib/util/htmlutils.js"></script>
<div id="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="brand-logo loading-logo"><img src=""></div><div class="doc-title"></div><div class="circle"></div></div></div><div class="placeholder"><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div></div></div>

View file

@ -112,7 +112,7 @@
<![endif]-->
</head>
<body class="embed-body theme-classic-light theme-type-light">
<body class="embed-body">
<script src="../../../../../apps/common/main/lib/util/htmlutils.js?__inline=true"></script>
<div id="loading-mask" class="loadmask"><div class="brendpanel"><div><div class="brand-logo loading-logo"><img src=""></div><div class="doc-title"></div><div class="circle"></div></div></div><div class="placeholder"><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div><div class="line"></div></div></div>