@kushagradhawan/kookie-ui 0.1.15 → 0.1.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components.css +1321 -131
- package/dist/cjs/components/dropdown-menu.js +1 -1
- package/dist/cjs/components/dropdown-menu.js.map +2 -2
- package/dist/cjs/components/icons.d.ts +2 -1
- package/dist/cjs/components/icons.d.ts.map +1 -1
- package/dist/cjs/components/icons.js +1 -1
- package/dist/cjs/components/icons.js.map +3 -3
- package/dist/cjs/components/image.d.ts +4 -0
- package/dist/cjs/components/image.d.ts.map +1 -1
- package/dist/cjs/components/image.js +1 -1
- package/dist/cjs/components/image.js.map +3 -3
- package/dist/cjs/components/sidebar.d.ts +117 -42
- package/dist/cjs/components/sidebar.d.ts.map +1 -1
- package/dist/cjs/components/sidebar.js +1 -1
- package/dist/cjs/components/sidebar.js.map +3 -3
- package/dist/cjs/components/sidebar.props.d.ts +17 -10
- package/dist/cjs/components/sidebar.props.d.ts.map +1 -1
- package/dist/cjs/components/sidebar.props.js +1 -1
- package/dist/cjs/components/sidebar.props.js.map +3 -3
- package/dist/esm/components/dropdown-menu.js +1 -1
- package/dist/esm/components/dropdown-menu.js.map +3 -3
- package/dist/esm/components/icons.d.ts +2 -1
- package/dist/esm/components/icons.d.ts.map +1 -1
- package/dist/esm/components/icons.js +1 -1
- package/dist/esm/components/icons.js.map +3 -3
- package/dist/esm/components/image.d.ts +4 -0
- package/dist/esm/components/image.d.ts.map +1 -1
- package/dist/esm/components/image.js +1 -1
- package/dist/esm/components/image.js.map +3 -3
- package/dist/esm/components/sidebar.d.ts +117 -42
- package/dist/esm/components/sidebar.d.ts.map +1 -1
- package/dist/esm/components/sidebar.js +1 -1
- package/dist/esm/components/sidebar.js.map +3 -3
- package/dist/esm/components/sidebar.props.d.ts +17 -10
- package/dist/esm/components/sidebar.props.d.ts.map +1 -1
- package/dist/esm/components/sidebar.props.js +1 -1
- package/dist/esm/components/sidebar.props.js.map +3 -3
- package/package.json +1 -1
- package/src/components/_internal/base-button.css +2 -9
- package/src/components/_internal/base-menu.css +2 -2
- package/src/components/button.css +2 -2
- package/src/components/dropdown-menu.tsx +2 -2
- package/src/components/icon-button.css +2 -2
- package/src/components/icons.tsx +18 -1
- package/src/components/image.tsx +48 -9
- package/src/components/sidebar.css +850 -54
- package/src/components/sidebar.props.tsx +15 -11
- package/src/components/sidebar.tsx +500 -367
- package/styles.css +1321 -131
package/styles.css
CHANGED
|
@@ -6595,16 +6595,10 @@
|
|
|
6595
6595
|
position: relative;
|
|
6596
6596
|
cursor: wait;
|
|
6597
6597
|
}
|
|
6598
|
-
.rt-BaseButton:where(:active:not([data-disabled], [data-state='open'])) {
|
|
6599
|
-
transform: scale(0.98);
|
|
6600
|
-
}
|
|
6601
6598
|
@media (prefers-reduced-motion: reduce) {
|
|
6602
6599
|
.rt-BaseButton {
|
|
6603
6600
|
transition: none;
|
|
6604
6601
|
}
|
|
6605
|
-
.rt-BaseButton:where(:active:not([data-disabled], [data-state='open'])) {
|
|
6606
|
-
transform: none;
|
|
6607
|
-
}
|
|
6608
6602
|
}
|
|
6609
6603
|
.rt-BaseButton:where(.rt-full-width) {
|
|
6610
6604
|
display: flex;
|
|
@@ -7074,8 +7068,8 @@
|
|
|
7074
7068
|
letter-spacing: var(--letter-spacing-1);
|
|
7075
7069
|
}
|
|
7076
7070
|
.rt-Button:where(.rt-r-size-1) :where(svg) {
|
|
7077
|
-
width: var(--space-
|
|
7078
|
-
height: var(--space-
|
|
7071
|
+
width: calc(var(--space-3) * 1.175);
|
|
7072
|
+
height: calc(var(--space-3) * 1.175);
|
|
7079
7073
|
}
|
|
7080
7074
|
.rt-Button:where(.rt-r-size-1):where(:not(.rt-variant-ghost)) {
|
|
7081
7075
|
padding-left: var(--space-2);
|
|
@@ -7151,8 +7145,8 @@
|
|
|
7151
7145
|
letter-spacing: var(--letter-spacing-1);
|
|
7152
7146
|
}
|
|
7153
7147
|
.rt-Button:where(.xs\:rt-r-size-1) :where(svg) {
|
|
7154
|
-
width: var(--space-
|
|
7155
|
-
height: var(--space-
|
|
7148
|
+
width: calc(var(--space-3) * 1.175);
|
|
7149
|
+
height: calc(var(--space-3) * 1.175);
|
|
7156
7150
|
}
|
|
7157
7151
|
.rt-Button:where(.xs\:rt-r-size-1):where(:not(.rt-variant-ghost)) {
|
|
7158
7152
|
padding-left: var(--space-2);
|
|
@@ -7229,8 +7223,8 @@
|
|
|
7229
7223
|
letter-spacing: var(--letter-spacing-1);
|
|
7230
7224
|
}
|
|
7231
7225
|
.rt-Button:where(.sm\:rt-r-size-1) :where(svg) {
|
|
7232
|
-
width: var(--space-
|
|
7233
|
-
height: var(--space-
|
|
7226
|
+
width: calc(var(--space-3) * 1.175);
|
|
7227
|
+
height: calc(var(--space-3) * 1.175);
|
|
7234
7228
|
}
|
|
7235
7229
|
.rt-Button:where(.sm\:rt-r-size-1):where(:not(.rt-variant-ghost)) {
|
|
7236
7230
|
padding-left: var(--space-2);
|
|
@@ -7307,8 +7301,8 @@
|
|
|
7307
7301
|
letter-spacing: var(--letter-spacing-1);
|
|
7308
7302
|
}
|
|
7309
7303
|
.rt-Button:where(.md\:rt-r-size-1) :where(svg) {
|
|
7310
|
-
width: var(--space-
|
|
7311
|
-
height: var(--space-
|
|
7304
|
+
width: calc(var(--space-3) * 1.175);
|
|
7305
|
+
height: calc(var(--space-3) * 1.175);
|
|
7312
7306
|
}
|
|
7313
7307
|
.rt-Button:where(.md\:rt-r-size-1):where(:not(.rt-variant-ghost)) {
|
|
7314
7308
|
padding-left: var(--space-2);
|
|
@@ -7385,8 +7379,8 @@
|
|
|
7385
7379
|
letter-spacing: var(--letter-spacing-1);
|
|
7386
7380
|
}
|
|
7387
7381
|
.rt-Button:where(.lg\:rt-r-size-1) :where(svg) {
|
|
7388
|
-
width: var(--space-
|
|
7389
|
-
height: var(--space-
|
|
7382
|
+
width: calc(var(--space-3) * 1.175);
|
|
7383
|
+
height: calc(var(--space-3) * 1.175);
|
|
7390
7384
|
}
|
|
7391
7385
|
.rt-Button:where(.lg\:rt-r-size-1):where(:not(.rt-variant-ghost)) {
|
|
7392
7386
|
padding-left: var(--space-2);
|
|
@@ -7463,8 +7457,8 @@
|
|
|
7463
7457
|
letter-spacing: var(--letter-spacing-1);
|
|
7464
7458
|
}
|
|
7465
7459
|
.rt-Button:where(.xl\:rt-r-size-1) :where(svg) {
|
|
7466
|
-
width: var(--space-
|
|
7467
|
-
height: var(--space-
|
|
7460
|
+
width: calc(var(--space-3) * 1.175);
|
|
7461
|
+
height: calc(var(--space-3) * 1.175);
|
|
7468
7462
|
}
|
|
7469
7463
|
.rt-Button:where(.xl\:rt-r-size-1):where(:not(.rt-variant-ghost)) {
|
|
7470
7464
|
padding-left: var(--space-2);
|
|
@@ -8992,8 +8986,8 @@
|
|
|
8992
8986
|
border-radius: var(--radius-1);
|
|
8993
8987
|
}
|
|
8994
8988
|
.rt-BaseMenuContent:where(.rt-r-size-1) :where(.rt-BaseMenuItem) :where(svg) {
|
|
8995
|
-
width: var(--space-
|
|
8996
|
-
height: var(--space-
|
|
8989
|
+
width: calc(var(--space-3) * 1.175);
|
|
8990
|
+
height: calc(var(--space-3) * 1.175);
|
|
8997
8991
|
flex-shrink: 0;
|
|
8998
8992
|
}
|
|
8999
8993
|
.rt-BaseMenuContent:where(.rt-r-size-1) :where(.rt-BaseMenuLabel) {
|
|
@@ -9061,8 +9055,8 @@
|
|
|
9061
9055
|
border-radius: var(--radius-1);
|
|
9062
9056
|
}
|
|
9063
9057
|
.rt-BaseMenuContent:where(.xs\:rt-r-size-1) :where(.rt-BaseMenuItem) :where(svg) {
|
|
9064
|
-
width: var(--space-
|
|
9065
|
-
height: var(--space-
|
|
9058
|
+
width: calc(var(--space-3) * 1.175);
|
|
9059
|
+
height: calc(var(--space-3) * 1.175);
|
|
9066
9060
|
flex-shrink: 0;
|
|
9067
9061
|
}
|
|
9068
9062
|
.rt-BaseMenuContent:where(.xs\:rt-r-size-1) :where(.rt-BaseMenuLabel) {
|
|
@@ -9131,8 +9125,8 @@
|
|
|
9131
9125
|
border-radius: var(--radius-1);
|
|
9132
9126
|
}
|
|
9133
9127
|
.rt-BaseMenuContent:where(.sm\:rt-r-size-1) :where(.rt-BaseMenuItem) :where(svg) {
|
|
9134
|
-
width: var(--space-
|
|
9135
|
-
height: var(--space-
|
|
9128
|
+
width: calc(var(--space-3) * 1.175);
|
|
9129
|
+
height: calc(var(--space-3) * 1.175);
|
|
9136
9130
|
flex-shrink: 0;
|
|
9137
9131
|
}
|
|
9138
9132
|
.rt-BaseMenuContent:where(.sm\:rt-r-size-1) :where(.rt-BaseMenuLabel) {
|
|
@@ -9201,8 +9195,8 @@
|
|
|
9201
9195
|
border-radius: var(--radius-1);
|
|
9202
9196
|
}
|
|
9203
9197
|
.rt-BaseMenuContent:where(.md\:rt-r-size-1) :where(.rt-BaseMenuItem) :where(svg) {
|
|
9204
|
-
width: var(--space-
|
|
9205
|
-
height: var(--space-
|
|
9198
|
+
width: calc(var(--space-3) * 1.175);
|
|
9199
|
+
height: calc(var(--space-3) * 1.175);
|
|
9206
9200
|
flex-shrink: 0;
|
|
9207
9201
|
}
|
|
9208
9202
|
.rt-BaseMenuContent:where(.md\:rt-r-size-1) :where(.rt-BaseMenuLabel) {
|
|
@@ -9271,8 +9265,8 @@
|
|
|
9271
9265
|
border-radius: var(--radius-1);
|
|
9272
9266
|
}
|
|
9273
9267
|
.rt-BaseMenuContent:where(.lg\:rt-r-size-1) :where(.rt-BaseMenuItem) :where(svg) {
|
|
9274
|
-
width: var(--space-
|
|
9275
|
-
height: var(--space-
|
|
9268
|
+
width: calc(var(--space-3) * 1.175);
|
|
9269
|
+
height: calc(var(--space-3) * 1.175);
|
|
9276
9270
|
flex-shrink: 0;
|
|
9277
9271
|
}
|
|
9278
9272
|
.rt-BaseMenuContent:where(.lg\:rt-r-size-1) :where(.rt-BaseMenuLabel) {
|
|
@@ -9341,8 +9335,8 @@
|
|
|
9341
9335
|
border-radius: var(--radius-1);
|
|
9342
9336
|
}
|
|
9343
9337
|
.rt-BaseMenuContent:where(.xl\:rt-r-size-1) :where(.rt-BaseMenuItem) :where(svg) {
|
|
9344
|
-
width: var(--space-
|
|
9345
|
-
height: var(--space-
|
|
9338
|
+
width: calc(var(--space-3) * 1.175);
|
|
9339
|
+
height: calc(var(--space-3) * 1.175);
|
|
9346
9340
|
flex-shrink: 0;
|
|
9347
9341
|
}
|
|
9348
9342
|
.rt-BaseMenuContent:where(.xl\:rt-r-size-1) :where(.rt-BaseMenuLabel) {
|
|
@@ -10650,8 +10644,8 @@
|
|
|
10650
10644
|
width: var(--base-button-height);
|
|
10651
10645
|
}
|
|
10652
10646
|
.rt-IconButton:where(.rt-r-size-1) :where(svg) {
|
|
10653
|
-
width: var(--space-
|
|
10654
|
-
height: var(--space-
|
|
10647
|
+
width: calc(var(--space-3) * 1.175);
|
|
10648
|
+
height: calc(var(--space-3) * 1.175);
|
|
10655
10649
|
}
|
|
10656
10650
|
.rt-IconButton:where(.rt-r-size-2) :where(svg) {
|
|
10657
10651
|
width: var(--space-4);
|
|
@@ -10679,8 +10673,8 @@
|
|
|
10679
10673
|
}
|
|
10680
10674
|
@media (min-width: 520px) {
|
|
10681
10675
|
.rt-IconButton:where(.xs\:rt-r-size-1) :where(svg) {
|
|
10682
|
-
width: var(--space-
|
|
10683
|
-
height: var(--space-
|
|
10676
|
+
width: calc(var(--space-3) * 1.175);
|
|
10677
|
+
height: calc(var(--space-3) * 1.175);
|
|
10684
10678
|
}
|
|
10685
10679
|
.rt-IconButton:where(.xs\:rt-r-size-2) :where(svg) {
|
|
10686
10680
|
width: var(--space-4);
|
|
@@ -10709,8 +10703,8 @@
|
|
|
10709
10703
|
}
|
|
10710
10704
|
@media (min-width: 768px) {
|
|
10711
10705
|
.rt-IconButton:where(.sm\:rt-r-size-1) :where(svg) {
|
|
10712
|
-
width: var(--space-
|
|
10713
|
-
height: var(--space-
|
|
10706
|
+
width: calc(var(--space-3) * 1.175);
|
|
10707
|
+
height: calc(var(--space-3) * 1.175);
|
|
10714
10708
|
}
|
|
10715
10709
|
.rt-IconButton:where(.sm\:rt-r-size-2) :where(svg) {
|
|
10716
10710
|
width: var(--space-4);
|
|
@@ -10739,8 +10733,8 @@
|
|
|
10739
10733
|
}
|
|
10740
10734
|
@media (min-width: 1024px) {
|
|
10741
10735
|
.rt-IconButton:where(.md\:rt-r-size-1) :where(svg) {
|
|
10742
|
-
width: var(--space-
|
|
10743
|
-
height: var(--space-
|
|
10736
|
+
width: calc(var(--space-3) * 1.175);
|
|
10737
|
+
height: calc(var(--space-3) * 1.175);
|
|
10744
10738
|
}
|
|
10745
10739
|
.rt-IconButton:where(.md\:rt-r-size-2) :where(svg) {
|
|
10746
10740
|
width: var(--space-4);
|
|
@@ -10769,8 +10763,8 @@
|
|
|
10769
10763
|
}
|
|
10770
10764
|
@media (min-width: 1280px) {
|
|
10771
10765
|
.rt-IconButton:where(.lg\:rt-r-size-1) :where(svg) {
|
|
10772
|
-
width: var(--space-
|
|
10773
|
-
height: var(--space-
|
|
10766
|
+
width: calc(var(--space-3) * 1.175);
|
|
10767
|
+
height: calc(var(--space-3) * 1.175);
|
|
10774
10768
|
}
|
|
10775
10769
|
.rt-IconButton:where(.lg\:rt-r-size-2) :where(svg) {
|
|
10776
10770
|
width: var(--space-4);
|
|
@@ -10799,8 +10793,8 @@
|
|
|
10799
10793
|
}
|
|
10800
10794
|
@media (min-width: 1640px) {
|
|
10801
10795
|
.rt-IconButton:where(.xl\:rt-r-size-1) :where(svg) {
|
|
10802
|
-
width: var(--space-
|
|
10803
|
-
height: var(--space-
|
|
10796
|
+
width: calc(var(--space-3) * 1.175);
|
|
10797
|
+
height: calc(var(--space-3) * 1.175);
|
|
10804
10798
|
}
|
|
10805
10799
|
.rt-IconButton:where(.xl\:rt-r-size-2) :where(svg) {
|
|
10806
10800
|
width: var(--space-4);
|
|
@@ -14126,16 +14120,34 @@
|
|
|
14126
14120
|
--separator-size: 100%;
|
|
14127
14121
|
}
|
|
14128
14122
|
}
|
|
14123
|
+
.rt-SidebarProvider:where([data-side="left"]) {
|
|
14124
|
+
order: -1;
|
|
14125
|
+
}
|
|
14126
|
+
.rt-SidebarProvider:where([data-side="right"]) {
|
|
14127
|
+
order: 999;
|
|
14128
|
+
}
|
|
14129
14129
|
.rt-SidebarRoot {
|
|
14130
14130
|
--sidebar-width: 16rem;
|
|
14131
|
-
--sidebar-width-icon: 3rem;
|
|
14132
|
-
position: fixed;
|
|
14133
|
-
top: 0;
|
|
14134
|
-
bottom: 0;
|
|
14135
|
-
left: 0;
|
|
14136
|
-
z-index: 30;
|
|
14137
14131
|
width: var(--sidebar-width);
|
|
14138
|
-
|
|
14132
|
+
height: 100vh;
|
|
14133
|
+
flex-shrink: 0;
|
|
14134
|
+
display: flex;
|
|
14135
|
+
flex-direction: column;
|
|
14136
|
+
}
|
|
14137
|
+
.rt-SidebarRoot :where(.radix-themes) {
|
|
14138
|
+
display: flex;
|
|
14139
|
+
flex-direction: column;
|
|
14140
|
+
flex: 1;
|
|
14141
|
+
height: 100%;
|
|
14142
|
+
}
|
|
14143
|
+
.rt-SidebarRoot:where([data-type="floating"]) {
|
|
14144
|
+
border-radius: var(--radius-4);
|
|
14145
|
+
margin: var(--space-2);
|
|
14146
|
+
height: calc(100vh - var(--space-4));
|
|
14147
|
+
overflow: visible;
|
|
14148
|
+
}
|
|
14149
|
+
.rt-SidebarRoot:where([data-type="floating"]) :where(.radix-themes) {
|
|
14150
|
+
border-radius: inherit;
|
|
14139
14151
|
}
|
|
14140
14152
|
.rt-SidebarContainer {
|
|
14141
14153
|
display: flex;
|
|
@@ -14143,122 +14155,1300 @@
|
|
|
14143
14155
|
height: 100%;
|
|
14144
14156
|
width: 100%;
|
|
14145
14157
|
background-color: var(--color-panel-solid);
|
|
14146
|
-
border-
|
|
14158
|
+
border-radius: inherit;
|
|
14159
|
+
flex: 1;
|
|
14147
14160
|
}
|
|
14148
14161
|
.rt-SidebarHeader {
|
|
14162
|
+
display: flex;
|
|
14163
|
+
flex-direction: column;
|
|
14164
|
+
flex-shrink: 0;
|
|
14165
|
+
border-radius: var(--sidebar-base-border-radius) var(--sidebar-base-border-radius) 0 0;
|
|
14166
|
+
}
|
|
14167
|
+
.rt-SidebarHeader :where(.rt-SidebarMenuButton) {
|
|
14149
14168
|
display: flex;
|
|
14150
14169
|
align-items: center;
|
|
14151
|
-
|
|
14152
|
-
|
|
14170
|
+
gap: var(--space-2);
|
|
14171
|
+
min-height: var(--sidebar-item-height);
|
|
14172
|
+
padding-top: var(--sidebar-item-padding-y);
|
|
14173
|
+
padding-bottom: var(--sidebar-item-padding-y);
|
|
14174
|
+
padding-left: var(--sidebar-item-padding-left);
|
|
14175
|
+
padding-right: var(--sidebar-item-padding-right);
|
|
14176
|
+
box-sizing: border-box;
|
|
14177
|
+
position: relative;
|
|
14178
|
+
outline: none;
|
|
14179
|
+
background: none;
|
|
14180
|
+
border: none;
|
|
14181
|
+
width: 100%;
|
|
14182
|
+
text-align: left;
|
|
14183
|
+
cursor: var(--cursor-menu-item);
|
|
14184
|
+
-webkit-user-select: none;
|
|
14185
|
+
user-select: none;
|
|
14186
|
+
justify-content: flex-start;
|
|
14187
|
+
border-radius: var(--sidebar-base-border-radius) var(--sidebar-base-border-radius) 0 0;
|
|
14188
|
+
transition: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), filter var(--duration-2) var(--ease-1);
|
|
14189
|
+
}
|
|
14190
|
+
.rt-SidebarHeader :where(.rt-SidebarMenuButton):where([data-highlighted]:not([data-disabled])) {
|
|
14191
|
+
background-color: var(--gray-a3);
|
|
14192
|
+
}
|
|
14193
|
+
.rt-SidebarHeader :where(.rt-SidebarMenuButton):where(:active:not([data-disabled])) {
|
|
14194
|
+
background-color: var(--gray-a4);
|
|
14195
|
+
}
|
|
14196
|
+
.rt-SidebarHeader :where(.rt-SidebarMenuButton):where(:focus-visible) {
|
|
14197
|
+
outline: 2px solid var(--focus-8);
|
|
14198
|
+
outline-offset: 2px;
|
|
14199
|
+
}
|
|
14200
|
+
@media (prefers-reduced-motion: reduce) {
|
|
14201
|
+
.rt-SidebarHeader :where(.rt-SidebarMenuButton) {
|
|
14202
|
+
transition: none;
|
|
14203
|
+
}
|
|
14204
|
+
}
|
|
14205
|
+
.rt-SidebarHeader:where(.rt-SidebarHeader--container) {
|
|
14206
|
+
display: flex;
|
|
14207
|
+
flex-direction: row;
|
|
14208
|
+
align-items: center;
|
|
14209
|
+
gap: var(--space-2);
|
|
14210
|
+
padding: var(--sidebar-content-padding);
|
|
14211
|
+
min-height: var(--sidebar-item-height);
|
|
14212
|
+
}
|
|
14213
|
+
.rt-SidebarHeader:where(.rt-SidebarHeader--container) :where(.rt-SidebarMenuButton) {
|
|
14214
|
+
flex: 1;
|
|
14215
|
+
}
|
|
14216
|
+
.rt-SidebarHeader:where(.rt-flex-row) {
|
|
14217
|
+
flex-direction: row;
|
|
14218
|
+
}
|
|
14219
|
+
.rt-SidebarHeader:where(.rt-flex-col) {
|
|
14220
|
+
flex-direction: column;
|
|
14221
|
+
}
|
|
14222
|
+
.rt-SidebarHeader:where(.rt-items-center) {
|
|
14223
|
+
align-items: center;
|
|
14224
|
+
}
|
|
14225
|
+
.rt-SidebarHeader:where(.rt-items-start) {
|
|
14226
|
+
align-items: flex-start;
|
|
14227
|
+
}
|
|
14228
|
+
.rt-SidebarHeader:where(.rt-items-end) {
|
|
14229
|
+
align-items: flex-end;
|
|
14230
|
+
}
|
|
14231
|
+
.rt-SidebarHeader:where(.rt-justify-between) {
|
|
14232
|
+
justify-content: space-between;
|
|
14233
|
+
}
|
|
14234
|
+
.rt-SidebarHeader:where(.rt-justify-center) {
|
|
14235
|
+
justify-content: center;
|
|
14236
|
+
}
|
|
14237
|
+
.rt-SidebarHeader:where(.rt-justify-start) {
|
|
14238
|
+
justify-content: flex-start;
|
|
14239
|
+
}
|
|
14240
|
+
.rt-SidebarHeader:where(.rt-justify-end) {
|
|
14241
|
+
justify-content: flex-end;
|
|
14242
|
+
}
|
|
14243
|
+
.rt-SidebarHeader:where(.rt-gap-1) {
|
|
14244
|
+
gap: var(--space-1);
|
|
14245
|
+
}
|
|
14246
|
+
.rt-SidebarHeader:where(.rt-gap-2) {
|
|
14247
|
+
gap: var(--space-2);
|
|
14248
|
+
}
|
|
14249
|
+
.rt-SidebarHeader:where(.rt-gap-3) {
|
|
14250
|
+
gap: var(--space-3);
|
|
14251
|
+
}
|
|
14252
|
+
.rt-SidebarHeader:where(.rt-gap-4) {
|
|
14253
|
+
gap: var(--space-4);
|
|
14153
14254
|
}
|
|
14154
14255
|
.rt-SidebarContent {
|
|
14256
|
+
--scrollarea-scrollbar-vertical-margin-top: var(--sidebar-content-padding);
|
|
14257
|
+
--scrollarea-scrollbar-vertical-margin-bottom: var(--sidebar-content-padding);
|
|
14258
|
+
--scrollarea-scrollbar-horizontal-margin-left: var(--sidebar-content-padding);
|
|
14259
|
+
--scrollarea-scrollbar-horizontal-margin-right: var(--sidebar-content-padding);
|
|
14260
|
+
display: flex;
|
|
14261
|
+
flex-direction: column;
|
|
14155
14262
|
flex: 1;
|
|
14156
|
-
|
|
14263
|
+
box-sizing: border-box;
|
|
14157
14264
|
min-height: 0;
|
|
14158
14265
|
}
|
|
14159
|
-
.rt-
|
|
14160
|
-
|
|
14161
|
-
|
|
14266
|
+
.rt-SidebarContent :where(.rt-ScrollAreaRoot) {
|
|
14267
|
+
flex: 1;
|
|
14268
|
+
display: flex;
|
|
14269
|
+
flex-direction: column;
|
|
14270
|
+
min-height: 0;
|
|
14162
14271
|
}
|
|
14163
|
-
.rt-
|
|
14272
|
+
.rt-SidebarContent :where(.rt-ScrollAreaViewport) {
|
|
14164
14273
|
flex: 1;
|
|
14165
|
-
|
|
14166
|
-
|
|
14274
|
+
display: flex;
|
|
14275
|
+
flex-direction: column;
|
|
14276
|
+
min-height: 0;
|
|
14167
14277
|
}
|
|
14168
|
-
.rt-
|
|
14169
|
-
|
|
14170
|
-
|
|
14278
|
+
.rt-SidebarMenu {
|
|
14279
|
+
flex: 1;
|
|
14280
|
+
display: flex;
|
|
14281
|
+
flex-direction: column;
|
|
14282
|
+
gap: var(--space-2);
|
|
14283
|
+
padding: var(--sidebar-content-padding);
|
|
14284
|
+
box-sizing: border-box;
|
|
14285
|
+
list-style: none;
|
|
14286
|
+
margin: 0;
|
|
14287
|
+
min-height: 0;
|
|
14171
14288
|
}
|
|
14172
|
-
.rt-
|
|
14173
|
-
|
|
14174
|
-
--sidebar-width-icon: 3.5rem;
|
|
14289
|
+
:where(.rt-SidebarContent:has(.rt-ScrollAreaScrollbar[data-orientation='vertical'])) .rt-SidebarMenu {
|
|
14290
|
+
padding-right: var(--space-3);
|
|
14175
14291
|
}
|
|
14176
|
-
|
|
14177
|
-
|
|
14178
|
-
--sidebar-width: 14rem;
|
|
14179
|
-
--sidebar-width-icon: 2.5rem;
|
|
14180
|
-
}
|
|
14181
|
-
.rt-SidebarRoot:where(.xs\:rt-r-size-3) {
|
|
14182
|
-
--sidebar-width: 18rem;
|
|
14183
|
-
--sidebar-width-icon: 3.5rem;
|
|
14184
|
-
}
|
|
14292
|
+
.rt-SidebarMenuItem {
|
|
14293
|
+
list-style: none;
|
|
14185
14294
|
}
|
|
14186
|
-
|
|
14187
|
-
|
|
14188
|
-
|
|
14189
|
-
|
|
14190
|
-
|
|
14191
|
-
|
|
14192
|
-
|
|
14193
|
-
|
|
14194
|
-
|
|
14295
|
+
.rt-SidebarMenuButton {
|
|
14296
|
+
display: flex;
|
|
14297
|
+
align-items: center;
|
|
14298
|
+
gap: var(--space-2);
|
|
14299
|
+
min-height: var(--sidebar-item-height);
|
|
14300
|
+
padding-top: var(--sidebar-item-padding-y);
|
|
14301
|
+
padding-bottom: var(--sidebar-item-padding-y);
|
|
14302
|
+
padding-left: var(--sidebar-item-padding-left);
|
|
14303
|
+
padding-right: var(--sidebar-item-padding-right);
|
|
14304
|
+
box-sizing: border-box;
|
|
14305
|
+
position: relative;
|
|
14306
|
+
outline: none;
|
|
14307
|
+
scroll-margin: var(--sidebar-content-padding) 0;
|
|
14308
|
+
background: none;
|
|
14309
|
+
border: none;
|
|
14310
|
+
width: 100%;
|
|
14311
|
+
text-align: left;
|
|
14312
|
+
border-radius: var(--radius-2);
|
|
14313
|
+
transition: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), filter var(--duration-2) var(--ease-1);
|
|
14314
|
+
-webkit-user-select: none;
|
|
14315
|
+
user-select: none;
|
|
14316
|
+
cursor: var(--cursor-menu-item);
|
|
14195
14317
|
}
|
|
14196
|
-
|
|
14197
|
-
|
|
14198
|
-
|
|
14199
|
-
|
|
14318
|
+
.rt-SidebarMenuButton:where([data-disabled]) {
|
|
14319
|
+
cursor: default;
|
|
14320
|
+
color: var(--gray-a8);
|
|
14321
|
+
}
|
|
14322
|
+
.rt-SidebarMenuButton:where([data-highlighted]:not([data-disabled])) {
|
|
14323
|
+
background-color: var(--gray-a3);
|
|
14324
|
+
}
|
|
14325
|
+
@media (hover: hover) {
|
|
14326
|
+
.rt-SidebarMenuButton:where(:hover:not([data-disabled])) {
|
|
14327
|
+
background-color: var(--gray-a3);
|
|
14200
14328
|
}
|
|
14201
|
-
|
|
14202
|
-
|
|
14203
|
-
|
|
14329
|
+
}
|
|
14330
|
+
.rt-SidebarMenuButton:where(:active:not([data-disabled])) {
|
|
14331
|
+
background-color: var(--gray-a4);
|
|
14332
|
+
}
|
|
14333
|
+
.rt-SidebarMenuButton:where([data-active], .rt-active) {
|
|
14334
|
+
background-color: var(--accent-a3);
|
|
14335
|
+
color: var(--accent-a12);
|
|
14336
|
+
}
|
|
14337
|
+
.rt-SidebarMenuButton:where(:focus-visible) {
|
|
14338
|
+
outline: 2px solid var(--focus-8);
|
|
14339
|
+
outline-offset: 2px;
|
|
14340
|
+
}
|
|
14341
|
+
.rt-SidebarMenuButton:where([data-accent-color]) {
|
|
14342
|
+
color: var(--accent-a11);
|
|
14343
|
+
}
|
|
14344
|
+
.rt-SidebarMenuButton :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']) {
|
|
14345
|
+
color: var(--gray-a10);
|
|
14346
|
+
}
|
|
14347
|
+
@media (prefers-reduced-motion: reduce) {
|
|
14348
|
+
.rt-SidebarMenuButton {
|
|
14349
|
+
transition: none;
|
|
14204
14350
|
}
|
|
14205
14351
|
}
|
|
14206
|
-
|
|
14207
|
-
|
|
14208
|
-
|
|
14209
|
-
|
|
14352
|
+
.rt-SidebarMenuSubTrigger {
|
|
14353
|
+
justify-content: space-between;
|
|
14354
|
+
}
|
|
14355
|
+
.rt-SidebarMenuSubTrigger :where(.rt-SidebarMenuSubTriggerIcon) {
|
|
14356
|
+
transition: transform 0.2s ease;
|
|
14357
|
+
}
|
|
14358
|
+
.rt-SidebarMenuSubTrigger:where([data-state="open"]) :where(.rt-SidebarMenuSubTriggerIcon) {
|
|
14359
|
+
transform: rotate(90deg);
|
|
14360
|
+
}
|
|
14361
|
+
.rt-SidebarMenuSubContent {
|
|
14362
|
+
overflow: hidden;
|
|
14363
|
+
}
|
|
14364
|
+
.rt-SidebarMenuSubContent:where(:focus-within) {
|
|
14365
|
+
overflow: visible;
|
|
14366
|
+
}
|
|
14367
|
+
.rt-SidebarMenuSubContent:where([data-state="open"]) {
|
|
14368
|
+
animation: rt-sidebar-slide-down 200ms ease-out;
|
|
14369
|
+
}
|
|
14370
|
+
.rt-SidebarMenuSubContent:where([data-state="closed"]) {
|
|
14371
|
+
animation: rt-sidebar-slide-up 200ms ease-out;
|
|
14372
|
+
}
|
|
14373
|
+
@keyframes rt-sidebar-slide-down {
|
|
14374
|
+
from {
|
|
14375
|
+
height: 0;
|
|
14210
14376
|
}
|
|
14211
|
-
|
|
14212
|
-
--
|
|
14213
|
-
--sidebar-width-icon: 3.5rem;
|
|
14377
|
+
to {
|
|
14378
|
+
height: var(--radix-accordion-content-height);
|
|
14214
14379
|
}
|
|
14215
14380
|
}
|
|
14216
|
-
@
|
|
14217
|
-
|
|
14218
|
-
--
|
|
14219
|
-
--sidebar-width-icon: 2.5rem;
|
|
14381
|
+
@keyframes rt-sidebar-slide-up {
|
|
14382
|
+
from {
|
|
14383
|
+
height: var(--radix-accordion-content-height);
|
|
14220
14384
|
}
|
|
14221
|
-
|
|
14222
|
-
|
|
14223
|
-
--sidebar-width-icon: 3.5rem;
|
|
14385
|
+
to {
|
|
14386
|
+
height: 0;
|
|
14224
14387
|
}
|
|
14225
14388
|
}
|
|
14226
|
-
.rt-
|
|
14227
|
-
padding: var(--space-
|
|
14228
|
-
|
|
14229
|
-
|
|
14230
|
-
padding: var(--space-4);
|
|
14389
|
+
.rt-SidebarMenuSubList {
|
|
14390
|
+
padding-left: var(--space-4);
|
|
14391
|
+
border-left: 1px solid var(--gray-a5);
|
|
14392
|
+
margin-left: var(--space-3);
|
|
14231
14393
|
}
|
|
14232
|
-
|
|
14233
|
-
padding: var(--space-
|
|
14394
|
+
:where(.rt-SidebarContent.rt-r-size-1) :where(.rt-SidebarMenuSubList) .rt-SidebarMenuButton {
|
|
14395
|
+
padding-left: var(--space-3);
|
|
14396
|
+
padding-top: calc(var(--space-1) * 0.75);
|
|
14397
|
+
padding-bottom: calc(var(--space-1) * 0.75);
|
|
14398
|
+
min-height: var(--space-5);
|
|
14399
|
+
font-size: var(--font-size-1);
|
|
14234
14400
|
}
|
|
14235
|
-
|
|
14236
|
-
padding: var(--space-
|
|
14401
|
+
:where(.rt-SidebarContent.rt-r-size-2) :where(.rt-SidebarMenuSubList) .rt-SidebarMenuButton {
|
|
14402
|
+
padding-left: var(--space-3);
|
|
14403
|
+
padding-top: var(--space-1);
|
|
14404
|
+
padding-bottom: var(--space-1);
|
|
14405
|
+
min-height: var(--space-6);
|
|
14406
|
+
font-size: var(--font-size-2);
|
|
14237
14407
|
}
|
|
14238
|
-
.rt-
|
|
14239
|
-
|
|
14408
|
+
.rt-SidebarFooter {
|
|
14409
|
+
display: flex;
|
|
14410
|
+
flex-direction: column;
|
|
14411
|
+
flex-shrink: 0;
|
|
14412
|
+
margin-top: auto;
|
|
14413
|
+
border-radius: 0 0 var(--sidebar-base-border-radius) var(--sidebar-base-border-radius);
|
|
14240
14414
|
}
|
|
14241
|
-
.rt-
|
|
14242
|
-
|
|
14415
|
+
.rt-SidebarFooter :where(.rt-SidebarMenuButton) {
|
|
14416
|
+
display: flex;
|
|
14417
|
+
align-items: center;
|
|
14418
|
+
gap: var(--space-2);
|
|
14419
|
+
min-height: var(--sidebar-item-height);
|
|
14420
|
+
padding-top: var(--sidebar-item-padding-y);
|
|
14421
|
+
padding-bottom: var(--sidebar-item-padding-y);
|
|
14422
|
+
padding-left: var(--sidebar-item-padding-left);
|
|
14423
|
+
padding-right: var(--sidebar-item-padding-right);
|
|
14424
|
+
box-sizing: border-box;
|
|
14425
|
+
position: relative;
|
|
14426
|
+
outline: none;
|
|
14427
|
+
background: none;
|
|
14428
|
+
border: none;
|
|
14429
|
+
width: 100%;
|
|
14430
|
+
text-align: left;
|
|
14431
|
+
cursor: var(--cursor-menu-item);
|
|
14432
|
+
-webkit-user-select: none;
|
|
14433
|
+
user-select: none;
|
|
14434
|
+
justify-content: flex-start;
|
|
14435
|
+
border-radius: 0 0 var(--sidebar-base-border-radius) var(--sidebar-base-border-radius);
|
|
14436
|
+
transition: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), filter var(--duration-2) var(--ease-1);
|
|
14243
14437
|
}
|
|
14244
|
-
.rt-
|
|
14245
|
-
background-color: var(--
|
|
14246
|
-
border: 1px solid var(--gray-a5);
|
|
14438
|
+
.rt-SidebarFooter :where(.rt-SidebarMenuButton):where([data-highlighted]:not([data-disabled])) {
|
|
14439
|
+
background-color: var(--gray-a3);
|
|
14247
14440
|
}
|
|
14248
|
-
.rt-
|
|
14249
|
-
background-color:
|
|
14250
|
-
border: none;
|
|
14441
|
+
.rt-SidebarFooter :where(.rt-SidebarMenuButton):where(:active:not([data-disabled])) {
|
|
14442
|
+
background-color: var(--gray-a4);
|
|
14251
14443
|
}
|
|
14252
|
-
.rt-
|
|
14253
|
-
|
|
14254
|
-
|
|
14444
|
+
.rt-SidebarFooter :where(.rt-SidebarMenuButton):where(:focus-visible) {
|
|
14445
|
+
outline: 2px solid var(--focus-8);
|
|
14446
|
+
outline-offset: 2px;
|
|
14255
14447
|
}
|
|
14256
|
-
@media (
|
|
14257
|
-
.rt-
|
|
14258
|
-
|
|
14448
|
+
@media (prefers-reduced-motion: reduce) {
|
|
14449
|
+
.rt-SidebarFooter :where(.rt-SidebarMenuButton) {
|
|
14450
|
+
transition: none;
|
|
14259
14451
|
}
|
|
14260
|
-
|
|
14261
|
-
|
|
14452
|
+
}
|
|
14453
|
+
.rt-SidebarFooter:where(.rt-SidebarFooter--container) {
|
|
14454
|
+
display: flex;
|
|
14455
|
+
flex-direction: row;
|
|
14456
|
+
align-items: center;
|
|
14457
|
+
gap: var(--space-2);
|
|
14458
|
+
padding: var(--sidebar-content-padding);
|
|
14459
|
+
min-height: var(--sidebar-item-height);
|
|
14460
|
+
}
|
|
14461
|
+
.rt-SidebarFooter:where(.rt-SidebarFooter--container) :where(.rt-SidebarMenuButton) {
|
|
14462
|
+
flex: 1;
|
|
14463
|
+
}
|
|
14464
|
+
.rt-SidebarFooter:where(.rt-flex-row) {
|
|
14465
|
+
flex-direction: row;
|
|
14466
|
+
}
|
|
14467
|
+
.rt-SidebarFooter:where(.rt-flex-col) {
|
|
14468
|
+
flex-direction: column;
|
|
14469
|
+
}
|
|
14470
|
+
.rt-SidebarFooter:where(.rt-items-center) {
|
|
14471
|
+
align-items: center;
|
|
14472
|
+
}
|
|
14473
|
+
.rt-SidebarFooter:where(.rt-items-start) {
|
|
14474
|
+
align-items: flex-start;
|
|
14475
|
+
}
|
|
14476
|
+
.rt-SidebarFooter:where(.rt-items-end) {
|
|
14477
|
+
align-items: flex-end;
|
|
14478
|
+
}
|
|
14479
|
+
.rt-SidebarFooter:where(.rt-justify-between) {
|
|
14480
|
+
justify-content: space-between;
|
|
14481
|
+
}
|
|
14482
|
+
.rt-SidebarFooter:where(.rt-justify-center) {
|
|
14483
|
+
justify-content: center;
|
|
14484
|
+
}
|
|
14485
|
+
.rt-SidebarFooter:where(.rt-justify-start) {
|
|
14486
|
+
justify-content: flex-start;
|
|
14487
|
+
}
|
|
14488
|
+
.rt-SidebarFooter:where(.rt-justify-end) {
|
|
14489
|
+
justify-content: flex-end;
|
|
14490
|
+
}
|
|
14491
|
+
.rt-SidebarFooter:where(.rt-gap-1) {
|
|
14492
|
+
gap: var(--space-1);
|
|
14493
|
+
}
|
|
14494
|
+
.rt-SidebarFooter:where(.rt-gap-2) {
|
|
14495
|
+
gap: var(--space-2);
|
|
14496
|
+
}
|
|
14497
|
+
.rt-SidebarFooter:where(.rt-gap-3) {
|
|
14498
|
+
gap: var(--space-3);
|
|
14499
|
+
}
|
|
14500
|
+
.rt-SidebarFooter:where(.rt-gap-4) {
|
|
14501
|
+
gap: var(--space-4);
|
|
14502
|
+
}
|
|
14503
|
+
.rt-SidebarSeparator {
|
|
14504
|
+
width: 100%;
|
|
14505
|
+
margin: var(--space-2) 0;
|
|
14506
|
+
}
|
|
14507
|
+
.rt-SidebarGroup {
|
|
14508
|
+
display: flex;
|
|
14509
|
+
flex-direction: column;
|
|
14510
|
+
flex-shrink: 0;
|
|
14511
|
+
}
|
|
14512
|
+
.rt-SidebarGroup:where(:not(:first-child)) {
|
|
14513
|
+
margin-top: var(--space-4);
|
|
14514
|
+
}
|
|
14515
|
+
.rt-SidebarGroupLabel {
|
|
14516
|
+
display: flex;
|
|
14517
|
+
align-items: center;
|
|
14518
|
+
min-height: var(--sidebar-item-height);
|
|
14519
|
+
padding-top: var(--sidebar-item-padding-y);
|
|
14520
|
+
padding-bottom: var(--sidebar-item-padding-y);
|
|
14521
|
+
padding-left: var(--sidebar-item-padding-left);
|
|
14522
|
+
padding-right: var(--sidebar-item-padding-right);
|
|
14523
|
+
box-sizing: border-box;
|
|
14524
|
+
color: var(--gray-a10);
|
|
14525
|
+
-webkit-user-select: none;
|
|
14526
|
+
user-select: none;
|
|
14527
|
+
cursor: default;
|
|
14528
|
+
flex-shrink: 0;
|
|
14529
|
+
}
|
|
14530
|
+
.rt-SidebarGroupContent {
|
|
14531
|
+
display: flex;
|
|
14532
|
+
flex-direction: column;
|
|
14533
|
+
flex-shrink: 0;
|
|
14534
|
+
}
|
|
14535
|
+
.rt-SidebarContainer:where(.rt-r-size-1) {
|
|
14536
|
+
--sidebar-base-padding: var(--space-3);
|
|
14537
|
+
--sidebar-base-border-radius: var(--radius-4);
|
|
14538
|
+
--sidebar-content-padding: var(--space-1);
|
|
14539
|
+
--sidebar-item-padding-left: var(--space-2);
|
|
14540
|
+
--sidebar-item-padding-right: var(--space-2);
|
|
14541
|
+
--sidebar-item-padding-y: calc(var(--space-1) * 0.75);
|
|
14542
|
+
--sidebar-item-height: var(--space-5);
|
|
14543
|
+
}
|
|
14544
|
+
.rt-SidebarContainer:where(.rt-r-size-2) {
|
|
14545
|
+
--sidebar-base-padding: var(--space-4);
|
|
14546
|
+
--sidebar-base-border-radius: var(--radius-4);
|
|
14547
|
+
--sidebar-content-padding: var(--space-2);
|
|
14548
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
14549
|
+
--sidebar-item-padding-right: var(--space-3);
|
|
14550
|
+
--sidebar-item-padding-y: var(--space-1);
|
|
14551
|
+
--sidebar-item-height: var(--space-6);
|
|
14552
|
+
}
|
|
14553
|
+
.rt-SidebarContent:where(.rt-r-size-1) {
|
|
14554
|
+
--sidebar-content-padding: var(--space-1);
|
|
14555
|
+
--sidebar-item-padding-left: calc(var(--space-5) / 1.2);
|
|
14556
|
+
--sidebar-item-padding-right: var(--space-2);
|
|
14557
|
+
--sidebar-item-padding-y: calc(var(--space-1) * 0.75);
|
|
14558
|
+
--sidebar-item-height: var(--space-5);
|
|
14559
|
+
border-radius: var(--radius-3);
|
|
14560
|
+
}
|
|
14561
|
+
.rt-SidebarContent:where(.rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
|
|
14562
|
+
--sidebar-item-padding-left: var(--space-2);
|
|
14563
|
+
}
|
|
14564
|
+
.rt-SidebarContent:where(.rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
|
|
14565
|
+
--sidebar-item-padding-left: calc(var(--space-5) / 1.2);
|
|
14566
|
+
}
|
|
14567
|
+
.rt-SidebarContent:where(.rt-r-size-2) {
|
|
14568
|
+
--sidebar-content-padding: var(--space-2);
|
|
14569
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
14570
|
+
--sidebar-item-padding-right: var(--space-3);
|
|
14571
|
+
--sidebar-item-padding-y: var(--space-1);
|
|
14572
|
+
--sidebar-item-height: var(--space-6);
|
|
14573
|
+
border-radius: var(--radius-4);
|
|
14574
|
+
}
|
|
14575
|
+
.rt-SidebarContent:where(.rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
|
|
14576
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
14577
|
+
}
|
|
14578
|
+
.rt-SidebarContent:where(.rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
|
|
14579
|
+
--sidebar-item-padding-left: var(--space-5);
|
|
14580
|
+
}
|
|
14581
|
+
.rt-SidebarContent:where(.rt-r-size-1) :where(.rt-SidebarMenuButton) {
|
|
14582
|
+
font-size: var(--font-size-1);
|
|
14583
|
+
line-height: var(--line-height-1);
|
|
14584
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14585
|
+
border-radius: var(--radius-1);
|
|
14586
|
+
}
|
|
14587
|
+
.rt-SidebarContent:where(.rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
|
|
14588
|
+
width: calc(var(--space-3) * 1.175);
|
|
14589
|
+
height: calc(var(--space-3) * 1.175);
|
|
14590
|
+
flex-shrink: 0;
|
|
14591
|
+
}
|
|
14592
|
+
.rt-SidebarContent:where(.rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
|
|
14593
|
+
width: calc(8px * var(--scaling));
|
|
14594
|
+
height: calc(8px * var(--scaling));
|
|
14595
|
+
flex-shrink: 0;
|
|
14596
|
+
margin-left: auto;
|
|
14597
|
+
}
|
|
14598
|
+
.rt-SidebarContent:where(.rt-r-size-1) :where(.rt-SidebarGroupLabel) {
|
|
14599
|
+
font-size: var(--font-size-1);
|
|
14600
|
+
line-height: var(--line-height-1);
|
|
14601
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14602
|
+
}
|
|
14603
|
+
.rt-SidebarContainer:where(.rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
|
|
14604
|
+
font-size: var(--font-size-1);
|
|
14605
|
+
line-height: var(--line-height-1);
|
|
14606
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14607
|
+
border-radius: var(--radius-1);
|
|
14608
|
+
}
|
|
14609
|
+
.rt-SidebarContainer:where(.rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
|
|
14610
|
+
width: calc(var(--space-3) * 1.175);
|
|
14611
|
+
height: calc(var(--space-3) * 1.175);
|
|
14612
|
+
flex-shrink: 0;
|
|
14613
|
+
}
|
|
14614
|
+
.rt-SidebarContainer:where(.rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
|
|
14615
|
+
font-size: var(--font-size-1);
|
|
14616
|
+
line-height: var(--line-height-1);
|
|
14617
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14618
|
+
border-radius: var(--radius-1);
|
|
14619
|
+
}
|
|
14620
|
+
.rt-SidebarContainer:where(.rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
|
|
14621
|
+
width: calc(var(--space-3) * 1.175);
|
|
14622
|
+
height: calc(var(--space-3) * 1.175);
|
|
14623
|
+
flex-shrink: 0;
|
|
14624
|
+
}
|
|
14625
|
+
.rt-SidebarContent:where(.rt-r-size-2) :where(.rt-SidebarMenuButton) {
|
|
14626
|
+
font-size: var(--font-size-2);
|
|
14627
|
+
line-height: var(--line-height-2);
|
|
14628
|
+
letter-spacing: var(--letter-spacing-2);
|
|
14629
|
+
border-radius: var(--radius-2);
|
|
14630
|
+
}
|
|
14631
|
+
.rt-SidebarContent:where(.rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
|
|
14632
|
+
width: var(--space-4);
|
|
14633
|
+
height: var(--space-4);
|
|
14634
|
+
flex-shrink: 0;
|
|
14635
|
+
}
|
|
14636
|
+
.rt-SidebarContent:where(.rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
|
|
14637
|
+
width: calc(10px * var(--scaling));
|
|
14638
|
+
height: calc(10px * var(--scaling));
|
|
14639
|
+
flex-shrink: 0;
|
|
14640
|
+
margin-left: auto;
|
|
14641
|
+
}
|
|
14642
|
+
.rt-SidebarContent:where(.rt-r-size-2) :where(.rt-SidebarGroupLabel) {
|
|
14643
|
+
font-size: var(--font-size-2);
|
|
14644
|
+
line-height: var(--line-height-2);
|
|
14645
|
+
letter-spacing: var(--letter-spacing-2);
|
|
14646
|
+
}
|
|
14647
|
+
.rt-SidebarContainer:where(.rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
|
|
14648
|
+
font-size: var(--font-size-2);
|
|
14649
|
+
line-height: var(--line-height-2);
|
|
14650
|
+
letter-spacing: var(--letter-spacing-2);
|
|
14651
|
+
border-radius: var(--radius-2);
|
|
14652
|
+
}
|
|
14653
|
+
.rt-SidebarContainer:where(.rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
|
|
14654
|
+
width: var(--space-4);
|
|
14655
|
+
height: var(--space-4);
|
|
14656
|
+
flex-shrink: 0;
|
|
14657
|
+
}
|
|
14658
|
+
.rt-SidebarContainer:where(.rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
|
|
14659
|
+
font-size: var(--font-size-2);
|
|
14660
|
+
line-height: var(--line-height-2);
|
|
14661
|
+
letter-spacing: var(--letter-spacing-2);
|
|
14662
|
+
border-radius: var(--radius-2);
|
|
14663
|
+
}
|
|
14664
|
+
.rt-SidebarContainer:where(.rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
|
|
14665
|
+
width: var(--space-4);
|
|
14666
|
+
height: var(--space-4);
|
|
14667
|
+
flex-shrink: 0;
|
|
14668
|
+
}
|
|
14669
|
+
@media (min-width: 520px) {
|
|
14670
|
+
.rt-SidebarContainer:where(.xs\:rt-r-size-1) {
|
|
14671
|
+
--sidebar-base-padding: var(--space-3);
|
|
14672
|
+
--sidebar-base-border-radius: var(--radius-4);
|
|
14673
|
+
--sidebar-content-padding: var(--space-1);
|
|
14674
|
+
--sidebar-item-padding-left: var(--space-2);
|
|
14675
|
+
--sidebar-item-padding-right: var(--space-2);
|
|
14676
|
+
--sidebar-item-padding-y: calc(var(--space-1) * 0.75);
|
|
14677
|
+
--sidebar-item-height: var(--space-5);
|
|
14678
|
+
}
|
|
14679
|
+
.rt-SidebarContainer:where(.xs\:rt-r-size-2) {
|
|
14680
|
+
--sidebar-base-padding: var(--space-4);
|
|
14681
|
+
--sidebar-base-border-radius: var(--radius-4);
|
|
14682
|
+
--sidebar-content-padding: var(--space-2);
|
|
14683
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
14684
|
+
--sidebar-item-padding-right: var(--space-3);
|
|
14685
|
+
--sidebar-item-padding-y: var(--space-1);
|
|
14686
|
+
--sidebar-item-height: var(--space-6);
|
|
14687
|
+
}
|
|
14688
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-1) {
|
|
14689
|
+
--sidebar-content-padding: var(--space-1);
|
|
14690
|
+
--sidebar-item-padding-left: calc(var(--space-5) / 1.2);
|
|
14691
|
+
--sidebar-item-padding-right: var(--space-2);
|
|
14692
|
+
--sidebar-item-padding-y: calc(var(--space-1) * 0.75);
|
|
14693
|
+
--sidebar-item-height: var(--space-5);
|
|
14694
|
+
border-radius: var(--radius-3);
|
|
14695
|
+
}
|
|
14696
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
|
|
14697
|
+
--sidebar-item-padding-left: var(--space-2);
|
|
14698
|
+
}
|
|
14699
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
|
|
14700
|
+
--sidebar-item-padding-left: calc(var(--space-5) / 1.2);
|
|
14701
|
+
}
|
|
14702
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-2) {
|
|
14703
|
+
--sidebar-content-padding: var(--space-2);
|
|
14704
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
14705
|
+
--sidebar-item-padding-right: var(--space-3);
|
|
14706
|
+
--sidebar-item-padding-y: var(--space-1);
|
|
14707
|
+
--sidebar-item-height: var(--space-6);
|
|
14708
|
+
border-radius: var(--radius-4);
|
|
14709
|
+
}
|
|
14710
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
|
|
14711
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
14712
|
+
}
|
|
14713
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
|
|
14714
|
+
--sidebar-item-padding-left: var(--space-5);
|
|
14715
|
+
}
|
|
14716
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
|
|
14717
|
+
font-size: var(--font-size-1);
|
|
14718
|
+
line-height: var(--line-height-1);
|
|
14719
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14720
|
+
border-radius: var(--radius-1);
|
|
14721
|
+
}
|
|
14722
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
|
|
14723
|
+
width: calc(var(--space-3) * 1.175);
|
|
14724
|
+
height: calc(var(--space-3) * 1.175);
|
|
14725
|
+
flex-shrink: 0;
|
|
14726
|
+
}
|
|
14727
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
|
|
14728
|
+
width: calc(8px * var(--scaling));
|
|
14729
|
+
height: calc(8px * var(--scaling));
|
|
14730
|
+
flex-shrink: 0;
|
|
14731
|
+
margin-left: auto;
|
|
14732
|
+
}
|
|
14733
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
|
|
14734
|
+
font-size: var(--font-size-1);
|
|
14735
|
+
line-height: var(--line-height-1);
|
|
14736
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14737
|
+
}
|
|
14738
|
+
.rt-SidebarContainer:where(.xs\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
|
|
14739
|
+
font-size: var(--font-size-1);
|
|
14740
|
+
line-height: var(--line-height-1);
|
|
14741
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14742
|
+
border-radius: var(--radius-1);
|
|
14743
|
+
}
|
|
14744
|
+
.rt-SidebarContainer:where(.xs\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
|
|
14745
|
+
width: calc(var(--space-3) * 1.175);
|
|
14746
|
+
height: calc(var(--space-3) * 1.175);
|
|
14747
|
+
flex-shrink: 0;
|
|
14748
|
+
}
|
|
14749
|
+
.rt-SidebarContainer:where(.xs\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
|
|
14750
|
+
font-size: var(--font-size-1);
|
|
14751
|
+
line-height: var(--line-height-1);
|
|
14752
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14753
|
+
border-radius: var(--radius-1);
|
|
14754
|
+
}
|
|
14755
|
+
.rt-SidebarContainer:where(.xs\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
|
|
14756
|
+
width: calc(var(--space-3) * 1.175);
|
|
14757
|
+
height: calc(var(--space-3) * 1.175);
|
|
14758
|
+
flex-shrink: 0;
|
|
14759
|
+
}
|
|
14760
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
|
|
14761
|
+
font-size: var(--font-size-2);
|
|
14762
|
+
line-height: var(--line-height-2);
|
|
14763
|
+
letter-spacing: var(--letter-spacing-2);
|
|
14764
|
+
border-radius: var(--radius-2);
|
|
14765
|
+
}
|
|
14766
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
|
|
14767
|
+
width: var(--space-4);
|
|
14768
|
+
height: var(--space-4);
|
|
14769
|
+
flex-shrink: 0;
|
|
14770
|
+
}
|
|
14771
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
|
|
14772
|
+
width: calc(10px * var(--scaling));
|
|
14773
|
+
height: calc(10px * var(--scaling));
|
|
14774
|
+
flex-shrink: 0;
|
|
14775
|
+
margin-left: auto;
|
|
14776
|
+
}
|
|
14777
|
+
.rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
|
|
14778
|
+
font-size: var(--font-size-2);
|
|
14779
|
+
line-height: var(--line-height-2);
|
|
14780
|
+
letter-spacing: var(--letter-spacing-2);
|
|
14781
|
+
}
|
|
14782
|
+
.rt-SidebarContainer:where(.xs\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
|
|
14783
|
+
font-size: var(--font-size-2);
|
|
14784
|
+
line-height: var(--line-height-2);
|
|
14785
|
+
letter-spacing: var(--letter-spacing-2);
|
|
14786
|
+
border-radius: var(--radius-2);
|
|
14787
|
+
}
|
|
14788
|
+
.rt-SidebarContainer:where(.xs\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
|
|
14789
|
+
width: var(--space-4);
|
|
14790
|
+
height: var(--space-4);
|
|
14791
|
+
flex-shrink: 0;
|
|
14792
|
+
}
|
|
14793
|
+
.rt-SidebarContainer:where(.xs\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
|
|
14794
|
+
font-size: var(--font-size-2);
|
|
14795
|
+
line-height: var(--line-height-2);
|
|
14796
|
+
letter-spacing: var(--letter-spacing-2);
|
|
14797
|
+
border-radius: var(--radius-2);
|
|
14798
|
+
}
|
|
14799
|
+
.rt-SidebarContainer:where(.xs\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
|
|
14800
|
+
width: var(--space-4);
|
|
14801
|
+
height: var(--space-4);
|
|
14802
|
+
flex-shrink: 0;
|
|
14803
|
+
}
|
|
14804
|
+
}
|
|
14805
|
+
@media (min-width: 768px) {
|
|
14806
|
+
.rt-SidebarContainer:where(.sm\:rt-r-size-1) {
|
|
14807
|
+
--sidebar-base-padding: var(--space-3);
|
|
14808
|
+
--sidebar-base-border-radius: var(--radius-4);
|
|
14809
|
+
--sidebar-content-padding: var(--space-1);
|
|
14810
|
+
--sidebar-item-padding-left: var(--space-2);
|
|
14811
|
+
--sidebar-item-padding-right: var(--space-2);
|
|
14812
|
+
--sidebar-item-padding-y: calc(var(--space-1) * 0.75);
|
|
14813
|
+
--sidebar-item-height: var(--space-5);
|
|
14814
|
+
}
|
|
14815
|
+
.rt-SidebarContainer:where(.sm\:rt-r-size-2) {
|
|
14816
|
+
--sidebar-base-padding: var(--space-4);
|
|
14817
|
+
--sidebar-base-border-radius: var(--radius-4);
|
|
14818
|
+
--sidebar-content-padding: var(--space-2);
|
|
14819
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
14820
|
+
--sidebar-item-padding-right: var(--space-3);
|
|
14821
|
+
--sidebar-item-padding-y: var(--space-1);
|
|
14822
|
+
--sidebar-item-height: var(--space-6);
|
|
14823
|
+
}
|
|
14824
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-1) {
|
|
14825
|
+
--sidebar-content-padding: var(--space-1);
|
|
14826
|
+
--sidebar-item-padding-left: calc(var(--space-5) / 1.2);
|
|
14827
|
+
--sidebar-item-padding-right: var(--space-2);
|
|
14828
|
+
--sidebar-item-padding-y: calc(var(--space-1) * 0.75);
|
|
14829
|
+
--sidebar-item-height: var(--space-5);
|
|
14830
|
+
border-radius: var(--radius-3);
|
|
14831
|
+
}
|
|
14832
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
|
|
14833
|
+
--sidebar-item-padding-left: var(--space-2);
|
|
14834
|
+
}
|
|
14835
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
|
|
14836
|
+
--sidebar-item-padding-left: calc(var(--space-5) / 1.2);
|
|
14837
|
+
}
|
|
14838
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-2) {
|
|
14839
|
+
--sidebar-content-padding: var(--space-2);
|
|
14840
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
14841
|
+
--sidebar-item-padding-right: var(--space-3);
|
|
14842
|
+
--sidebar-item-padding-y: var(--space-1);
|
|
14843
|
+
--sidebar-item-height: var(--space-6);
|
|
14844
|
+
border-radius: var(--radius-4);
|
|
14845
|
+
}
|
|
14846
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
|
|
14847
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
14848
|
+
}
|
|
14849
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
|
|
14850
|
+
--sidebar-item-padding-left: var(--space-5);
|
|
14851
|
+
}
|
|
14852
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
|
|
14853
|
+
font-size: var(--font-size-1);
|
|
14854
|
+
line-height: var(--line-height-1);
|
|
14855
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14856
|
+
border-radius: var(--radius-1);
|
|
14857
|
+
}
|
|
14858
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
|
|
14859
|
+
width: calc(var(--space-3) * 1.175);
|
|
14860
|
+
height: calc(var(--space-3) * 1.175);
|
|
14861
|
+
flex-shrink: 0;
|
|
14862
|
+
}
|
|
14863
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
|
|
14864
|
+
width: calc(8px * var(--scaling));
|
|
14865
|
+
height: calc(8px * var(--scaling));
|
|
14866
|
+
flex-shrink: 0;
|
|
14867
|
+
margin-left: auto;
|
|
14868
|
+
}
|
|
14869
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
|
|
14870
|
+
font-size: var(--font-size-1);
|
|
14871
|
+
line-height: var(--line-height-1);
|
|
14872
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14873
|
+
}
|
|
14874
|
+
.rt-SidebarContainer:where(.sm\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
|
|
14875
|
+
font-size: var(--font-size-1);
|
|
14876
|
+
line-height: var(--line-height-1);
|
|
14877
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14878
|
+
border-radius: var(--radius-1);
|
|
14879
|
+
}
|
|
14880
|
+
.rt-SidebarContainer:where(.sm\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
|
|
14881
|
+
width: calc(var(--space-3) * 1.175);
|
|
14882
|
+
height: calc(var(--space-3) * 1.175);
|
|
14883
|
+
flex-shrink: 0;
|
|
14884
|
+
}
|
|
14885
|
+
.rt-SidebarContainer:where(.sm\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
|
|
14886
|
+
font-size: var(--font-size-1);
|
|
14887
|
+
line-height: var(--line-height-1);
|
|
14888
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14889
|
+
border-radius: var(--radius-1);
|
|
14890
|
+
}
|
|
14891
|
+
.rt-SidebarContainer:where(.sm\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
|
|
14892
|
+
width: calc(var(--space-3) * 1.175);
|
|
14893
|
+
height: calc(var(--space-3) * 1.175);
|
|
14894
|
+
flex-shrink: 0;
|
|
14895
|
+
}
|
|
14896
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
|
|
14897
|
+
font-size: var(--font-size-2);
|
|
14898
|
+
line-height: var(--line-height-2);
|
|
14899
|
+
letter-spacing: var(--letter-spacing-2);
|
|
14900
|
+
border-radius: var(--radius-2);
|
|
14901
|
+
}
|
|
14902
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
|
|
14903
|
+
width: var(--space-4);
|
|
14904
|
+
height: var(--space-4);
|
|
14905
|
+
flex-shrink: 0;
|
|
14906
|
+
}
|
|
14907
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
|
|
14908
|
+
width: calc(10px * var(--scaling));
|
|
14909
|
+
height: calc(10px * var(--scaling));
|
|
14910
|
+
flex-shrink: 0;
|
|
14911
|
+
margin-left: auto;
|
|
14912
|
+
}
|
|
14913
|
+
.rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
|
|
14914
|
+
font-size: var(--font-size-2);
|
|
14915
|
+
line-height: var(--line-height-2);
|
|
14916
|
+
letter-spacing: var(--letter-spacing-2);
|
|
14917
|
+
}
|
|
14918
|
+
.rt-SidebarContainer:where(.sm\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
|
|
14919
|
+
font-size: var(--font-size-2);
|
|
14920
|
+
line-height: var(--line-height-2);
|
|
14921
|
+
letter-spacing: var(--letter-spacing-2);
|
|
14922
|
+
border-radius: var(--radius-2);
|
|
14923
|
+
}
|
|
14924
|
+
.rt-SidebarContainer:where(.sm\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
|
|
14925
|
+
width: var(--space-4);
|
|
14926
|
+
height: var(--space-4);
|
|
14927
|
+
flex-shrink: 0;
|
|
14928
|
+
}
|
|
14929
|
+
.rt-SidebarContainer:where(.sm\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
|
|
14930
|
+
font-size: var(--font-size-2);
|
|
14931
|
+
line-height: var(--line-height-2);
|
|
14932
|
+
letter-spacing: var(--letter-spacing-2);
|
|
14933
|
+
border-radius: var(--radius-2);
|
|
14934
|
+
}
|
|
14935
|
+
.rt-SidebarContainer:where(.sm\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
|
|
14936
|
+
width: var(--space-4);
|
|
14937
|
+
height: var(--space-4);
|
|
14938
|
+
flex-shrink: 0;
|
|
14939
|
+
}
|
|
14940
|
+
}
|
|
14941
|
+
@media (min-width: 1024px) {
|
|
14942
|
+
.rt-SidebarContainer:where(.md\:rt-r-size-1) {
|
|
14943
|
+
--sidebar-base-padding: var(--space-3);
|
|
14944
|
+
--sidebar-base-border-radius: var(--radius-4);
|
|
14945
|
+
--sidebar-content-padding: var(--space-1);
|
|
14946
|
+
--sidebar-item-padding-left: var(--space-2);
|
|
14947
|
+
--sidebar-item-padding-right: var(--space-2);
|
|
14948
|
+
--sidebar-item-padding-y: calc(var(--space-1) * 0.75);
|
|
14949
|
+
--sidebar-item-height: var(--space-5);
|
|
14950
|
+
}
|
|
14951
|
+
.rt-SidebarContainer:where(.md\:rt-r-size-2) {
|
|
14952
|
+
--sidebar-base-padding: var(--space-4);
|
|
14953
|
+
--sidebar-base-border-radius: var(--radius-4);
|
|
14954
|
+
--sidebar-content-padding: var(--space-2);
|
|
14955
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
14956
|
+
--sidebar-item-padding-right: var(--space-3);
|
|
14957
|
+
--sidebar-item-padding-y: var(--space-1);
|
|
14958
|
+
--sidebar-item-height: var(--space-6);
|
|
14959
|
+
}
|
|
14960
|
+
.rt-SidebarContent:where(.md\:rt-r-size-1) {
|
|
14961
|
+
--sidebar-content-padding: var(--space-1);
|
|
14962
|
+
--sidebar-item-padding-left: calc(var(--space-5) / 1.2);
|
|
14963
|
+
--sidebar-item-padding-right: var(--space-2);
|
|
14964
|
+
--sidebar-item-padding-y: calc(var(--space-1) * 0.75);
|
|
14965
|
+
--sidebar-item-height: var(--space-5);
|
|
14966
|
+
border-radius: var(--radius-3);
|
|
14967
|
+
}
|
|
14968
|
+
.rt-SidebarContent:where(.md\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
|
|
14969
|
+
--sidebar-item-padding-left: var(--space-2);
|
|
14970
|
+
}
|
|
14971
|
+
.rt-SidebarContent:where(.md\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
|
|
14972
|
+
--sidebar-item-padding-left: calc(var(--space-5) / 1.2);
|
|
14973
|
+
}
|
|
14974
|
+
.rt-SidebarContent:where(.md\:rt-r-size-2) {
|
|
14975
|
+
--sidebar-content-padding: var(--space-2);
|
|
14976
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
14977
|
+
--sidebar-item-padding-right: var(--space-3);
|
|
14978
|
+
--sidebar-item-padding-y: var(--space-1);
|
|
14979
|
+
--sidebar-item-height: var(--space-6);
|
|
14980
|
+
border-radius: var(--radius-4);
|
|
14981
|
+
}
|
|
14982
|
+
.rt-SidebarContent:where(.md\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
|
|
14983
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
14984
|
+
}
|
|
14985
|
+
.rt-SidebarContent:where(.md\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
|
|
14986
|
+
--sidebar-item-padding-left: var(--space-5);
|
|
14987
|
+
}
|
|
14988
|
+
.rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
|
|
14989
|
+
font-size: var(--font-size-1);
|
|
14990
|
+
line-height: var(--line-height-1);
|
|
14991
|
+
letter-spacing: var(--letter-spacing-1);
|
|
14992
|
+
border-radius: var(--radius-1);
|
|
14993
|
+
}
|
|
14994
|
+
.rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
|
|
14995
|
+
width: calc(var(--space-3) * 1.175);
|
|
14996
|
+
height: calc(var(--space-3) * 1.175);
|
|
14997
|
+
flex-shrink: 0;
|
|
14998
|
+
}
|
|
14999
|
+
.rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
|
|
15000
|
+
width: calc(8px * var(--scaling));
|
|
15001
|
+
height: calc(8px * var(--scaling));
|
|
15002
|
+
flex-shrink: 0;
|
|
15003
|
+
margin-left: auto;
|
|
15004
|
+
}
|
|
15005
|
+
.rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
|
|
15006
|
+
font-size: var(--font-size-1);
|
|
15007
|
+
line-height: var(--line-height-1);
|
|
15008
|
+
letter-spacing: var(--letter-spacing-1);
|
|
15009
|
+
}
|
|
15010
|
+
.rt-SidebarContainer:where(.md\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
|
|
15011
|
+
font-size: var(--font-size-1);
|
|
15012
|
+
line-height: var(--line-height-1);
|
|
15013
|
+
letter-spacing: var(--letter-spacing-1);
|
|
15014
|
+
border-radius: var(--radius-1);
|
|
15015
|
+
}
|
|
15016
|
+
.rt-SidebarContainer:where(.md\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
|
|
15017
|
+
width: calc(var(--space-3) * 1.175);
|
|
15018
|
+
height: calc(var(--space-3) * 1.175);
|
|
15019
|
+
flex-shrink: 0;
|
|
15020
|
+
}
|
|
15021
|
+
.rt-SidebarContainer:where(.md\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
|
|
15022
|
+
font-size: var(--font-size-1);
|
|
15023
|
+
line-height: var(--line-height-1);
|
|
15024
|
+
letter-spacing: var(--letter-spacing-1);
|
|
15025
|
+
border-radius: var(--radius-1);
|
|
15026
|
+
}
|
|
15027
|
+
.rt-SidebarContainer:where(.md\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
|
|
15028
|
+
width: calc(var(--space-3) * 1.175);
|
|
15029
|
+
height: calc(var(--space-3) * 1.175);
|
|
15030
|
+
flex-shrink: 0;
|
|
15031
|
+
}
|
|
15032
|
+
.rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
|
|
15033
|
+
font-size: var(--font-size-2);
|
|
15034
|
+
line-height: var(--line-height-2);
|
|
15035
|
+
letter-spacing: var(--letter-spacing-2);
|
|
15036
|
+
border-radius: var(--radius-2);
|
|
15037
|
+
}
|
|
15038
|
+
.rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
|
|
15039
|
+
width: var(--space-4);
|
|
15040
|
+
height: var(--space-4);
|
|
15041
|
+
flex-shrink: 0;
|
|
15042
|
+
}
|
|
15043
|
+
.rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
|
|
15044
|
+
width: calc(10px * var(--scaling));
|
|
15045
|
+
height: calc(10px * var(--scaling));
|
|
15046
|
+
flex-shrink: 0;
|
|
15047
|
+
margin-left: auto;
|
|
15048
|
+
}
|
|
15049
|
+
.rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
|
|
15050
|
+
font-size: var(--font-size-2);
|
|
15051
|
+
line-height: var(--line-height-2);
|
|
15052
|
+
letter-spacing: var(--letter-spacing-2);
|
|
15053
|
+
}
|
|
15054
|
+
.rt-SidebarContainer:where(.md\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
|
|
15055
|
+
font-size: var(--font-size-2);
|
|
15056
|
+
line-height: var(--line-height-2);
|
|
15057
|
+
letter-spacing: var(--letter-spacing-2);
|
|
15058
|
+
border-radius: var(--radius-2);
|
|
15059
|
+
}
|
|
15060
|
+
.rt-SidebarContainer:where(.md\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
|
|
15061
|
+
width: var(--space-4);
|
|
15062
|
+
height: var(--space-4);
|
|
15063
|
+
flex-shrink: 0;
|
|
15064
|
+
}
|
|
15065
|
+
.rt-SidebarContainer:where(.md\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
|
|
15066
|
+
font-size: var(--font-size-2);
|
|
15067
|
+
line-height: var(--line-height-2);
|
|
15068
|
+
letter-spacing: var(--letter-spacing-2);
|
|
15069
|
+
border-radius: var(--radius-2);
|
|
15070
|
+
}
|
|
15071
|
+
.rt-SidebarContainer:where(.md\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
|
|
15072
|
+
width: var(--space-4);
|
|
15073
|
+
height: var(--space-4);
|
|
15074
|
+
flex-shrink: 0;
|
|
15075
|
+
}
|
|
15076
|
+
}
|
|
15077
|
+
@media (min-width: 1280px) {
|
|
15078
|
+
.rt-SidebarContainer:where(.lg\:rt-r-size-1) {
|
|
15079
|
+
--sidebar-base-padding: var(--space-3);
|
|
15080
|
+
--sidebar-base-border-radius: var(--radius-4);
|
|
15081
|
+
--sidebar-content-padding: var(--space-1);
|
|
15082
|
+
--sidebar-item-padding-left: var(--space-2);
|
|
15083
|
+
--sidebar-item-padding-right: var(--space-2);
|
|
15084
|
+
--sidebar-item-padding-y: calc(var(--space-1) * 0.75);
|
|
15085
|
+
--sidebar-item-height: var(--space-5);
|
|
15086
|
+
}
|
|
15087
|
+
.rt-SidebarContainer:where(.lg\:rt-r-size-2) {
|
|
15088
|
+
--sidebar-base-padding: var(--space-4);
|
|
15089
|
+
--sidebar-base-border-radius: var(--radius-4);
|
|
15090
|
+
--sidebar-content-padding: var(--space-2);
|
|
15091
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
15092
|
+
--sidebar-item-padding-right: var(--space-3);
|
|
15093
|
+
--sidebar-item-padding-y: var(--space-1);
|
|
15094
|
+
--sidebar-item-height: var(--space-6);
|
|
15095
|
+
}
|
|
15096
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-1) {
|
|
15097
|
+
--sidebar-content-padding: var(--space-1);
|
|
15098
|
+
--sidebar-item-padding-left: calc(var(--space-5) / 1.2);
|
|
15099
|
+
--sidebar-item-padding-right: var(--space-2);
|
|
15100
|
+
--sidebar-item-padding-y: calc(var(--space-1) * 0.75);
|
|
15101
|
+
--sidebar-item-height: var(--space-5);
|
|
15102
|
+
border-radius: var(--radius-3);
|
|
15103
|
+
}
|
|
15104
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
|
|
15105
|
+
--sidebar-item-padding-left: var(--space-2);
|
|
15106
|
+
}
|
|
15107
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
|
|
15108
|
+
--sidebar-item-padding-left: calc(var(--space-5) / 1.2);
|
|
15109
|
+
}
|
|
15110
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-2) {
|
|
15111
|
+
--sidebar-content-padding: var(--space-2);
|
|
15112
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
15113
|
+
--sidebar-item-padding-right: var(--space-3);
|
|
15114
|
+
--sidebar-item-padding-y: var(--space-1);
|
|
15115
|
+
--sidebar-item-height: var(--space-6);
|
|
15116
|
+
border-radius: var(--radius-4);
|
|
15117
|
+
}
|
|
15118
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
|
|
15119
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
15120
|
+
}
|
|
15121
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
|
|
15122
|
+
--sidebar-item-padding-left: var(--space-5);
|
|
15123
|
+
}
|
|
15124
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
|
|
15125
|
+
font-size: var(--font-size-1);
|
|
15126
|
+
line-height: var(--line-height-1);
|
|
15127
|
+
letter-spacing: var(--letter-spacing-1);
|
|
15128
|
+
border-radius: var(--radius-1);
|
|
15129
|
+
}
|
|
15130
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
|
|
15131
|
+
width: calc(var(--space-3) * 1.175);
|
|
15132
|
+
height: calc(var(--space-3) * 1.175);
|
|
15133
|
+
flex-shrink: 0;
|
|
15134
|
+
}
|
|
15135
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
|
|
15136
|
+
width: calc(8px * var(--scaling));
|
|
15137
|
+
height: calc(8px * var(--scaling));
|
|
15138
|
+
flex-shrink: 0;
|
|
15139
|
+
margin-left: auto;
|
|
15140
|
+
}
|
|
15141
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
|
|
15142
|
+
font-size: var(--font-size-1);
|
|
15143
|
+
line-height: var(--line-height-1);
|
|
15144
|
+
letter-spacing: var(--letter-spacing-1);
|
|
15145
|
+
}
|
|
15146
|
+
.rt-SidebarContainer:where(.lg\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
|
|
15147
|
+
font-size: var(--font-size-1);
|
|
15148
|
+
line-height: var(--line-height-1);
|
|
15149
|
+
letter-spacing: var(--letter-spacing-1);
|
|
15150
|
+
border-radius: var(--radius-1);
|
|
15151
|
+
}
|
|
15152
|
+
.rt-SidebarContainer:where(.lg\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
|
|
15153
|
+
width: calc(var(--space-3) * 1.175);
|
|
15154
|
+
height: calc(var(--space-3) * 1.175);
|
|
15155
|
+
flex-shrink: 0;
|
|
15156
|
+
}
|
|
15157
|
+
.rt-SidebarContainer:where(.lg\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
|
|
15158
|
+
font-size: var(--font-size-1);
|
|
15159
|
+
line-height: var(--line-height-1);
|
|
15160
|
+
letter-spacing: var(--letter-spacing-1);
|
|
15161
|
+
border-radius: var(--radius-1);
|
|
15162
|
+
}
|
|
15163
|
+
.rt-SidebarContainer:where(.lg\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
|
|
15164
|
+
width: calc(var(--space-3) * 1.175);
|
|
15165
|
+
height: calc(var(--space-3) * 1.175);
|
|
15166
|
+
flex-shrink: 0;
|
|
15167
|
+
}
|
|
15168
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
|
|
15169
|
+
font-size: var(--font-size-2);
|
|
15170
|
+
line-height: var(--line-height-2);
|
|
15171
|
+
letter-spacing: var(--letter-spacing-2);
|
|
15172
|
+
border-radius: var(--radius-2);
|
|
15173
|
+
}
|
|
15174
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
|
|
15175
|
+
width: var(--space-4);
|
|
15176
|
+
height: var(--space-4);
|
|
15177
|
+
flex-shrink: 0;
|
|
15178
|
+
}
|
|
15179
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
|
|
15180
|
+
width: calc(10px * var(--scaling));
|
|
15181
|
+
height: calc(10px * var(--scaling));
|
|
15182
|
+
flex-shrink: 0;
|
|
15183
|
+
margin-left: auto;
|
|
15184
|
+
}
|
|
15185
|
+
.rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
|
|
15186
|
+
font-size: var(--font-size-2);
|
|
15187
|
+
line-height: var(--line-height-2);
|
|
15188
|
+
letter-spacing: var(--letter-spacing-2);
|
|
15189
|
+
}
|
|
15190
|
+
.rt-SidebarContainer:where(.lg\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
|
|
15191
|
+
font-size: var(--font-size-2);
|
|
15192
|
+
line-height: var(--line-height-2);
|
|
15193
|
+
letter-spacing: var(--letter-spacing-2);
|
|
15194
|
+
border-radius: var(--radius-2);
|
|
15195
|
+
}
|
|
15196
|
+
.rt-SidebarContainer:where(.lg\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
|
|
15197
|
+
width: var(--space-4);
|
|
15198
|
+
height: var(--space-4);
|
|
15199
|
+
flex-shrink: 0;
|
|
15200
|
+
}
|
|
15201
|
+
.rt-SidebarContainer:where(.lg\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
|
|
15202
|
+
font-size: var(--font-size-2);
|
|
15203
|
+
line-height: var(--line-height-2);
|
|
15204
|
+
letter-spacing: var(--letter-spacing-2);
|
|
15205
|
+
border-radius: var(--radius-2);
|
|
15206
|
+
}
|
|
15207
|
+
.rt-SidebarContainer:where(.lg\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
|
|
15208
|
+
width: var(--space-4);
|
|
15209
|
+
height: var(--space-4);
|
|
15210
|
+
flex-shrink: 0;
|
|
15211
|
+
}
|
|
15212
|
+
}
|
|
15213
|
+
@media (min-width: 1640px) {
|
|
15214
|
+
.rt-SidebarContainer:where(.xl\:rt-r-size-1) {
|
|
15215
|
+
--sidebar-base-padding: var(--space-3);
|
|
15216
|
+
--sidebar-base-border-radius: var(--radius-4);
|
|
15217
|
+
--sidebar-content-padding: var(--space-1);
|
|
15218
|
+
--sidebar-item-padding-left: var(--space-2);
|
|
15219
|
+
--sidebar-item-padding-right: var(--space-2);
|
|
15220
|
+
--sidebar-item-padding-y: calc(var(--space-1) * 0.75);
|
|
15221
|
+
--sidebar-item-height: var(--space-5);
|
|
15222
|
+
}
|
|
15223
|
+
.rt-SidebarContainer:where(.xl\:rt-r-size-2) {
|
|
15224
|
+
--sidebar-base-padding: var(--space-4);
|
|
15225
|
+
--sidebar-base-border-radius: var(--radius-4);
|
|
15226
|
+
--sidebar-content-padding: var(--space-2);
|
|
15227
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
15228
|
+
--sidebar-item-padding-right: var(--space-3);
|
|
15229
|
+
--sidebar-item-padding-y: var(--space-1);
|
|
15230
|
+
--sidebar-item-height: var(--space-6);
|
|
15231
|
+
}
|
|
15232
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-1) {
|
|
15233
|
+
--sidebar-content-padding: var(--space-1);
|
|
15234
|
+
--sidebar-item-padding-left: calc(var(--space-5) / 1.2);
|
|
15235
|
+
--sidebar-item-padding-right: var(--space-2);
|
|
15236
|
+
--sidebar-item-padding-y: calc(var(--space-1) * 0.75);
|
|
15237
|
+
--sidebar-item-height: var(--space-5);
|
|
15238
|
+
border-radius: var(--radius-3);
|
|
15239
|
+
}
|
|
15240
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
|
|
15241
|
+
--sidebar-item-padding-left: var(--space-2);
|
|
15242
|
+
}
|
|
15243
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
|
|
15244
|
+
--sidebar-item-padding-left: calc(var(--space-5) / 1.2);
|
|
15245
|
+
}
|
|
15246
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-2) {
|
|
15247
|
+
--sidebar-content-padding: var(--space-2);
|
|
15248
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
15249
|
+
--sidebar-item-padding-right: var(--space-3);
|
|
15250
|
+
--sidebar-item-padding-y: var(--space-1);
|
|
15251
|
+
--sidebar-item-height: var(--space-6);
|
|
15252
|
+
border-radius: var(--radius-4);
|
|
15253
|
+
}
|
|
15254
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
|
|
15255
|
+
--sidebar-item-padding-left: var(--space-3);
|
|
15256
|
+
}
|
|
15257
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
|
|
15258
|
+
--sidebar-item-padding-left: var(--space-5);
|
|
15259
|
+
}
|
|
15260
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
|
|
15261
|
+
font-size: var(--font-size-1);
|
|
15262
|
+
line-height: var(--line-height-1);
|
|
15263
|
+
letter-spacing: var(--letter-spacing-1);
|
|
15264
|
+
border-radius: var(--radius-1);
|
|
15265
|
+
}
|
|
15266
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
|
|
15267
|
+
width: calc(var(--space-3) * 1.175);
|
|
15268
|
+
height: calc(var(--space-3) * 1.175);
|
|
15269
|
+
flex-shrink: 0;
|
|
15270
|
+
}
|
|
15271
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
|
|
15272
|
+
width: calc(8px * var(--scaling));
|
|
15273
|
+
height: calc(8px * var(--scaling));
|
|
15274
|
+
flex-shrink: 0;
|
|
15275
|
+
margin-left: auto;
|
|
15276
|
+
}
|
|
15277
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
|
|
15278
|
+
font-size: var(--font-size-1);
|
|
15279
|
+
line-height: var(--line-height-1);
|
|
15280
|
+
letter-spacing: var(--letter-spacing-1);
|
|
15281
|
+
}
|
|
15282
|
+
.rt-SidebarContainer:where(.xl\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
|
|
15283
|
+
font-size: var(--font-size-1);
|
|
15284
|
+
line-height: var(--line-height-1);
|
|
15285
|
+
letter-spacing: var(--letter-spacing-1);
|
|
15286
|
+
border-radius: var(--radius-1);
|
|
15287
|
+
}
|
|
15288
|
+
.rt-SidebarContainer:where(.xl\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
|
|
15289
|
+
width: calc(var(--space-3) * 1.175);
|
|
15290
|
+
height: calc(var(--space-3) * 1.175);
|
|
15291
|
+
flex-shrink: 0;
|
|
15292
|
+
}
|
|
15293
|
+
.rt-SidebarContainer:where(.xl\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
|
|
15294
|
+
font-size: var(--font-size-1);
|
|
15295
|
+
line-height: var(--line-height-1);
|
|
15296
|
+
letter-spacing: var(--letter-spacing-1);
|
|
15297
|
+
border-radius: var(--radius-1);
|
|
15298
|
+
}
|
|
15299
|
+
.rt-SidebarContainer:where(.xl\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
|
|
15300
|
+
width: calc(var(--space-3) * 1.175);
|
|
15301
|
+
height: calc(var(--space-3) * 1.175);
|
|
15302
|
+
flex-shrink: 0;
|
|
15303
|
+
}
|
|
15304
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
|
|
15305
|
+
font-size: var(--font-size-2);
|
|
15306
|
+
line-height: var(--line-height-2);
|
|
15307
|
+
letter-spacing: var(--letter-spacing-2);
|
|
15308
|
+
border-radius: var(--radius-2);
|
|
15309
|
+
}
|
|
15310
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
|
|
15311
|
+
width: var(--space-4);
|
|
15312
|
+
height: var(--space-4);
|
|
15313
|
+
flex-shrink: 0;
|
|
15314
|
+
}
|
|
15315
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
|
|
15316
|
+
width: calc(10px * var(--scaling));
|
|
15317
|
+
height: calc(10px * var(--scaling));
|
|
15318
|
+
flex-shrink: 0;
|
|
15319
|
+
margin-left: auto;
|
|
15320
|
+
}
|
|
15321
|
+
.rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
|
|
15322
|
+
font-size: var(--font-size-2);
|
|
15323
|
+
line-height: var(--line-height-2);
|
|
15324
|
+
letter-spacing: var(--letter-spacing-2);
|
|
15325
|
+
}
|
|
15326
|
+
.rt-SidebarContainer:where(.xl\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
|
|
15327
|
+
font-size: var(--font-size-2);
|
|
15328
|
+
line-height: var(--line-height-2);
|
|
15329
|
+
letter-spacing: var(--letter-spacing-2);
|
|
15330
|
+
border-radius: var(--radius-2);
|
|
15331
|
+
}
|
|
15332
|
+
.rt-SidebarContainer:where(.xl\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
|
|
15333
|
+
width: var(--space-4);
|
|
15334
|
+
height: var(--space-4);
|
|
15335
|
+
flex-shrink: 0;
|
|
15336
|
+
}
|
|
15337
|
+
.rt-SidebarContainer:where(.xl\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
|
|
15338
|
+
font-size: var(--font-size-2);
|
|
15339
|
+
line-height: var(--line-height-2);
|
|
15340
|
+
letter-spacing: var(--letter-spacing-2);
|
|
15341
|
+
border-radius: var(--radius-2);
|
|
15342
|
+
}
|
|
15343
|
+
.rt-SidebarContainer:where(.xl\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
|
|
15344
|
+
width: var(--space-4);
|
|
15345
|
+
height: var(--space-4);
|
|
15346
|
+
flex-shrink: 0;
|
|
15347
|
+
}
|
|
15348
|
+
}
|
|
15349
|
+
.rt-SidebarContainer:where(.rt-variant-ghost) {
|
|
15350
|
+
background-color: transparent;
|
|
15351
|
+
border: none;
|
|
15352
|
+
}
|
|
15353
|
+
.rt-SidebarContainer:where(.rt-variant-soft) {
|
|
15354
|
+
background-color: var(--accent-a2);
|
|
15355
|
+
}
|
|
15356
|
+
.rt-SidebarContainer:where(.rt-variant-surface) {
|
|
15357
|
+
background-color: var(--color-surface);
|
|
15358
|
+
}
|
|
15359
|
+
.rt-SidebarContainer:where(.rt-variant-surface):where([data-side="left"]) {
|
|
15360
|
+
border-right: 1px solid var(--gray-a6);
|
|
15361
|
+
}
|
|
15362
|
+
.rt-SidebarContainer:where(.rt-variant-surface):where([data-side="right"]) {
|
|
15363
|
+
border-left: 1px solid var(--gray-a6);
|
|
15364
|
+
}
|
|
15365
|
+
:where(.rt-SidebarRoot[data-type="floating"]) .rt-SidebarContainer:where(.rt-variant-ghost) {
|
|
15366
|
+
box-shadow: var(--shadow-4);
|
|
15367
|
+
}
|
|
15368
|
+
:where(.rt-SidebarRoot[data-type="floating"]) .rt-SidebarContainer:where(.rt-variant-surface) {
|
|
15369
|
+
border: 1px solid var(--gray-a6);
|
|
15370
|
+
}
|
|
15371
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]), .rt-SidebarContent:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]), .rt-SidebarFooter:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) {
|
|
15372
|
+
background-color: var(--accent-9);
|
|
15373
|
+
color: var(--accent-contrast);
|
|
15374
|
+
}
|
|
15375
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text), .rt-SidebarContent:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text), .rt-SidebarFooter:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text) {
|
|
15376
|
+
color: inherit !important;
|
|
15377
|
+
}
|
|
15378
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) :where([data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) :where([data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) :where([data-accent-color='gray']) {
|
|
15379
|
+
color: inherit !important;
|
|
15380
|
+
}
|
|
15381
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]), .rt-SidebarContent:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]), .rt-SidebarFooter:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) {
|
|
15382
|
+
background-color: var(--accent-9);
|
|
15383
|
+
color: var(--accent-contrast);
|
|
15384
|
+
}
|
|
15385
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text), .rt-SidebarContent:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text), .rt-SidebarFooter:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text) {
|
|
15386
|
+
color: inherit !important;
|
|
15387
|
+
}
|
|
15388
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) :where([data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) :where([data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) :where([data-accent-color='gray']) {
|
|
15389
|
+
color: inherit !important;
|
|
15390
|
+
}
|
|
15391
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]),
|
|
15392
|
+
.rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]),
|
|
15393
|
+
.rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]),
|
|
15394
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]),
|
|
15395
|
+
.rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]),
|
|
15396
|
+
.rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) {
|
|
15397
|
+
background-color: var(--accent-12);
|
|
15398
|
+
color: var(--accent-1);
|
|
15399
|
+
}
|
|
15400
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text), .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text) {
|
|
15401
|
+
color: inherit !important;
|
|
15402
|
+
}
|
|
15403
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]) :where([data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]) :where([data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]) :where([data-accent-color='gray']), .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) :where([data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) :where([data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) :where([data-accent-color='gray']) {
|
|
15404
|
+
color: inherit !important;
|
|
15405
|
+
}
|
|
15406
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]), .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) {
|
|
15407
|
+
background-color: var(--accent-9);
|
|
15408
|
+
color: var(--accent-contrast);
|
|
15409
|
+
}
|
|
15410
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]) :where(.rt-Text), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]) :where(.rt-Text), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]) :where(.rt-Text), .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) :where(.rt-Text), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) :where(.rt-Text), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) :where(.rt-Text) {
|
|
15411
|
+
color: inherit !important;
|
|
15412
|
+
}
|
|
15413
|
+
.rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]) :where([data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]) :where([data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]) :where([data-accent-color='gray']), .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) :where([data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) :where([data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) :where([data-accent-color='gray']) {
|
|
15414
|
+
color: inherit !important;
|
|
15415
|
+
}
|
|
15416
|
+
.rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]), .rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]), .rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]) {
|
|
15417
|
+
background-color: var(--accent-a4);
|
|
15418
|
+
color: var(--accent-a12);
|
|
15419
|
+
}
|
|
15420
|
+
.rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']) {
|
|
15421
|
+
color: var(--gray-11) !important;
|
|
15422
|
+
}
|
|
15423
|
+
.rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted]), .rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted]), .rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted]) {
|
|
15424
|
+
background-color: var(--accent-a4);
|
|
15425
|
+
}
|
|
15426
|
+
.rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']) {
|
|
15427
|
+
color: var(--gray-11) !important;
|
|
15428
|
+
}
|
|
15429
|
+
.rt-SidebarContent :where(.rt-BaseMenuItem) {
|
|
15430
|
+
border-radius: var(--radius-2);
|
|
15431
|
+
margin-bottom: var(--space-1);
|
|
15432
|
+
}
|
|
15433
|
+
.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) {
|
|
15434
|
+
transform: translateX(-100%);
|
|
15435
|
+
transition: transform var(--duration-3) var(--ease-2);
|
|
15436
|
+
}
|
|
15437
|
+
.rt-SidebarRoot:where([data-collapsible="icon"][data-state="expanded"]) {
|
|
15438
|
+
transform: translateX(0);
|
|
15439
|
+
transition: transform var(--duration-3) var(--ease-2);
|
|
15440
|
+
}
|
|
15441
|
+
.rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"][data-side="right"]) {
|
|
15442
|
+
transform: translateX(100%);
|
|
15443
|
+
}
|
|
15444
|
+
@media (prefers-reduced-motion: reduce) {
|
|
15445
|
+
.rt-SidebarRoot:where([data-collapsible="icon"]) {
|
|
15446
|
+
transition: none;
|
|
15447
|
+
}
|
|
15448
|
+
}
|
|
15449
|
+
@media (max-width: 768px) {
|
|
15450
|
+
.rt-SidebarRoot {
|
|
15451
|
+
display: none;
|
|
14262
15452
|
}
|
|
14263
15453
|
}
|
|
14264
15454
|
.rt-SliderRoot {
|