@blinkk/root-cms 1.0.0-beta.5 → 1.0.0-beta.51

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/dist/ui/ui.css CHANGED
@@ -1,50 +1,268 @@
1
- /* ui/components/SplitPanel/SplitPanel.css */
2
- .SplitPanel {
1
+ /* ui/components/Text/Text.css */
2
+ .text {
3
+ font-size: 14px;
4
+ line-height: 1.5;
5
+ font-weight: 400;
6
+ color: var(--color-text-default);
7
+ }
8
+ .text.size\:body-sm {
9
+ font-size: 12px;
10
+ }
11
+ .text.size\:body {
12
+ font-size: 14px;
13
+ }
14
+ .text.size\:body-lg {
15
+ font-size: 16px;
16
+ }
17
+ .text.weight\:regular {
18
+ font-weight: 400;
19
+ }
20
+ .text.weight\:semi-bold {
21
+ font-weight: 500;
22
+ }
23
+ .text.weight\:bold {
24
+ font-weight: 700;
25
+ }
26
+ .text.color\:gray {
27
+ color: var(--color-text-gray);
28
+ }
29
+ .text.color\:dark {
30
+ color: var(--color-text-dark);
31
+ }
32
+ .text code {
33
+ background: #efefef;
34
+ padding: 4px 8px;
35
+ border-radius: 2px;
36
+ white-space: nowrap;
37
+ font-family: var(--font-family-mono);
38
+ font-weight: 600;
39
+ margin-left: 4px;
40
+ margin-right: 4px;
41
+ }
42
+
43
+ /* ui/components/SlugInput/SlugInput.css */
44
+ .SlugInput__inputs {
3
45
  display: flex;
4
- height: 100%;
46
+ gap: 8px;
47
+ align-items: center;
5
48
  }
6
- .SplitPanel__divider {
7
- flex: 0 0 3px;
8
- width: 3px;
9
- height: 100%;
10
- cursor: col-resize;
11
- position: relative;
49
+ .SlugInput__slug {
50
+ flex: 1;
12
51
  }
13
- .SplitPanel__divider::before {
14
- content: "";
15
- display: block;
16
- z-index: 0;
17
- position: absolute;
18
- top: 0;
19
- height: 100%;
20
- left: 1px;
21
- width: 1px;
22
- background-color: var(--color-border);
52
+ .SlugInput__urlHelp {
53
+ margin-top: 8px;
23
54
  }
24
- .SplitPanel__divider::after {
25
- content: "";
26
- display: block;
27
- z-index: 1;
28
- position: absolute;
29
- top: 0;
55
+ .SlugInput__urlHelp::before {
56
+ content: "URL: ";
57
+ }
58
+
59
+ /* ui/components/CopyDocModal/CopyDocModal.css */
60
+ .CopyDocModal__from__label,
61
+ .CopyDocModal__to__label {
62
+ margin-bottom: 8px;
63
+ }
64
+ .CopyDocModal__from__value code {
65
+ margin-left: 0;
66
+ }
67
+ .CopyDocModal__to {
68
+ margin-top: 16px;
69
+ }
70
+ .CopyDocModal__error {
71
+ margin: 24px 0;
72
+ font-size: 14px;
73
+ color: red;
74
+ font-weight: 600;
75
+ }
76
+ .CopyDocModal__buttons {
77
+ margin-top: 24px;
78
+ display: flex;
79
+ justify-content: flex-end;
80
+ gap: 12px;
81
+ }
82
+
83
+ /* ui/components/EditJsonModal/EditJsonModal.css */
84
+ .EditJsonModal__buttons {
85
+ margin-top: 24px;
86
+ display: flex;
87
+ justify-content: flex-end;
88
+ gap: 12px;
89
+ }
90
+
91
+ /* ui/components/Heading/Heading.css */
92
+ .heading {
93
+ font-size: 18px;
94
+ line-height: 1.2;
95
+ font-weight: 700;
96
+ margin-top: 0;
97
+ margin-bottom: 0;
98
+ }
99
+ .heading.size\:h1 {
100
+ font-size: 24px;
101
+ }
102
+ .heading.size\:h2 {
103
+ font-size: 18px;
104
+ }
105
+ .heading.size\:h3 {
106
+ font-size: 16px;
107
+ }
108
+ .heading.size\:h4 {
109
+ font-size: 14px;
110
+ }
111
+ .heading.weight\:regular {
112
+ font-weight: 400;
113
+ }
114
+ .heading.weight\:semi-bold {
115
+ font-weight: 500;
116
+ }
117
+ .heading.weight\:bold {
118
+ font-weight: 700;
119
+ }
120
+ .heading.color\:gray {
121
+ color: var(--color-text-gray);
122
+ }
123
+ .heading.color\:dark {
124
+ color: var(--color-text-dark);
125
+ }
126
+
127
+ /* ui/components/LocalizationModal/LocalizationModal.css */
128
+ .LocalizationModal .mantine-Modal-modal {
129
+ padding: 30px 40px;
130
+ }
131
+ .LocalizationModal__layout {
132
+ display: grid;
133
+ grid-template-columns: 400px 1fr;
134
+ margin-top: -20px;
135
+ margin-bottom: 20px;
136
+ }
137
+ .LocalizationModal__iconTitle {
138
+ display: flex;
139
+ align-items: center;
140
+ gap: 8px;
141
+ }
142
+ .LocalizationModal__locales,
143
+ .LocalizationModal__translations {
30
144
  height: 100%;
31
- left: 0;
32
- width: 100%;
33
- background-color: transparent;
34
- transition: background-color 0.18s ease;
145
+ min-height: 400px;
146
+ padding-top: 30px;
147
+ padding-bottom: 30px;
148
+ }
149
+ .LocalizationModal__locales {
150
+ padding-right: 30px;
151
+ }
152
+ .LocalizationModal__translations {
153
+ border-left: 1px solid var(--color-border);
154
+ padding-left: 30px;
155
+ margin-right: -30px;
156
+ padding-right: 30px;
157
+ max-height: 80vh;
158
+ overflow: auto;
35
159
  }
36
- .SplitPanel__divider:hover::after {
37
- background-color: lightblue;
160
+ .LocalizationModal__translations__header {
161
+ display: flex;
162
+ justify-content: space-between;
163
+ margin-bottom: 30px;
38
164
  }
39
- .SplitPanel__item.static {
40
- flex: 0 0 var(--panel-size, 100%);
165
+ .LocalizationModal__translations__header__buttons {
166
+ display: flex;
167
+ gap: 8px;
41
168
  }
42
- .SplitPanel__item.fluid {
43
- flex: 1;
169
+ .LocalizationModal__translations__table {
170
+ display: flex;
171
+ flex-direction: column;
44
172
  }
45
- .SplitPanel.dragging .SplitPanel__item {
46
- pointer-events: none;
47
- user-select: none;
173
+ .LocalizationModal__translations__table__row {
174
+ display: grid;
175
+ grid-template-columns: 1fr 1fr;
176
+ }
177
+ .LocalizationModal__translations__table__row--header {
178
+ align-items: center;
179
+ }
180
+ .LocalizationModal__translations__table__row + .LocalizationModal__translations__table__row {
181
+ border-top: 1px solid var(--color-border);
182
+ padding-top: 12px;
183
+ margin-top: 12px;
184
+ }
185
+ .LocalizationModal__translations__table__header,
186
+ .LocalizationModal__translations__table__col {
187
+ padding-left: 8px;
188
+ padding-right: 8px;
189
+ text-align: left;
190
+ }
191
+ .LocalizationModal__translations__localeSelect {
192
+ display: flex;
193
+ gap: 8px;
194
+ align-items: center;
195
+ }
196
+
197
+ /* ui/components/PublishDocModal/PublishDocModal.css */
198
+ .PublishDocModal .mantine-Modal-title {
199
+ font-size: 14px;
200
+ font-weight: 500;
201
+ }
202
+ .PublishDocModal__content {
203
+ font-size: 12px;
204
+ line-height: 1.5;
205
+ font-weight: 500;
206
+ }
207
+ .PublishDocModal__form__publishOptions__label {
208
+ margin-bottom: 8px;
209
+ }
210
+ .PublishDocModal__form__publishOptions__options {
211
+ display: grid;
212
+ grid-template-columns: 1fr 1fr;
213
+ gap: 12px;
214
+ }
215
+ .PublishDocModal__form__publishOptions__option {
216
+ border: 1px solid var(--color-border);
217
+ padding: 24px 16px;
218
+ border-radius: 4px;
219
+ cursor: pointer;
220
+ opacity: 1;
221
+ transition: all 0.3s ease;
222
+ }
223
+ .PublishDocModal__form__publishOptions__option--unselected {
224
+ opacity: 0.4;
225
+ }
226
+ .PublishDocModal__form__publishOptions__option--unselected:hover {
227
+ opacity: 0.6;
228
+ }
229
+ .PublishDocModal__form__publishOptions__option--selected {
230
+ border-color: #339af0;
231
+ }
232
+ .PublishDocModal__form__publishOptions__option__help {
233
+ padding-left: 24px;
234
+ font-size: 10px;
235
+ font-weight: 400;
236
+ margin-top: 4px;
237
+ }
238
+ .PublishDocModal__form__publishOptions__option__input {
239
+ display: flex;
240
+ align-items: center;
241
+ gap: 4px;
242
+ }
243
+ .PublishDocModal__form__publishOptions__option__input2 {
244
+ padding-left: 20px;
245
+ }
246
+ .PublishDocModal__form__publishOptions__option__input2 input {
247
+ margin-top: 16px;
248
+ display: block;
249
+ width: 100%;
250
+ border: 1px solid #dedede;
251
+ padding: 6px 8px;
252
+ font-family: inherit;
253
+ font-size: 12px;
254
+ }
255
+ .PublishDocModal__form__publishOptions__option__input2__help {
256
+ font-size: 10px;
257
+ font-weight: 400;
258
+ margin-top: 4px;
259
+ text-align: right;
260
+ }
261
+ .PublishDocModal__form__buttons {
262
+ margin-top: 24px;
263
+ display: flex;
264
+ justify-content: flex-end;
265
+ gap: 12px;
48
266
  }
49
267
 
50
268
  /* ui/layout/Layout.css */
@@ -145,6 +363,18 @@
145
363
  grid-area: bottom;
146
364
  }
147
365
 
366
+ /* ui/pages/AssetsPage/AssetsPage.css */
367
+ .AssetsPage {
368
+ padding: 60px;
369
+ }
370
+ .AssetsPage h1 {
371
+ margin-bottom: 24px;
372
+ }
373
+ .AssetsPage p {
374
+ margin-top: 16px;
375
+ max-width: 70ch;
376
+ }
377
+
148
378
  /* ui/components/NewDocModal/NewDocModal.css */
149
379
  .NewDocModal__body {
150
380
  font-size: 12px;
@@ -161,6 +391,59 @@
161
391
  gap: 12px;
162
392
  }
163
393
 
394
+ /* ui/components/SplitPanel/SplitPanel.css */
395
+ .SplitPanel {
396
+ display: flex;
397
+ height: 100%;
398
+ }
399
+ .SplitPanel__divider {
400
+ flex: 0 0 3px;
401
+ width: 3px;
402
+ height: 100%;
403
+ cursor: col-resize;
404
+ position: relative;
405
+ }
406
+ .SplitPanel__divider::before {
407
+ content: "";
408
+ display: block;
409
+ z-index: 0;
410
+ position: absolute;
411
+ top: 0;
412
+ height: 100%;
413
+ left: 1px;
414
+ width: 1px;
415
+ background-color: var(--color-border);
416
+ }
417
+ .SplitPanel__divider::after {
418
+ content: "";
419
+ display: block;
420
+ z-index: 1;
421
+ position: absolute;
422
+ top: 0;
423
+ height: 100%;
424
+ left: 0;
425
+ width: 100%;
426
+ background-color: transparent;
427
+ transition: background-color 0.18s ease;
428
+ }
429
+ .SplitPanel__divider:hover::after {
430
+ background-color: lightblue;
431
+ }
432
+ .SplitPanel__item {
433
+ overflow: hidden;
434
+ position: relative;
435
+ }
436
+ .SplitPanel__item.static {
437
+ flex: 0 0 var(--panel-size, 100%);
438
+ }
439
+ .SplitPanel__item.fluid {
440
+ flex: 1;
441
+ }
442
+ .SplitPanel.dragging .SplitPanel__item {
443
+ pointer-events: none;
444
+ user-select: none;
445
+ }
446
+
164
447
  /* ui/pages/CollectionPage/CollectionPage.css */
165
448
  .CollectionPage__side__title {
166
449
  padding: 8px 12px;
@@ -242,6 +525,11 @@
242
525
  font-size: 14px;
243
526
  font-weight: 500;
244
527
  }
528
+ .CollectionPage__collection {
529
+ height: 100%;
530
+ max-height: calc(100% - 48px);
531
+ overflow: auto;
532
+ }
245
533
  .CollectionPage__collection__header {
246
534
  padding: 12px;
247
535
  display: none;
@@ -312,6 +600,7 @@
312
600
  align-items: center;
313
601
  padding: 8px 0;
314
602
  border-top: 1px solid var(--color-border);
603
+ overflow: hidden;
315
604
  }
316
605
  .CollectionPage__collection__docsList__doc__content {
317
606
  display: block;
@@ -345,6 +634,7 @@
345
634
  font-weight: 500;
346
635
  }
347
636
  .CollectionPage__collection__docsList__doc__image {
637
+ border: 1px solid var(--color-border);
348
638
  flex-shrink: 0;
349
639
  }
350
640
  .CollectionPage__collection__docsList__doc__content__title {
@@ -352,8 +642,9 @@
352
642
  font-size: 24px;
353
643
  font-weight: 600;
354
644
  overflow: hidden;
355
- text-overflow: ellipsis;
356
- white-space: nowrap;
645
+ display: -webkit-box;
646
+ -webkit-box-orient: vertical;
647
+ -webkit-line-clamp: 1;
357
648
  }
358
649
  .CollectionPage__collection__docsList__doc__content__url {
359
650
  font-size: 12px;
@@ -373,79 +664,16 @@
373
664
  font-weight: 500;
374
665
  }
375
666
 
376
- /* ui/components/Heading/Heading.css */
377
- .heading {
378
- font-size: 18px;
379
- line-height: 1.2;
380
- font-weight: 700;
381
- margin-top: 0;
382
- margin-bottom: 0;
383
- }
384
- .heading.size\:h1 {
385
- font-size: 24px;
386
- }
387
- .heading.size\:h2 {
388
- font-size: 18px;
389
- }
390
- .heading.size\:h3 {
391
- font-size: 16px;
392
- }
393
- .heading.weight\:regular {
394
- font-weight: 400;
395
- }
396
- .heading.weight\:semi-bold {
397
- font-weight: 500;
398
- }
399
- .heading.weight\:bold {
400
- font-weight: 700;
401
- }
402
- .heading.color\:gray {
403
- color: var(--color-text-gray);
404
- }
405
- .heading.color\:dark {
406
- color: var(--color-text-dark);
407
- }
408
-
409
- /* ui/components/Text/Text.css */
410
- .text {
411
- font-size: 14px;
412
- line-height: 1.5;
413
- font-weight: 400;
414
- color: var(--color-text-default);
415
- }
416
- .text.size\:body-sm {
417
- font-size: 12px;
418
- }
419
- .text.size\:body {
420
- font-size: 14px;
421
- }
422
- .text.size\:body-lg {
423
- font-size: 16px;
424
- }
425
- .text.weight\:regular {
426
- font-weight: 400;
427
- }
428
- .text.weight\:semi-bold {
429
- font-weight: 500;
430
- }
431
- .text.weight\:bold {
432
- font-weight: 700;
433
- }
434
- .text.color\:gray {
435
- color: var(--color-text-gray);
667
+ /* ui/pages/DataPage/DataPage.css */
668
+ .DataPage {
669
+ padding: 60px;
436
670
  }
437
- .text.color\:dark {
438
- color: var(--color-text-dark);
671
+ .DataPage h1 {
672
+ margin-bottom: 24px;
439
673
  }
440
- .text code {
441
- background: #efefef;
442
- padding: 4px 8px;
443
- border-radius: 2px;
444
- white-space: nowrap;
445
- font-family: var(--font-family-mono);
446
- font-weight: 600;
447
- margin-left: 4px;
448
- margin-right: 4px;
674
+ .DataPage p {
675
+ margin-top: 16px;
676
+ max-width: 70ch;
449
677
  }
450
678
 
451
679
  /* ui/components/DocEditor/DocEditor.css */
@@ -477,6 +705,9 @@
477
705
  .DocEditor__statusBar__statusBadges {
478
706
  margin-right: 16px;
479
707
  }
708
+ .DocEditor__statusBar__i18n {
709
+ margin-right: 8px;
710
+ }
480
711
  .DocEditor__statusBar__actionsMenu {
481
712
  margin-left: 4px;
482
713
  }
@@ -488,6 +719,9 @@
488
719
  .DocEditor__field__name {
489
720
  font-weight: 600;
490
721
  }
722
+ .DocEditor__field__help {
723
+ margin-top: 2px;
724
+ }
491
725
  .DocEditor__ObjectField__fields {
492
726
  display: flex;
493
727
  flex-direction: column;
@@ -603,14 +837,19 @@
603
837
  .DocEditor__ImageField__imagePreview {
604
838
  margin-bottom: 10px;
605
839
  }
840
+ .DocEditor__ImageField__imagePreview__controls {
841
+ display: flex;
842
+ justify-content: flex-end;
843
+ gap: 4px;
844
+ }
606
845
  .DocEditor__ImageField__imagePreview__image {
607
846
  background: #f5f5f5;
608
847
  border: 1px solid #dedede;
609
848
  aspect-ratio: 16/9;
610
849
  width: 100%;
611
- overflow: hidden;
612
850
  padding: 10px;
613
851
  margin-bottom: 10px;
852
+ position: relative;
614
853
  }
615
854
  .DocEditor__ImageField__imagePreview__image img {
616
855
  display: block;
@@ -619,6 +858,19 @@
619
858
  object-fit: contain;
620
859
  object-position: center;
621
860
  }
861
+ .DocEditor__ImageField__imagePreview__dimens {
862
+ position: absolute;
863
+ top: -1px;
864
+ right: -1px;
865
+ padding: 4px 8px;
866
+ background: black;
867
+ color: white;
868
+ font-size: 8px;
869
+ font-weight: 700;
870
+ }
871
+ .DocEditor__ImageField__imagePreview__image__alt {
872
+ margin-top: 4px;
873
+ }
622
874
  .DocEditor__ImageField__noImage {
623
875
  font-family: var(--font-family-mono);
624
876
  margin: 10px 0;
@@ -644,43 +896,35 @@
644
896
  .DocEditor__ImageField__uploadButton__icon {
645
897
  margin-right: 10px;
646
898
  }
647
-
648
- /* ui/components/PublishDocModal/PublishDocModal.css */
649
- .PublishDocModal .mantine-Modal-title {
650
- font-size: 14px;
651
- font-weight: 500;
652
- }
653
- .PublishDocModal__content {
654
- font-size: 12px;
655
- line-height: 1.5;
656
- font-weight: 500;
657
- }
658
- .PublishDocModal__form__publishOptions__label {
659
- margin-bottom: 8px;
899
+ .DocEditor__FileField__file {
900
+ margin-bottom: 10px;
660
901
  }
661
- .PublishDocModal__form__publishOptions__options {
662
- display: grid;
663
- grid-template-columns: 1fr 1fr;
664
- gap: 12px;
902
+ .DocEditor__FileField__noFile {
903
+ font-family: var(--font-family-mono);
904
+ margin: 10px 0;
665
905
  }
666
- .PublishDocModal__form__publishOptions__option {
667
- border: 1px solid var(--color-border);
668
- padding: 12px;
906
+ .DocEditor__FileField__uploadButton {
907
+ display: inline-flex;
908
+ align-items: center;
909
+ cursor: pointer;
910
+ background: #25262b;
669
911
  border-radius: 4px;
912
+ padding: 0 14px;
913
+ height: 30px;
914
+ color: #ffffff;
915
+ font-weight: 600;
916
+ transition: all 0.3s ease;
670
917
  }
671
- .PublishDocModal__form__publishOptions__option__help {
672
- padding-left: 24px;
673
- font-size: 10px;
674
- font-weight: 400;
675
- margin-top: 4px;
918
+ .DocEditor__FileField__uploadButton[aria-disabled=true] {
919
+ opacity: 0.5;
676
920
  }
677
- .PublishDocModal__form__publishOptions__option__input input {
678
- padding-top: 4px;
921
+ .DocEditor__FileField__uploadButton input[type=file] {
922
+ display: none;
679
923
  }
680
- .PublishDocModal__form__publishOptions__option__input2 {
681
- padding-left: 20px;
924
+ .DocEditor__FileField__uploadButton__icon {
925
+ margin-right: 10px;
682
926
  }
683
- .PublishDocModal__form__publishOptions__option__input2 input {
927
+ .DocEditor__DateTimeField input {
684
928
  margin-top: 16px;
685
929
  display: block;
686
930
  width: 100%;
@@ -689,18 +933,6 @@
689
933
  font-family: inherit;
690
934
  font-size: 12px;
691
935
  }
692
- .PublishDocModal__form__publishOptions__option__input2__help {
693
- font-size: 10px;
694
- font-weight: 400;
695
- margin-top: 4px;
696
- text-align: right;
697
- }
698
- .PublishDocModal__form__buttons {
699
- margin-top: 24px;
700
- display: flex;
701
- justify-content: flex-end;
702
- gap: 12px;
703
- }
704
936
 
705
937
  /* ui/pages/DocumentPage/DocumentPage.css */
706
938
  .DocumentPage {
@@ -717,14 +949,27 @@
717
949
  border-bottom: 1px solid var(--color-border);
718
950
  display: flex;
719
951
  align-items: center;
720
- gap: 4px;
952
+ justify-content: space-between;
953
+ gap: 24px;
721
954
  height: var(--top-bar-height);
955
+ position: sticky;
956
+ top: 0;
957
+ z-index: 10;
958
+ background: white;
959
+ }
960
+ .DocumentPage__side__header__nav {
961
+ display: flex;
962
+ align-items: center;
963
+ gap: 4px;
722
964
  }
723
965
  .DocumentPage__side__header__back {
724
966
  color: var(--color-text-default);
725
967
  }
968
+ .DocumentPage__side__header__buttons {
969
+ justify-self: flex-end;
970
+ }
726
971
  .DocumentPage__side__editor {
727
- padding: 8px 12px;
972
+ padding: 8px 12px 120px;
728
973
  }
729
974
  .DocumentPage__main {
730
975
  width: 100%;
@@ -765,6 +1010,14 @@
765
1010
  align-items: center;
766
1011
  justify-content: space-between;
767
1012
  }
1013
+ .DocumentPage__main__previewBar__locales .mantine-Select-input {
1014
+ border: 1px solid var(--color-border);
1015
+ font-size: 12px;
1016
+ line-height: 24px;
1017
+ height: 24px;
1018
+ min-height: 24px;
1019
+ max-width: 170px;
1020
+ }
768
1021
  .DocumentPage__main__previewFrame {
769
1022
  background: #f9f9f9;
770
1023
  width: 100%;
@@ -809,18 +1062,6 @@
809
1062
  font-size: 12px;
810
1063
  }
811
1064
 
812
- /* ui/pages/ProjectPage/ProjectPage.css */
813
- .ProjectPage {
814
- padding: 60px;
815
- }
816
- .ProjectPage h1 {
817
- margin-bottom: 24px;
818
- }
819
- .ProjectPage p {
820
- margin-top: 16px;
821
- max-width: 70ch;
822
- }
823
-
824
1065
  /* ui/pages/NotFoundPage/NotFoundPage.css */
825
1066
  .NotFoundPage {
826
1067
  display: flex;
@@ -837,23 +1078,60 @@
837
1078
  font-weight: 500;
838
1079
  }
839
1080
 
840
- /* ui/pages/SettingsPage/SettingsPage.css */
841
- .SettingsPage {
842
- padding: 30px;
1081
+ /* ui/pages/ProjectPage/ProjectPage.css */
1082
+ .ProjectPage {
1083
+ padding: 60px;
843
1084
  }
844
- .SettingsPage__section {
1085
+ .ProjectPage h1 {
1086
+ margin-bottom: 24px;
1087
+ }
1088
+ .ProjectPage p {
1089
+ margin-top: 16px;
1090
+ max-width: 70ch;
1091
+ }
1092
+ .ProjectPage__section {
1093
+ margin-top: 60px;
1094
+ }
1095
+ .ProjectPage__section__title {
1096
+ margin-bottom: 20px;
1097
+ }
1098
+ .ProjectPage__collectionList {
1099
+ display: flex;
1100
+ flex-direction: column;
1101
+ justify-content: flex-start;
1102
+ gap: 12px;
1103
+ max-width: 580px;
1104
+ }
1105
+ .ProjectPage__collectionList__collection {
845
1106
  display: grid;
846
- grid-template-columns: 1fr 2fr;
1107
+ grid-template-columns: 20px 1fr;
1108
+ align-items: center;
1109
+ padding: 8px 12px;
1110
+ column-gap: 12px;
1111
+ row-gap: 4px;
1112
+ width: 100%;
1113
+ background: transparent;
1114
+ border: 2px solid black;
1115
+ border-radius: 8px;
1116
+ cursor: pointer;
1117
+ font-size: 14px;
1118
+ font-weight: 500;
1119
+ text-decoration: none;
1120
+ transition: background-color 0.18s ease;
1121
+ position: relative;
847
1122
  }
848
- .SettingsPage__section__left,
849
- .SettingsPage__section__right {
850
- padding: 30px;
1123
+ .ProjectPage__collectionList__collection:hover {
1124
+ background-color: var(--button-background-hover);
851
1125
  }
852
- .SettingsPage__section__left__title {
853
- margin-bottom: 8px;
1126
+ .ProjectPage__collectionList__collection:active {
1127
+ background-color: var(--button-background-active);
854
1128
  }
855
- .SettingsPage__section__right__title {
856
- margin-bottom: 12px;
1129
+ .ProjectPage__collectionList__collection__icon {
1130
+ margin-top: 2px;
1131
+ }
1132
+ .ProjectPage__collectionList__collection__desc {
1133
+ grid-column: 2 / span 1;
1134
+ font-size: 12px;
857
1135
  }
858
1136
 
859
1137
  /* ui/components/ShareBox/ShareBox.css */
@@ -885,28 +1163,23 @@
885
1163
  text-overflow: ellipsis;
886
1164
  }
887
1165
 
888
- /* ui/pages/AssetsPage/AssetsPage.css */
889
- .AssetsPage {
890
- padding: 60px;
891
- }
892
- .AssetsPage h1 {
893
- margin-bottom: 24px;
1166
+ /* ui/pages/SettingsPage/SettingsPage.css */
1167
+ .SettingsPage {
1168
+ padding: 30px;
894
1169
  }
895
- .AssetsPage p {
896
- margin-top: 16px;
897
- max-width: 70ch;
1170
+ .SettingsPage__section {
1171
+ display: grid;
1172
+ grid-template-columns: 1fr 2fr;
898
1173
  }
899
-
900
- /* ui/pages/DataPage/DataPage.css */
901
- .DataPage {
902
- padding: 60px;
1174
+ .SettingsPage__section__left,
1175
+ .SettingsPage__section__right {
1176
+ padding: 30px;
903
1177
  }
904
- .DataPage h1 {
905
- margin-bottom: 24px;
1178
+ .SettingsPage__section__left__title {
1179
+ margin-bottom: 8px;
906
1180
  }
907
- .DataPage p {
908
- margin-top: 16px;
909
- max-width: 70ch;
1181
+ .SettingsPage__section__right__title {
1182
+ margin-bottom: 12px;
910
1183
  }
911
1184
 
912
1185
  /* ui/pages/TranslationsPage/TranslationsPage.css */
@@ -971,6 +1244,9 @@ iframe {
971
1244
  height: auto;
972
1245
  margin: 0;
973
1246
  }
1247
+ details > div {
1248
+ box-sizing: border-box;
1249
+ }
974
1250
  a {
975
1251
  color: inherit;
976
1252
  }