Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[common] added opacity in stylesheets for button

Browse source
This commit is contained in:
Maxim Kadushkin 2021-03-19 12:06:35 +03:00
parent f63232b2e2
commit ffe8a062e1
3 changed files with 16 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
apps/common/main/resources/less/buttons.less
View file

@ -7,6 +7,7 @@
color: @text-normal; color: @text-normal;
border-width: @scaled-one-px-value-ie; border-width: @scaled-one-px-value-ie;
border-width: @scaled-one-px-value; border-width: @scaled-one-px-value;
opacity: @component-normal-opacity;
.btnsize(@value) { .btnsize(@value) {
min-width: @value; min-width: @value;
@ -52,11 +53,15 @@
&:hover { &:hover {
color: @text-normal-ie; color: @text-normal-ie;
color: @text-normal; color: @text-normal;
opacity: @component-hover-opacity;
} }
&:active, &.active { &:active, &.active {
-webkit-box-shadow: none; -webkit-box-shadow: none;
box-shadow: none; box-shadow: none;
opacity: @component-active-opacity;
} }
.caret { .caret {

4
apps/common/main/resources/less/colors-table-dark.less
View file

@ -109,6 +109,10 @@
--image-border-types-filter: invert(100%) brightness(4); --image-border-types-filter: invert(100%) brightness(4);
--image-border-types-filter-selected: invert(100%) brightness(4); --image-border-types-filter-selected: invert(100%) brightness(4);
--component-normal-icon-filter: invert(100%); --component-normal-icon-filter: invert(100%);
--component-normal-opacity: .8;
--component-hover-opacity: .8;
--component-active-opacity: .8;
--component-disabled-opacity: .3; --component-disabled-opacity: .3;
--button-icon-opacity: .8; --button-icon-opacity: .8;

7
apps/common/main/resources/less/colors-table.less
View file

@ -121,6 +121,10 @@
--image-border-types-filter: none; --image-border-types-filter: none;
--image-border-types-filter-selected: none; --image-border-types-filter-selected: none;
--component-normal-icon-filter: none; --component-normal-icon-filter: none;
--component-normal-opacity: .8;
--component-hover-opacity: .8;
--component-active-opacity: .8;
--component-disabled-opacity: .4; --component-disabled-opacity: .4;
//--button-icon-opacity: 1; //--button-icon-opacity: 1;
} }
@ -195,6 +199,9 @@
@button-header-active-icon-offset-x: var(--button-header-active-icon-offset-x, -20px); @button-header-active-icon-offset-x: var(--button-header-active-icon-offset-x, -20px);
@component-normal-icon-filter: var(--component-normal-icon-filter); @component-normal-icon-filter: var(--component-normal-icon-filter);
@component-normal-opacity: var(--component-normal-opacity, .8);
@component-hover-opacity: var(--component-hover-opacity, .8);
@component-active-opacity: var(--component-active-opacity, .8);
@component-disabled-opacity: var(--component-disabled-opacity, .4); @component-disabled-opacity: var(--component-disabled-opacity, .4);
@button-icon-opacity: var(--button-icon-opacity, 1); @button-icon-opacity: var(--button-icon-opacity, 1);