@skygraph/styles 0.6.4 → 0.6.6

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.
Files changed (68) hide show
  1. package/README.md +98 -98
  2. package/components/autocomplete.css +35 -35
  3. package/components/autofield.css +67 -67
  4. package/components/avatar.css +37 -37
  5. package/components/badge.css +102 -102
  6. package/components/breadcrumb.css +29 -29
  7. package/components/button.css +181 -181
  8. package/components/calendar.css +408 -408
  9. package/components/carousel.css +102 -102
  10. package/components/cascader.css +380 -380
  11. package/components/charts.css +408 -408
  12. package/components/checkbox.css +114 -114
  13. package/components/collapse.css +166 -166
  14. package/components/colorpicker.css +252 -252
  15. package/components/context-menu.css +95 -95
  16. package/components/descriptions.css +82 -82
  17. package/components/diagram.css +435 -435
  18. package/components/drawer.css +124 -124
  19. package/components/dropdown.css +110 -110
  20. package/components/empty.css +25 -25
  21. package/components/event-timeline.css +134 -134
  22. package/components/field.css +35 -35
  23. package/components/form.css +115 -115
  24. package/components/gantt.css +166 -166
  25. package/components/input-number.css +76 -76
  26. package/components/input-password.css +104 -104
  27. package/components/input.css +211 -211
  28. package/components/list.css +366 -366
  29. package/components/mentions.css +54 -54
  30. package/components/menu.css +326 -326
  31. package/components/modal.css +1 -0
  32. package/components/notification.css +128 -128
  33. package/components/pagination.css +162 -162
  34. package/components/popconfirm.css +95 -95
  35. package/components/progress.css +116 -116
  36. package/components/radio.css +95 -95
  37. package/components/rate.css +48 -48
  38. package/components/resource-calendar.css +224 -224
  39. package/components/result.css +45 -45
  40. package/components/schema-form-editor.css +433 -433
  41. package/components/search-input.css +112 -112
  42. package/components/segmented.css +76 -76
  43. package/components/select.css +181 -181
  44. package/components/skeleton.css +72 -72
  45. package/components/slider.css +51 -51
  46. package/components/spin.css +102 -102
  47. package/components/steps.css +194 -194
  48. package/components/switch.css +75 -75
  49. package/components/table.css +9 -1
  50. package/components/tabs.css +137 -137
  51. package/components/tag.css +61 -61
  52. package/components/textarea.css +22 -22
  53. package/components/timeline.css +169 -169
  54. package/components/timepicker.css +224 -224
  55. package/components/tooltip.css +91 -91
  56. package/components/transfer.css +140 -140
  57. package/components/tree.css +601 -601
  58. package/components/treeselect.css +221 -221
  59. package/components/upload.css +124 -124
  60. package/index.css +70 -70
  61. package/index.d.ts +9 -9
  62. package/package.json +1 -1
  63. package/print.css +88 -88
  64. package/reset.css +17 -17
  65. package/themes/dark.css +17 -17
  66. package/themes/default.css +14 -14
  67. package/tokens.css +310 -310
  68. package/transitions.css +158 -158
package/components/carousel.css CHANGED
@@ -1,102 +1,102 @@
1
- .sg-carousel {
2
- position: relative;
3
- font-size: var(--sg-font-size);
4
- }
5
-
6
- .sg-carousel-vertical {
7
- display: flex;
8
- }
9
-
10
- .sg-carousel-container {
11
- position: relative;
12
- overflow: hidden;
13
- flex: 1;
14
- }
15
-
16
- .sg-carousel-track {
17
- position: relative;
18
- width: 100%;
19
- height: 100%;
20
- }
21
-
22
- /* Slide */
23
- .sg-carousel-slide {
24
- position: absolute;
25
- top: 0;
26
- left: 0;
27
- width: 100%;
28
- height: 100%;
29
- }
30
-
31
- .sg-carousel-slide-active {
32
- position: relative;
33
- }
34
-
35
- /* Slide effect */
36
- .sg-carousel-effect-slide {
37
- transition: transform var(--sg-transition-duration) var(--sg-transition-timing);
38
- }
39
-
40
- /* Fade effect */
41
- .sg-carousel-effect-fade {
42
- opacity: 0;
43
- transition: opacity var(--sg-transition-duration) var(--sg-transition-timing);
44
- }
45
-
46
- .sg-carousel-effect-fade.sg-carousel-slide-active {
47
- opacity: 1;
48
- }
49
-
50
- /* Dots */
51
- .sg-carousel-dots {
52
- display: flex;
53
- justify-content: center;
54
- gap: var(--sg-padding-xs);
55
- padding: var(--sg-padding-sm) 0;
56
- }
57
-
58
- .sg-carousel-dots-vertical {
59
- flex-direction: column;
60
- align-items: center;
61
- padding: 0 var(--sg-padding-sm);
62
- }
63
-
64
- /* Dot positions */
65
- .sg-carousel-dots-top > .sg-carousel-dots {
66
- order: -1;
67
- }
68
-
69
- .sg-carousel-dots-left {
70
- flex-direction: row-reverse;
71
- }
72
-
73
- .sg-carousel-dot {
74
- width: 16px;
75
- height: 3px;
76
- border: none;
77
- padding: 0;
78
- border-radius: 1px;
79
- background: var(--sg-color-text-disabled);
80
- cursor: pointer;
81
- transition: all var(--sg-transition-duration) var(--sg-transition-timing);
82
- outline: none;
83
- }
84
-
85
- .sg-carousel-dots-vertical .sg-carousel-dot {
86
- width: 3px;
87
- height: 16px;
88
- }
89
-
90
- .sg-carousel-dot:hover {
91
- background: var(--sg-color-text-tertiary);
92
- }
93
-
94
- .sg-carousel-dot-active {
95
- width: 24px;
96
- background: var(--sg-color-primary);
97
- }
98
-
99
- .sg-carousel-dots-vertical .sg-carousel-dot-active {
100
- width: 3px;
101
- height: 24px;
102
- }
1
+ .sg-carousel {
2
+ position: relative;
3
+ font-size: var(--sg-font-size);
4
+ }
5
+
6
+ .sg-carousel-vertical {
7
+ display: flex;
8
+ }
9
+
10
+ .sg-carousel-container {
11
+ position: relative;
12
+ overflow: hidden;
13
+ flex: 1;
14
+ }
15
+
16
+ .sg-carousel-track {
17
+ position: relative;
18
+ width: 100%;
19
+ height: 100%;
20
+ }
21
+
22
+ /* Slide */
23
+ .sg-carousel-slide {
24
+ position: absolute;
25
+ top: 0;
26
+ left: 0;
27
+ width: 100%;
28
+ height: 100%;
29
+ }
30
+
31
+ .sg-carousel-slide-active {
32
+ position: relative;
33
+ }
34
+
35
+ /* Slide effect */
36
+ .sg-carousel-effect-slide {
37
+ transition: transform var(--sg-transition-duration) var(--sg-transition-timing);
38
+ }
39
+
40
+ /* Fade effect */
41
+ .sg-carousel-effect-fade {
42
+ opacity: 0;
43
+ transition: opacity var(--sg-transition-duration) var(--sg-transition-timing);
44
+ }
45
+
46
+ .sg-carousel-effect-fade.sg-carousel-slide-active {
47
+ opacity: 1;
48
+ }
49
+
50
+ /* Dots */
51
+ .sg-carousel-dots {
52
+ display: flex;
53
+ justify-content: center;
54
+ gap: var(--sg-padding-xs);
55
+ padding: var(--sg-padding-sm) 0;
56
+ }
57
+
58
+ .sg-carousel-dots-vertical {
59
+ flex-direction: column;
60
+ align-items: center;
61
+ padding: 0 var(--sg-padding-sm);
62
+ }
63
+
64
+ /* Dot positions */
65
+ .sg-carousel-dots-top > .sg-carousel-dots {
66
+ order: -1;
67
+ }
68
+
69
+ .sg-carousel-dots-left {
70
+ flex-direction: row-reverse;
71
+ }
72
+
73
+ .sg-carousel-dot {
74
+ width: 16px;
75
+ height: 3px;
76
+ border: none;
77
+ padding: 0;
78
+ border-radius: 1px;
79
+ background: var(--sg-color-text-disabled);
80
+ cursor: pointer;
81
+ transition: all var(--sg-transition-duration) var(--sg-transition-timing);
82
+ outline: none;
83
+ }
84
+
85
+ .sg-carousel-dots-vertical .sg-carousel-dot {
86
+ width: 3px;
87
+ height: 16px;
88
+ }
89
+
90
+ .sg-carousel-dot:hover {
91
+ background: var(--sg-color-text-tertiary);
92
+ }
93
+
94
+ .sg-carousel-dot-active {
95
+ width: 24px;
96
+ background: var(--sg-color-primary);
97
+ }
98
+
99
+ .sg-carousel-dots-vertical .sg-carousel-dot-active {
100
+ width: 3px;
101
+ height: 24px;
102
+ }