@blinkk/root-cms 1.0.0-beta.2 → 1.0.0-beta.21

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,76 @@
1
- /* ui/components/SplitPanel/SplitPanel.css */
2
- .SplitPanel {
3
- display: flex;
4
- height: 100%;
1
+ /* ui/components/Heading/Heading.css */
2
+ .heading {
3
+ font-size: 18px;
4
+ line-height: 1.2;
5
+ font-weight: 700;
6
+ margin-top: 0;
7
+ margin-bottom: 0;
5
8
  }
6
- .SplitPanel__divider {
7
- flex: 0 0 3px;
8
- width: 3px;
9
- height: 100%;
10
- cursor: col-resize;
11
- position: relative;
9
+ .heading.size\:h1 {
10
+ font-size: 24px;
12
11
  }
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);
12
+ .heading.size\:h2 {
13
+ font-size: 18px;
23
14
  }
24
- .SplitPanel__divider::after {
25
- content: "";
26
- display: block;
27
- z-index: 1;
28
- position: absolute;
29
- top: 0;
30
- height: 100%;
31
- left: 0;
32
- width: 100%;
33
- background-color: transparent;
34
- transition: background-color 0.18s ease;
15
+ .heading.size\:h3 {
16
+ font-size: 16px;
35
17
  }
36
- .SplitPanel__divider:hover::after {
37
- background-color: lightblue;
18
+ .heading.weight\:regular {
19
+ font-weight: 400;
38
20
  }
39
- .SplitPanel__item.static {
40
- flex: 0 0 var(--panel-size, 100%);
21
+ .heading.weight\:semi-bold {
22
+ font-weight: 500;
41
23
  }
42
- .SplitPanel__item.fluid {
43
- flex: 1;
24
+ .heading.weight\:bold {
25
+ font-weight: 700;
44
26
  }
45
- .SplitPanel.dragging .SplitPanel__item {
46
- pointer-events: none;
47
- user-select: none;
27
+ .heading.color\:gray {
28
+ color: var(--color-text-gray);
29
+ }
30
+ .heading.color\:dark {
31
+ color: var(--color-text-dark);
32
+ }
33
+
34
+ /* ui/components/Text/Text.css */
35
+ .text {
36
+ font-size: 14px;
37
+ line-height: 1.5;
38
+ font-weight: 400;
39
+ color: var(--color-text-default);
40
+ }
41
+ .text.size\:body-sm {
42
+ font-size: 12px;
43
+ }
44
+ .text.size\:body {
45
+ font-size: 14px;
46
+ }
47
+ .text.size\:body-lg {
48
+ font-size: 16px;
49
+ }
50
+ .text.weight\:regular {
51
+ font-weight: 400;
52
+ }
53
+ .text.weight\:semi-bold {
54
+ font-weight: 500;
55
+ }
56
+ .text.weight\:bold {
57
+ font-weight: 700;
58
+ }
59
+ .text.color\:gray {
60
+ color: var(--color-text-gray);
61
+ }
62
+ .text.color\:dark {
63
+ color: var(--color-text-dark);
64
+ }
65
+ .text code {
66
+ background: #efefef;
67
+ padding: 4px 8px;
68
+ border-radius: 2px;
69
+ white-space: nowrap;
70
+ font-family: var(--font-family-mono);
71
+ font-weight: 600;
72
+ margin-left: 4px;
73
+ margin-right: 4px;
48
74
  }
49
75
 
50
76
  /* ui/layout/Layout.css */
@@ -83,6 +109,12 @@
83
109
  padding: 0 4px;
84
110
  border-radius: 2px;
85
111
  }
112
+ .Layout__top__project {
113
+ font-size: 13px;
114
+ line-height: 1;
115
+ font-weight: 600;
116
+ margin-left: 12px;
117
+ }
86
118
  .Layout__top__logo:hover {
87
119
  background-color: var(--button-background-hover);
88
120
  }
@@ -139,6 +171,18 @@
139
171
  grid-area: bottom;
140
172
  }
141
173
 
174
+ /* ui/pages/AssetsPage/AssetsPage.css */
175
+ .AssetsPage {
176
+ padding: 60px;
177
+ }
178
+ .AssetsPage h1 {
179
+ margin-bottom: 24px;
180
+ }
181
+ .AssetsPage p {
182
+ margin-top: 16px;
183
+ max-width: 70ch;
184
+ }
185
+
142
186
  /* ui/components/NewDocModal/NewDocModal.css */
143
187
  .NewDocModal__body {
144
188
  font-size: 12px;
@@ -155,6 +199,55 @@
155
199
  gap: 12px;
156
200
  }
157
201
 
202
+ /* ui/components/SplitPanel/SplitPanel.css */
203
+ .SplitPanel {
204
+ display: flex;
205
+ height: 100%;
206
+ }
207
+ .SplitPanel__divider {
208
+ flex: 0 0 3px;
209
+ width: 3px;
210
+ height: 100%;
211
+ cursor: col-resize;
212
+ position: relative;
213
+ }
214
+ .SplitPanel__divider::before {
215
+ content: "";
216
+ display: block;
217
+ z-index: 0;
218
+ position: absolute;
219
+ top: 0;
220
+ height: 100%;
221
+ left: 1px;
222
+ width: 1px;
223
+ background-color: var(--color-border);
224
+ }
225
+ .SplitPanel__divider::after {
226
+ content: "";
227
+ display: block;
228
+ z-index: 1;
229
+ position: absolute;
230
+ top: 0;
231
+ height: 100%;
232
+ left: 0;
233
+ width: 100%;
234
+ background-color: transparent;
235
+ transition: background-color 0.18s ease;
236
+ }
237
+ .SplitPanel__divider:hover::after {
238
+ background-color: lightblue;
239
+ }
240
+ .SplitPanel__item.static {
241
+ flex: 0 0 var(--panel-size, 100%);
242
+ }
243
+ .SplitPanel__item.fluid {
244
+ flex: 1;
245
+ }
246
+ .SplitPanel.dragging .SplitPanel__item {
247
+ pointer-events: none;
248
+ user-select: none;
249
+ }
250
+
158
251
  /* ui/pages/CollectionPage/CollectionPage.css */
159
252
  .CollectionPage__side__title {
160
253
  padding: 8px 12px;
@@ -367,79 +460,16 @@
367
460
  font-weight: 500;
368
461
  }
369
462
 
370
- /* ui/components/Heading/Heading.css */
371
- .heading {
372
- font-size: 18px;
373
- line-height: 1.2;
374
- font-weight: 700;
375
- margin-top: 0;
376
- margin-bottom: 0;
377
- }
378
- .heading.size\:h1 {
379
- font-size: 24px;
380
- }
381
- .heading.size\:h2 {
382
- font-size: 18px;
383
- }
384
- .heading.size\:h3 {
385
- font-size: 16px;
386
- }
387
- .heading.weight\:regular {
388
- font-weight: 400;
389
- }
390
- .heading.weight\:semi-bold {
391
- font-weight: 500;
392
- }
393
- .heading.weight\:bold {
394
- font-weight: 700;
395
- }
396
- .heading.color\:gray {
397
- color: var(--color-text-gray);
398
- }
399
- .heading.color\:dark {
400
- color: var(--color-text-dark);
401
- }
402
-
403
- /* ui/components/Text/Text.css */
404
- .text {
405
- font-size: 14px;
406
- line-height: 1.5;
407
- font-weight: 400;
408
- color: var(--color-text-default);
409
- }
410
- .text.size\:body-sm {
411
- font-size: 12px;
412
- }
413
- .text.size\:body {
414
- font-size: 14px;
415
- }
416
- .text.size\:body-lg {
417
- font-size: 16px;
418
- }
419
- .text.weight\:regular {
420
- font-weight: 400;
421
- }
422
- .text.weight\:semi-bold {
423
- font-weight: 500;
424
- }
425
- .text.weight\:bold {
426
- font-weight: 700;
427
- }
428
- .text.color\:gray {
429
- color: var(--color-text-gray);
463
+ /* ui/pages/DataPage/DataPage.css */
464
+ .DataPage {
465
+ padding: 60px;
430
466
  }
431
- .text.color\:dark {
432
- color: var(--color-text-dark);
467
+ .DataPage h1 {
468
+ margin-bottom: 24px;
433
469
  }
434
- .text code {
435
- background: #efefef;
436
- padding: 4px 8px;
437
- border-radius: 2px;
438
- white-space: nowrap;
439
- font-family: var(--font-family-mono);
440
- font-weight: 600;
441
- margin-left: 4px;
442
- margin-right: 4px;
470
+ .DataPage p {
471
+ margin-top: 16px;
472
+ max-width: 70ch;
443
473
  }
444
474
 
445
475
  /* ui/components/DocEditor/DocEditor.css */
@@ -594,6 +624,91 @@
594
624
  flex-direction: column;
595
625
  gap: 24px;
596
626
  }
627
+ .DocEditor__ImageField__imagePreview {
628
+ margin-bottom: 10px;
629
+ }
630
+ .DocEditor__ImageField__imagePreview__image {
631
+ background: #f5f5f5;
632
+ border: 1px solid #dedede;
633
+ aspect-ratio: 16/9;
634
+ width: 100%;
635
+ padding: 10px;
636
+ margin-bottom: 10px;
637
+ position: relative;
638
+ }
639
+ .DocEditor__ImageField__imagePreview__image img {
640
+ display: block;
641
+ width: 100%;
642
+ height: 100%;
643
+ object-fit: contain;
644
+ object-position: center;
645
+ }
646
+ .DocEditor__ImageField__imagePreview__dimens {
647
+ position: absolute;
648
+ top: -1px;
649
+ right: -1px;
650
+ padding: 4px 8px;
651
+ background: black;
652
+ color: white;
653
+ font-size: 8px;
654
+ font-weight: 700;
655
+ }
656
+ .DocEditor__ImageField__imagePreview__image__alt {
657
+ margin-top: 4px;
658
+ }
659
+ .DocEditor__ImageField__noImage {
660
+ font-family: var(--font-family-mono);
661
+ margin: 10px 0;
662
+ }
663
+ .DocEditor__ImageField__uploadButton {
664
+ display: inline-flex;
665
+ align-items: center;
666
+ cursor: pointer;
667
+ background: #25262b;
668
+ border-radius: 4px;
669
+ padding: 0 14px;
670
+ height: 30px;
671
+ color: #ffffff;
672
+ font-weight: 600;
673
+ transition: all 0.3s ease;
674
+ }
675
+ .DocEditor__ImageField__uploadButton[aria-disabled=true] {
676
+ opacity: 0.5;
677
+ }
678
+ .DocEditor__ImageField__uploadButton input[type=file] {
679
+ display: none;
680
+ }
681
+ .DocEditor__ImageField__uploadButton__icon {
682
+ margin-right: 10px;
683
+ }
684
+ .DocEditor__FileField__file {
685
+ margin-bottom: 10px;
686
+ }
687
+ .DocEditor__FileField__noFile {
688
+ font-family: var(--font-family-mono);
689
+ margin: 10px 0;
690
+ }
691
+ .DocEditor__FileField__uploadButton {
692
+ display: inline-flex;
693
+ align-items: center;
694
+ cursor: pointer;
695
+ background: #25262b;
696
+ border-radius: 4px;
697
+ padding: 0 14px;
698
+ height: 30px;
699
+ color: #ffffff;
700
+ font-weight: 600;
701
+ transition: all 0.3s ease;
702
+ }
703
+ .DocEditor__FileField__uploadButton[aria-disabled=true] {
704
+ opacity: 0.5;
705
+ }
706
+ .DocEditor__FileField__uploadButton input[type=file] {
707
+ display: none;
708
+ }
709
+ .DocEditor__FileField__uploadButton__icon {
710
+ margin-right: 10px;
711
+ }
597
712
 
598
713
  /* ui/components/PublishDocModal/PublishDocModal.css */
599
714
  .PublishDocModal .mantine-Modal-title {
@@ -635,7 +750,7 @@
635
750
  display: block;
636
751
  width: 100%;
637
752
  border: 1px solid #dedede;
638
- padding: 4px 8px;
753
+ padding: 6px 8px;
639
754
  font-family: inherit;
640
755
  font-size: 12px;
641
756
  }
@@ -674,7 +789,7 @@
674
789
  color: var(--color-text-default);
675
790
  }
676
791
  .DocumentPage__side__editor {
677
- padding: 8px 12px;
792
+ padding: 8px 12px 120px;
678
793
  }
679
794
  .DocumentPage__main {
680
795
  width: 100%;
@@ -759,18 +874,6 @@
759
874
  font-size: 12px;
760
875
  }
761
876
 
762
- /* ui/pages/ProjectPage/ProjectPage.css */
763
- .ProjectPage {
764
- padding: 60px;
765
- }
766
- .ProjectPage h1 {
767
- margin-bottom: 24px;
768
- }
769
- .ProjectPage p {
770
- margin-top: 16px;
771
- max-width: 70ch;
772
- }
773
-
774
877
  /* ui/pages/NotFoundPage/NotFoundPage.css */
775
878
  .NotFoundPage {
776
879
  display: flex;
@@ -787,23 +890,60 @@
787
890
  font-weight: 500;
788
891
  }
789
892
 
790
- /* ui/pages/SettingsPage/SettingsPage.css */
791
- .SettingsPage {
792
- padding: 30px;
893
+ /* ui/pages/ProjectPage/ProjectPage.css */
894
+ .ProjectPage {
895
+ padding: 60px;
793
896
  }
794
- .SettingsPage__section {
897
+ .ProjectPage h1 {
898
+ margin-bottom: 24px;
899
+ }
900
+ .ProjectPage p {
901
+ margin-top: 16px;
902
+ max-width: 70ch;
903
+ }
904
+ .ProjectPage__section {
905
+ margin-top: 60px;
906
+ }
907
+ .ProjectPage__section__title {
908
+ margin-bottom: 20px;
909
+ }
910
+ .ProjectPage__collectionList {
911
+ display: flex;
912
+ flex-direction: column;
913
+ justify-content: flex-start;
914
+ gap: 12px;
915
+ max-width: 580px;
916
+ }
917
+ .ProjectPage__collectionList__collection {
795
918
  display: grid;
796
- grid-template-columns: 1fr 2fr;
919
+ grid-template-columns: 20px 1fr;
920
+ align-items: center;
921
+ padding: 8px 12px;
922
+ column-gap: 12px;
923
+ row-gap: 4px;
924
+ width: 100%;
925
+ background: transparent;
926
+ border: 2px solid black;
927
+ border-radius: 8px;
928
+ cursor: pointer;
929
+ font-size: 14px;
930
+ font-weight: 500;
931
+ text-decoration: none;
932
+ transition: background-color 0.18s ease;
933
+ position: relative;
797
934
  }
798
- .SettingsPage__section__left,
799
- .SettingsPage__section__right {
800
- padding: 30px;
935
+ .ProjectPage__collectionList__collection:hover {
936
+ background-color: var(--button-background-hover);
801
937
  }
802
- .SettingsPage__section__left__title {
803
- margin-bottom: 8px;
938
+ .ProjectPage__collectionList__collection:active {
939
+ background-color: var(--button-background-active);
804
940
  }
805
- .SettingsPage__section__right__title {
806
- margin-bottom: 12px;
941
+ .ProjectPage__collectionList__collection__icon {
942
+ margin-top: 2px;
943
+ }
944
+ .ProjectPage__collectionList__collection__desc {
945
+ grid-column: 2 / span 1;
946
+ font-size: 12px;
807
947
  }
808
948
 
809
949
  /* ui/components/ShareBox/ShareBox.css */
@@ -835,28 +975,23 @@
835
975
  text-overflow: ellipsis;
836
976
  }
837
977
 
838
- /* ui/pages/AssetsPage/AssetsPage.css */
839
- .AssetsPage {
840
- padding: 60px;
841
- }
842
- .AssetsPage h1 {
843
- margin-bottom: 24px;
978
+ /* ui/pages/SettingsPage/SettingsPage.css */
979
+ .SettingsPage {
980
+ padding: 30px;
844
981
  }
845
- .AssetsPage p {
846
- margin-top: 16px;
847
- max-width: 70ch;
982
+ .SettingsPage__section {
983
+ display: grid;
984
+ grid-template-columns: 1fr 2fr;
848
985
  }
849
-
850
- /* ui/pages/DataPage/DataPage.css */
851
- .DataPage {
852
- padding: 60px;
986
+ .SettingsPage__section__left,
987
+ .SettingsPage__section__right {
988
+ padding: 30px;
853
989
  }
854
- .DataPage h1 {
855
- margin-bottom: 24px;
990
+ .SettingsPage__section__left__title {
991
+ margin-bottom: 8px;
856
992
  }
857
- .DataPage p {
858
- margin-top: 16px;
859
- max-width: 70ch;
993
+ .SettingsPage__section__right__title {
994
+ margin-bottom: 12px;
860
995
  }
861
996
 
862
997
  /* ui/pages/TranslationsPage/TranslationsPage.css */
@@ -921,6 +1056,9 @@ iframe {
921
1056
  height: auto;
922
1057
  margin: 0;
923
1058
  }
1059
+ details > div {
1060
+ box-sizing: border-box;
1061
+ }
924
1062
  a {
925
1063
  color: inherit;
926
1064
  }