blob: 48cc1485cc4a82650db2cd61b2cd50a647e4473e (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
|
@import './config.scss';
$sidebar-width: 75px;
$sidebar-bias: 28px;
$tabitem-bias: 30px;
.sidebar {
width: 100vw;
height: $sidebar-width;
flex-direction: row;
position: absolute;
top: 0;
right: 0;
padding-bottom: 0px;
overflow: hidden !important;
&::after {
top: -10px;
right: -10px;
bottom: 0;
left: -10px;
clip-path: inset(10px 10px 0 10px);
}
>div:first-of-type {
overflow-x: scroll!important;
width: 100%;
}
.tabs {
flex-direction: row;
.tab-item {
&.is-active {
border-left-width: 0px !important;
border-top-width: 4px;
border-top-style: solid;
overflow: hidden;
height: $sidebar-width + 4;
}
&:not(.is-active) {
padding-top: 4px;
}
&.is-label-enabled{
min-width: 70px;
max-width: 140px;
height: $sidebar-width + 10;
width: max-content !important;
overflow: hidden;
padding-left: 4px;
padding-right: 4px;
padding-top: 8px;
}
}
}
div{
overflow: hidden !important;
}
.sidebar__button--workspaces.is-active {
position: absolute;
right: 300px;
height: 100%;
background-color: #f7f7f9;
}
}
.app .app__content {
padding-top: $sidebar-width + $sidebar-bias;
}
.workspaces-drawer {
margin-top: -$sidebar-width;
height: 100vh;
position: relative;
&::after {
content: ' ';
position: absolute;
top: -10px;
right: 0;
bottom: -10px;
left: -10px;
z-index: 1000;
pointer-events: none;
clip-path: inset(10px 0 10px 10px);
box-shadow: inset 0 0 15px 0 rgba(0, 0, 0, .12),
inset 0 0 2px 0 rgba(0, 0, 0, 0.36);
}
}
.theme__dark {
.sidebar .sidebar__button--workspaces.is-active {
background-color: #2d2f31;
}
.workspaces-drawer::after {
box-shadow: inset 0 0 10px 0 $dark-theme-black,
inset 0 0 2px 0 rgba(0, 0, 0, 0.4);
}
}
.darwin .sidebar {
height: $sidebar-width + $sidebar-bias;
.sidebar__button--workspaces.is-active {
height: $sidebar-width - $sidebar-bias;
}
.tab-item .is-label-enabled{
height: $sidebar-width + $tabitem-bias;
}
}
|