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

two themes

Browse source
This commit is contained in:
OVSharova 2022-05-19 11:09:26 +03:00
parent e63ec8ab8a
commit 73e3df8c1b
1 changed files with 127 additions and 63 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

112
apps/common/main/resources/less/scroller.less
View file

@ -153,18 +153,7 @@
}
}
textarea,.brouse-scroll {
@background-svg-fill: #999;
@background-svg-fill-hover: #404040;
overflow-y: auto;
scrollbar-color: @background-toolbar @canvas-background; //mozila
/*explorer*/
scrollbar-track-color: @canvas-background;
scrollbar-face-color: @background-toolbar-ie;
scrollbar-arrow-color: @canvas-scroll-thumb-hover-ie;
scrollbar-base-color: @border-toolbar-ie;
/*------------------------------------*/
.inline-svg-code( @code ) {
@-svg-code: escape(~'<?xml version="1.0" ?>@{code}');
@ -196,6 +185,19 @@ textarea,.brouse-scroll {
background-image: @-inline-svg-url;
}
textarea,.brouse-scroll {
@background-svg-fill: #adadad;
@background-svg-fill-hover: #f7f7f7;
overflow: auto;
scrollbar-color: @background-toolbar @canvas-background; //mozila
/*explorer*/
scrollbar-track-color: @canvas-background;
scrollbar-face-color: @background-toolbar-ie;
scrollbar-arrow-color: @canvas-scroll-thumb-hover-ie;
scrollbar-base-color: @border-toolbar-ie;
/*------------------------------------*/
cursor: auto;
&::-webkit-scrollbar {
@ -217,25 +219,17 @@ textarea,.brouse-scroll {
box-shadow: inset 0px 0px 0px 1px @border-toolbar;
border-right: @scaled-one-px-value solid @canvas-background;
-webkit-border-radius: 0.2ex;
background-position: center;
background-repeat: no-repeat;
background-color: @background-toolbar;
-o-transition: background-color .2s linear;
-webkit-transition: background-color .2s linear;
-moz-transition: background-color .2s linear;
transition: background-color .2s linear;
background-position: center;
background-repeat: no-repeat;
&:hover {
background-color: @canvas-scroll-thumb-hover;
box-shadow: inset 0px 0px 0px 1px @canvas-scroll-thumb-border-hover;
}
&:active {
background-color: var(--canvas-scroll-thumb-pressed);
//box-shadow: inset 0px 0px 0px 1px @canvas-scroll-thumb-border-hover;
}
}
&::-webkit-scrollbar-thumb {
@ -245,27 +239,93 @@ textarea,.brouse-scroll {
.img-scroll-y(@background-svg-fill-hover, 5);
}
}
&:horizontal {
.img-scroll-x(@background-svg-fill,5);
&:hover {
.img-scroll-x(@background-svg-fill-hover, 5);
}
}
}
&::-webkit-scrollbar-button {
height: 14px;
width: 14px;
border: @scaled-one-px-value solid @canvas-background;
border-width: 1px 1px 1px 0;
&:vertical:decrement {
&:vertical {
border-left-width: 0;
height: 15px;
&:decrement {
.arrow-top(@background-svg-fill);
&:hover {
.arrow-top(@background-svg-fill-hover);
}
}
&:vertical:increment {
&:increment {
.arrow-down(@background-svg-fill);
&:hover {
.arrow-down(@background-svg-fill-hover);
}
}
&:horizontal:decrement{
}
&:horizontal {
border-top-width: 0;
width: 15px;
&:decrement {
.arrow-left(@background-svg-fill);
&:hover {
.arrow-left(@background-svg-fill-hover);
}
}
&:increment {
.arrow-right(@background-svg-fill);
&:hover {
.arrow-right(@background-svg-fill-hover);
}
}
}
}
}
.theme-dark{
textarea,.brouse-scroll
{
@background-svg-fill: #999;
@background-svg-fill-hover: #404040;
&::-webkit-scrollbar-thumb {
&:vertical {
.img-scroll-y(@background-svg-fill,5);
&:hover {
.img-scroll-y(@background-svg-fill-hover, 5);
}
}
&:horizontal {
.img-scroll-x(@background-svg-fill,5);
&:hover {
.img-scroll-x(@background-svg-fill-hover, 5);
}
}
}
&::-webkit-scrollbar-button {
&:vertical {
&:decrement {
.arrow-top(@background-svg-fill);
&:hover {
.arrow-top(@background-svg-fill-hover);
}
}
&:increment {
.arrow-down(@background-svg-fill);
&:hover {
.arrow-down(@background-svg-fill-hover);
}
}
}
&:horizontal {
&:decrement {
.arrow-left(@background-svg-fill);
&:hover {
.arrow-left(@background-svg-fill-hover);
@ -273,10 +333,14 @@ textarea,.brouse-scroll {
}
&:horizontal:increment {
.arrow-right(@background-svg-fill);
&:hover {
.arrow-right(@background-svg-fill-hover);
}
}
}
}
}
}