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

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;
@@ -334,118 +623,57 @@
334
623
  align-items: center;
335
624
  gap: 12px;
336
625
  }
337
- .CollectionPage__collection__docsList__doc__content__header__badges .mantine-Tooltip-root {
338
- display: block;
339
- }
340
- .CollectionPage__collection__docsList__doc__content__header__badges .mantine-Badge-root {
341
- display: flex;
342
- }
343
- .CollectionPage__collection__docsList__doc__content__header__docId {
344
- font-size: 14px;
345
- font-weight: 500;
346
- }
347
- .CollectionPage__collection__docsList__doc__image {
348
- flex-shrink: 0;
349
- }
350
- .CollectionPage__collection__docsList__doc__content__title {
351
- line-height: 36px;
352
- font-size: 24px;
353
- font-weight: 600;
354
- overflow: hidden;
355
- text-overflow: ellipsis;
356
- white-space: nowrap;
357
- }
358
- .CollectionPage__collection__docsList__doc__content__url {
359
- font-size: 12px;
360
- font-weight: 500;
361
- color: #ababab;
362
- }
363
- .CollectionPage__collection__docsEmpty {
364
- display: flex;
365
- flex-direction: column;
366
- align-items: center;
367
- text-align: center;
368
- gap: 12px;
369
- margin-top: 80px;
370
- }
371
- .CollectionPage__collection__docsEmpty__title {
372
- font-size: 14px;
373
- font-weight: 500;
374
- }
375
-
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);
626
+ .CollectionPage__collection__docsList__doc__content__header__badges .mantine-Tooltip-root {
627
+ display: block;
404
628
  }
405
- .heading.color\:dark {
406
- color: var(--color-text-dark);
629
+ .CollectionPage__collection__docsList__doc__content__header__badges .mantine-Badge-root {
630
+ display: flex;
407
631
  }
408
-
409
- /* ui/components/Text/Text.css */
410
- .text {
632
+ .CollectionPage__collection__docsList__doc__content__header__docId {
411
633
  font-size: 14px;
412
- line-height: 1.5;
413
- font-weight: 400;
414
- color: var(--color-text-default);
634
+ font-weight: 500;
415
635
  }
416
- .text.size\:body-sm {
417
- font-size: 12px;
636
+ .CollectionPage__collection__docsList__doc__image {
637
+ border: 1px solid var(--color-border);
638
+ flex-shrink: 0;
418
639
  }
419
- .text.size\:body {
420
- font-size: 14px;
640
+ .CollectionPage__collection__docsList__doc__content__title {
641
+ line-height: 36px;
642
+ font-size: 24px;
643
+ font-weight: 600;
644
+ overflow: hidden;
645
+ display: -webkit-box;
646
+ -webkit-box-orient: vertical;
647
+ -webkit-line-clamp: 1;
421
648
  }
422
- .text.size\:body-lg {
423
- font-size: 16px;
649
+ .CollectionPage__collection__docsList__doc__content__url {
650
+ font-size: 12px;
651
+ font-weight: 500;
652
+ color: #ababab;
424
653
  }
425
- .text.weight\:regular {
426
- font-weight: 400;
654
+ .CollectionPage__collection__docsEmpty {
655
+ display: flex;
656
+ flex-direction: column;
657
+ align-items: center;
658
+ text-align: center;
659
+ gap: 12px;
660
+ margin-top: 80px;
427
661
  }
428
- .text.weight\:semi-bold {
662
+ .CollectionPage__collection__docsEmpty__title {
663
+ font-size: 14px;
429
664
  font-weight: 500;
430
665
  }
431
- .text.weight\:bold {
432
- font-weight: 700;
433
- }
434
- .text.color\:gray {
435
- color: var(--color-text-gray);
666
+
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,62 +896,33 @@
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;
676
- }
677
- .PublishDocModal__form__publishOptions__option__input input {
678
- padding-top: 4px;
679
- }
680
- .PublishDocModal__form__publishOptions__option__input2 {
681
- padding-left: 20px;
682
- }
683
- .PublishDocModal__form__publishOptions__option__input2 input {
684
- margin-top: 16px;
685
- display: block;
686
- width: 100%;
687
- border: 1px solid #dedede;
688
- padding: 6px 8px;
689
- font-family: inherit;
690
- font-size: 12px;
918
+ .DocEditor__FileField__uploadButton[aria-disabled=true] {
919
+ opacity: 0.5;
691
920
  }
692
- .PublishDocModal__form__publishOptions__option__input2__help {
693
- font-size: 10px;
694
- font-weight: 400;
695
- margin-top: 4px;
696
- text-align: right;
921
+ .DocEditor__FileField__uploadButton input[type=file] {
922
+ display: none;
697
923
  }
698
- .PublishDocModal__form__buttons {
699
- margin-top: 24px;
700
- display: flex;
701
- justify-content: flex-end;
702
- gap: 12px;
924
+ .DocEditor__FileField__uploadButton__icon {
925
+ margin-right: 10px;
703
926
  }
704
927
 
705
928
  /* ui/pages/DocumentPage/DocumentPage.css */
@@ -717,14 +940,27 @@
717
940
  border-bottom: 1px solid var(--color-border);
718
941
  display: flex;
719
942
  align-items: center;
720
- gap: 4px;
943
+ justify-content: space-between;
944
+ gap: 24px;
721
945
  height: var(--top-bar-height);
946
+ position: sticky;
947
+ top: 0;
948
+ z-index: 10;
949
+ background: white;
950
+ }
951
+ .DocumentPage__side__header__nav {
952
+ display: flex;
953
+ align-items: center;
954
+ gap: 4px;
722
955
  }
723
956
  .DocumentPage__side__header__back {
724
957
  color: var(--color-text-default);
725
958
  }
959
+ .DocumentPage__side__header__buttons {
960
+ justify-self: flex-end;
961
+ }
726
962
  .DocumentPage__side__editor {
727
- padding: 8px 12px;
963
+ padding: 8px 12px 120px;
728
964
  }
729
965
  .DocumentPage__main {
730
966
  width: 100%;
@@ -765,6 +1001,14 @@
765
1001
  align-items: center;
766
1002
  justify-content: space-between;
767
1003
  }
1004
+ .DocumentPage__main__previewBar__locales .mantine-Select-input {
1005
+ border: 1px solid var(--color-border);
1006
+ font-size: 12px;
1007
+ line-height: 24px;
1008
+ height: 24px;
1009
+ min-height: 24px;
1010
+ max-width: 170px;
1011
+ }
768
1012
  .DocumentPage__main__previewFrame {
769
1013
  background: #f9f9f9;
770
1014
  width: 100%;
@@ -809,18 +1053,6 @@
809
1053
  font-size: 12px;
810
1054
  }
811
1055
 
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
1056
  /* ui/pages/NotFoundPage/NotFoundPage.css */
825
1057
  .NotFoundPage {
826
1058
  display: flex;
@@ -837,23 +1069,60 @@
837
1069
  font-weight: 500;
838
1070
  }
839
1071
 
840
- /* ui/pages/SettingsPage/SettingsPage.css */
841
- .SettingsPage {
842
- padding: 30px;
1072
+ /* ui/pages/ProjectPage/ProjectPage.css */
1073
+ .ProjectPage {
1074
+ padding: 60px;
843
1075
  }
844
- .SettingsPage__section {
1076
+ .ProjectPage h1 {
1077
+ margin-bottom: 24px;
1078
+ }
1079
+ .ProjectPage p {
1080
+ margin-top: 16px;
1081
+ max-width: 70ch;
1082
+ }
1083
+ .ProjectPage__section {
1084
+ margin-top: 60px;
1085
+ }
1086
+ .ProjectPage__section__title {
1087
+ margin-bottom: 20px;
1088
+ }
1089
+ .ProjectPage__collectionList {
1090
+ display: flex;
1091
+ flex-direction: column;
1092
+ justify-content: flex-start;
1093
+ gap: 12px;
1094
+ max-width: 580px;
1095
+ }
1096
+ .ProjectPage__collectionList__collection {
845
1097
  display: grid;
846
- grid-template-columns: 1fr 2fr;
1098
+ grid-template-columns: 20px 1fr;
1099
+ align-items: center;
1100
+ padding: 8px 12px;
1101
+ column-gap: 12px;
1102
+ row-gap: 4px;
1103
+ width: 100%;
1104
+ background: transparent;
1105
+ border: 2px solid black;
1106
+ border-radius: 8px;
1107
+ cursor: pointer;
1108
+ font-size: 14px;
1109
+ font-weight: 500;
1110
+ text-decoration: none;
1111
+ transition: background-color 0.18s ease;
1112
+ position: relative;
847
1113
  }
848
- .SettingsPage__section__left,
849
- .SettingsPage__section__right {
850
- padding: 30px;
1114
+ .ProjectPage__collectionList__collection:hover {
1115
+ background-color: var(--button-background-hover);
851
1116
  }
852
- .SettingsPage__section__left__title {
853
- margin-bottom: 8px;
1117
+ .ProjectPage__collectionList__collection:active {
1118
+ background-color: var(--button-background-active);
854
1119
  }
855
- .SettingsPage__section__right__title {
856
- margin-bottom: 12px;
1120
+ .ProjectPage__collectionList__collection__icon {
1121
+ margin-top: 2px;
1122
+ }
1123
+ .ProjectPage__collectionList__collection__desc {
1124
+ grid-column: 2 / span 1;
1125
+ font-size: 12px;
857
1126
  }
858
1127
 
859
1128
  /* ui/components/ShareBox/ShareBox.css */
@@ -885,28 +1154,23 @@
885
1154
  text-overflow: ellipsis;
886
1155
  }
887
1156
 
888
- /* ui/pages/AssetsPage/AssetsPage.css */
889
- .AssetsPage {
890
- padding: 60px;
891
- }
892
- .AssetsPage h1 {
893
- margin-bottom: 24px;
1157
+ /* ui/pages/SettingsPage/SettingsPage.css */
1158
+ .SettingsPage {
1159
+ padding: 30px;
894
1160
  }
895
- .AssetsPage p {
896
- margin-top: 16px;
897
- max-width: 70ch;
1161
+ .SettingsPage__section {
1162
+ display: grid;
1163
+ grid-template-columns: 1fr 2fr;
898
1164
  }
899
-
900
- /* ui/pages/DataPage/DataPage.css */
901
- .DataPage {
902
- padding: 60px;
1165
+ .SettingsPage__section__left,
1166
+ .SettingsPage__section__right {
1167
+ padding: 30px;
903
1168
  }
904
- .DataPage h1 {
905
- margin-bottom: 24px;
1169
+ .SettingsPage__section__left__title {
1170
+ margin-bottom: 8px;
906
1171
  }
907
- .DataPage p {
908
- margin-top: 16px;
909
- max-width: 70ch;
1172
+ .SettingsPage__section__right__title {
1173
+ margin-bottom: 12px;
910
1174
  }
911
1175
 
912
1176
  /* ui/pages/TranslationsPage/TranslationsPage.css */
@@ -971,6 +1235,9 @@ iframe {
971
1235
  height: auto;
972
1236
  margin: 0;
973
1237
  }
1238
+ details > div {
1239
+ box-sizing: border-box;
1240
+ }
974
1241
  a {
975
1242
  color: inherit;
976
1243
  }