1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
lens/src/renderer/components/cluster-manager/clusters-menu.scss
Alex Andreev 0f11b03692
Switching color theme globally (#728)
* Adding cluster menu colors

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Adding theme class name flag into #app

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Cleaning up mixins

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Tuning up Wizard Layout styles

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Using theme-light global flag

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Minor style fixes

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Using .theme-light flag across components

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Set theme as @computed value

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Preventing Drawer slide-in scroll flickering

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Setting background for settings views

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Minor layout fixes

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Switching AceEditor theme reactively

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Cleaning up

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
2020-08-24 10:24:05 +03:00

85 lines
1.6 KiB
SCSS

.ClustersMenu {
@include hidden-scrollbar;
$spacing: $padding * 2;
position: relative;
text-align: center;
padding: $spacing;
background: $clusterMenuBackground;
border-right: 1px solid $clusterMenuBorderColor;
.is-mac & {
padding-top: $spacing * 2;
}
> .startup-tooltip {
$bgc: $mainBackground;
$arrowSize: 10px;
position: absolute;
top: 20px;
left: 100%;
margin: $padding;
padding: $spacing;
width: 320px;
background: $bgc;
z-index: 100;
color: white;
filter: drop-shadow(0 0px 2px #ffffff33);
pointer-events: none;
&:before {
content: "";
position: absolute;
width: 0;
height: 0;
border-top: $arrowSize solid transparent;
border-bottom: $arrowSize solid transparent;
border-right: $arrowSize solid $bgc;
right: 100%;
}
}
> .add-cluster {
position: relative;
margin-top: $padding;
min-width: 43px;
.Icon {
border-radius: $radius;
padding: $padding / 3;
color: $addClusterIconColor;
background: #ffffff66;
cursor: pointer;
&.active {
opacity: 1;
}
&:hover {
box-shadow: none;
background: #ffffff;
}
}
.Badge {
$boxSize: 17px;
$offset: -7px;
position: absolute;
font-size: $font-size-small;
right: $offset;
bottom: $offset;
line-height: $boxSize;
min-width: $boxSize;
min-height: $boxSize;
text-align: center;
color: white;
background: $colorSuccess;
font-weight: normal;
border-radius: $radius;
padding: 0;
pointer-events: none;
}
}
}