1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-24 20:36:40 +07:00
vault-frontend/src/components/main/SidePane/styles.scss
2019-07-27 07:08:22 +07:00

71 lines
1.4 KiB
SCSS

.pane {
width: 54px;
height: 100%;
position: fixed;
top: 0;
left: 0;
box-sizing: border-box;
padding: $gap 0;
display: flex;
flex-direction: column;
}
.group {
width: 54px;
border-radius: $panel_radius;
background: $panel_bg;
box-sizing: border-box;
&:global(.logo) {
height: (54px * 1.5) + $gap / 2;
background: white;
background-size: 140px;
font-weight: 600;
font-size: 14px;
text-align: center;
box-shadow: inset #111111 0 -1px, inset #222222 0 1px;
color: black;
display: flex;
align-items: center;
justify-content: center;
font: $font_24_semibold;
}
.btn {
border-radius: 0;
&:first-child {
border-top-left-radius: $panel_radius;
border-top-right-radius: $panel_radius;
}
&:last-child {
border-bottom-left-radius: $panel_radius;
border-bottom-right-radius: $panel_radius;
}
}
}
.btn {
height: 54px;
box-shadow: inset transparentize(black, 0.9) 0 -1px, inset transparentize(white, 0.95) 0 1px;
border-radius: $panel_radius;
background: #191919;
display: flex;
align-items: center;
justify-content: center;
font: $font_24_medium;
&:global(.orange) {
background: linear-gradient(280deg, $red, $orange);
color: transparentize(black, 0.7);
width: 66px;
border-radius: 6px 0 0 6px;
position: relative;
left: 0;
}
}
.flexy {
flex: 1;
}