@redseed/redseed-ui-tailwindcss 7.0.2 → 7.1.0
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/badge.css +4 -0
- package/components/comment.css +112 -0
- package/components/comments.css +4 -0
- package/components.css +87 -0
- package/index.css +1 -86
- package/package.json +1 -1
- package/tokens.css +2 -1
package/components/badge.css
CHANGED
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
.rsui-comment {
|
|
2
|
+
@apply @container/comment;
|
|
3
|
+
@apply flex flex-col w-11/12;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
.rsui-comment--owned {
|
|
7
|
+
@apply pl-8 w-full;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.rsui-comment--private {
|
|
11
|
+
@apply pl-8 w-full;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.rsui-comment--no-photo {
|
|
15
|
+
@apply pl-8;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.rsui-comment__header {
|
|
19
|
+
@apply flex flex-row items-center gap-2;
|
|
20
|
+
|
|
21
|
+
/* Add padding bottom to the header when container is at least medium size */
|
|
22
|
+
@apply @md/comment:pb-1;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
.rsui-comment__header--allow-actions {
|
|
26
|
+
@apply pb-0;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.rsui-comment__header-start {
|
|
30
|
+
@apply flex-1 flex flex-col gap-y-1 gap-x-2;
|
|
31
|
+
|
|
32
|
+
/* Flex the header start when container is at least medium size */
|
|
33
|
+
@apply @md/comment:flex-row;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
.rsui-comment__header-end {
|
|
37
|
+
@apply shrink-0 hidden flex-row items-center gap-2 ml-auto;
|
|
38
|
+
|
|
39
|
+
/* Show the header end when container is at least medium size */
|
|
40
|
+
@apply @md/comment:flex;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.rsui-comment__author {
|
|
44
|
+
@apply flex flex-row gap-2;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.rsui-comment__author-photo {
|
|
48
|
+
@apply shrink-0 flex;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.rsui-comment__author-name {
|
|
52
|
+
@apply text-sm font-medium text-text-primary;
|
|
53
|
+
|
|
54
|
+
/* Add leading to the author name when container is at least medium size */
|
|
55
|
+
@apply @md/comment:leading-6;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
.rsui-comment--owned .rsui-comment__meta, .rsui-comment--private .rsui-comment__meta {
|
|
59
|
+
@apply ml-0;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
.rsui-comment__meta {
|
|
63
|
+
@apply shrink-0 flex flex-row items-center gap-2 ml-8;
|
|
64
|
+
|
|
65
|
+
/* Remove the margin from the meta when container is at least medium size */
|
|
66
|
+
@apply @md/comment:ml-0;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
.rsui-comment__meta-time {
|
|
70
|
+
@apply shrink-0 text-xs text-text-tertiary;
|
|
71
|
+
|
|
72
|
+
/* Add leading to the time when container is at least medium size */
|
|
73
|
+
@apply @md/comment:leading-6;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.rsui-comment__actions {
|
|
77
|
+
@apply flex flex-row items-center gap-1;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.rsui-comment__body {
|
|
81
|
+
@apply py-3 px-4 rounded-xl border;
|
|
82
|
+
@apply rounded-tl-none ml-8;
|
|
83
|
+
@apply text-text-primary bg-background-primary;
|
|
84
|
+
@apply border-border-primary;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
.rsui-comment__body--owned {
|
|
88
|
+
@apply rounded-tl-xl rounded-tr-none ml-0;
|
|
89
|
+
@apply text-text-on-color bg-background-info-contrast;
|
|
90
|
+
@apply border-border-info;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
.rsui-comment__body--private {
|
|
94
|
+
@apply rounded-tl-xl rounded-tr-none ml-0 w-full;
|
|
95
|
+
@apply text-text-on-color bg-background-secondary-contrast;
|
|
96
|
+
@apply border-border-secondary;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
.rsui-comment__body--no-photo {
|
|
100
|
+
@apply ml-0;
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
.rsui-comment__footer {
|
|
104
|
+
@apply flex flex-row items-center justify-between gap-2;
|
|
105
|
+
|
|
106
|
+
/* Hide the footer when container is at least medium size */
|
|
107
|
+
@apply @md/comment:hidden;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.rsui-comment__footer-end {
|
|
111
|
+
@apply shrink-0 flex flex-row items-center gap-2 ml-auto;
|
|
112
|
+
}
|
package/components.css
ADDED
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
@import './components/button_slot.css';
|
|
2
|
+
@import './components/button_primary.css';
|
|
3
|
+
@import './components/button_secondary.css';
|
|
4
|
+
@import './components/button_tertiary.css';
|
|
5
|
+
@import './components/avatar_text.css';
|
|
6
|
+
@import './components/button_card.css';
|
|
7
|
+
@import './components/checkbox_card.css';
|
|
8
|
+
@import './components/badge.css';
|
|
9
|
+
@import './components/badge_group.css';
|
|
10
|
+
@import './components/breadcrumbs.css';
|
|
11
|
+
@import './components/card.css';
|
|
12
|
+
@import './components/card_header.css';
|
|
13
|
+
@import './components/card_group.css';
|
|
14
|
+
@import './components/comment.css';
|
|
15
|
+
@import './components/comments.css';
|
|
16
|
+
@import './components/disclosure.css';
|
|
17
|
+
@import './components/form_field_checkbox.css';
|
|
18
|
+
@import './components/form_field_password.css';
|
|
19
|
+
@import './components/form_field_radio_group.css';
|
|
20
|
+
@import './components/form_field_search.css';
|
|
21
|
+
@import './components/form_field_select.css';
|
|
22
|
+
@import './components/form_fieldset.css';
|
|
23
|
+
@import './components/form_field_slot.css';
|
|
24
|
+
@import './components/form_field_suffix.css';
|
|
25
|
+
@import './components/form_field_text.css';
|
|
26
|
+
@import './components/form_field_textarea.css';
|
|
27
|
+
@import './components/form_field_uploader.css';
|
|
28
|
+
@import './components/form_field_combobox.css';
|
|
29
|
+
@import './components/form_fields_login.css';
|
|
30
|
+
@import './components/form_fields_register.css';
|
|
31
|
+
@import './components/form_slot.css';
|
|
32
|
+
@import './components/form_wrapper_build.css';
|
|
33
|
+
@import './components/form_wrapper_lms.css';
|
|
34
|
+
@import './components/button_group.css';
|
|
35
|
+
@import './components/button_group_item.css';
|
|
36
|
+
@import './components/body_text.css';
|
|
37
|
+
@import './components/dropdown_menu.css';
|
|
38
|
+
@import './components/dropdown_option.css';
|
|
39
|
+
@import './components/empty.css';
|
|
40
|
+
@import './components/link_primary.css';
|
|
41
|
+
@import './components/link_slot.css';
|
|
42
|
+
@import './components/logo.css';
|
|
43
|
+
@import './components/icon.css';
|
|
44
|
+
@import './components/image.css';
|
|
45
|
+
@import './components/image_16by9.css';
|
|
46
|
+
@import './components/image_3by1.css';
|
|
47
|
+
@import './components/image_64by25.css';
|
|
48
|
+
@import './components/image_9by16.css';
|
|
49
|
+
@import './components/image_circle.css';
|
|
50
|
+
@import './components/hero_section.css';
|
|
51
|
+
@import './components/list_control.css';
|
|
52
|
+
@import './components/list.css';
|
|
53
|
+
@import './components/list_item.css';
|
|
54
|
+
@import './components/loader.css';
|
|
55
|
+
@import './components/metric_card.css';
|
|
56
|
+
@import './components/meta_info.css';
|
|
57
|
+
@import './components/message_box.css';
|
|
58
|
+
@import './components/activity_feed.css';
|
|
59
|
+
@import './components/feed_item.css';
|
|
60
|
+
@import './components/linked_list.css';
|
|
61
|
+
@import './components/linked_list_item.css';
|
|
62
|
+
@import './components/modal.css';
|
|
63
|
+
@import './components/pagination.css';
|
|
64
|
+
@import './components/page_header.css';
|
|
65
|
+
@import './components/radio_card.css';
|
|
66
|
+
@import './components/pagination_item.css';
|
|
67
|
+
@import './components/pagination_item_next.css';
|
|
68
|
+
@import './components/pagination_item_previous.css';
|
|
69
|
+
@import './components/read_more.css';
|
|
70
|
+
@import './components/record_count.css';
|
|
71
|
+
@import './components/progress_tracker.css';
|
|
72
|
+
@import './components/progress_tracker_step.css';
|
|
73
|
+
@import './components/progress_circle.css';
|
|
74
|
+
@import './components/section_footer.css';
|
|
75
|
+
@import './components/section_header.css';
|
|
76
|
+
@import './components/section.css';
|
|
77
|
+
@import './components/switcher.css';
|
|
78
|
+
@import './components/switcher_item.css';
|
|
79
|
+
@import './components/toggle.css';
|
|
80
|
+
@import './components/sorting.css';
|
|
81
|
+
@import './components/td.css';
|
|
82
|
+
@import './components/td_user.css';
|
|
83
|
+
@import './components/th.css';
|
|
84
|
+
@import './components/single_column_layout.css';
|
|
85
|
+
@import './components/two_column_layout.css';
|
|
86
|
+
@import './components/tr.css';
|
|
87
|
+
@import './components/table.css';
|
package/index.css
CHANGED
|
@@ -3,89 +3,4 @@
|
|
|
3
3
|
@import './colors_dark_mode.css';
|
|
4
4
|
@import './theme.css';
|
|
5
5
|
@import './tokens.css';
|
|
6
|
-
|
|
7
|
-
@import './components/button_slot.css';
|
|
8
|
-
@import './components/button_primary.css';
|
|
9
|
-
@import './components/button_secondary.css';
|
|
10
|
-
@import './components/button_tertiary.css';
|
|
11
|
-
@import './components/avatar_text.css';
|
|
12
|
-
@import './components/button_card.css';
|
|
13
|
-
@import './components/checkbox_card.css';
|
|
14
|
-
@import './components/badge.css';
|
|
15
|
-
@import './components/badge_group.css';
|
|
16
|
-
@import './components/breadcrumbs.css';
|
|
17
|
-
@import './components/card.css';
|
|
18
|
-
@import './components/card_header.css';
|
|
19
|
-
@import './components/card_group.css';
|
|
20
|
-
@import './components/disclosure.css';
|
|
21
|
-
@import './components/form_field_checkbox.css';
|
|
22
|
-
@import './components/form_field_password.css';
|
|
23
|
-
@import './components/form_field_radio_group.css';
|
|
24
|
-
@import './components/form_field_search.css';
|
|
25
|
-
@import './components/form_field_select.css';
|
|
26
|
-
@import './components/form_fieldset.css';
|
|
27
|
-
@import './components/form_field_slot.css';
|
|
28
|
-
@import './components/form_field_suffix.css';
|
|
29
|
-
@import './components/form_field_text.css';
|
|
30
|
-
@import './components/form_field_textarea.css';
|
|
31
|
-
@import './components/form_field_uploader.css';
|
|
32
|
-
@import './components/form_field_combobox.css';
|
|
33
|
-
@import './components/form_fields_login.css';
|
|
34
|
-
@import './components/form_fields_register.css';
|
|
35
|
-
@import './components/form_slot.css';
|
|
36
|
-
@import './components/form_wrapper_build.css';
|
|
37
|
-
@import './components/form_wrapper_lms.css';
|
|
38
|
-
@import './components/button_group.css';
|
|
39
|
-
@import './components/button_group_item.css';
|
|
40
|
-
@import './components/body_text.css';
|
|
41
|
-
@import './components/dropdown_menu.css';
|
|
42
|
-
@import './components/dropdown_option.css';
|
|
43
|
-
@import './components/empty.css';
|
|
44
|
-
@import './components/link_primary.css';
|
|
45
|
-
@import './components/link_slot.css';
|
|
46
|
-
@import './components/logo.css';
|
|
47
|
-
@import './components/icon.css';
|
|
48
|
-
@import './components/image.css';
|
|
49
|
-
@import './components/image_16by9.css';
|
|
50
|
-
@import './components/image_3by1.css';
|
|
51
|
-
@import './components/image_64by25.css';
|
|
52
|
-
@import './components/image_9by16.css';
|
|
53
|
-
@import './components/image_circle.css';
|
|
54
|
-
@import './components/hero_section.css';
|
|
55
|
-
@import './components/list_control.css';
|
|
56
|
-
@import './components/list.css';
|
|
57
|
-
@import './components/list_item.css';
|
|
58
|
-
@import './components/loader.css';
|
|
59
|
-
@import './components/metric_card.css';
|
|
60
|
-
@import './components/meta_info.css';
|
|
61
|
-
@import './components/message_box.css';
|
|
62
|
-
@import './components/activity_feed.css';
|
|
63
|
-
@import './components/feed_item.css';
|
|
64
|
-
@import './components/linked_list.css';
|
|
65
|
-
@import './components/linked_list_item.css';
|
|
66
|
-
@import './components/modal.css';
|
|
67
|
-
@import './components/pagination.css';
|
|
68
|
-
@import './components/page_header.css';
|
|
69
|
-
@import './components/radio_card.css';
|
|
70
|
-
@import './components/pagination_item.css';
|
|
71
|
-
@import './components/pagination_item_next.css';
|
|
72
|
-
@import './components/pagination_item_previous.css';
|
|
73
|
-
@import './components/read_more.css';
|
|
74
|
-
@import './components/record_count.css';
|
|
75
|
-
@import './components/progress_tracker.css';
|
|
76
|
-
@import './components/progress_tracker_step.css';
|
|
77
|
-
@import './components/progress_circle.css';
|
|
78
|
-
@import './components/section_footer.css';
|
|
79
|
-
@import './components/section_header.css';
|
|
80
|
-
@import './components/section.css';
|
|
81
|
-
@import './components/switcher.css';
|
|
82
|
-
@import './components/switcher_item.css';
|
|
83
|
-
@import './components/toggle.css';
|
|
84
|
-
@import './components/sorting.css';
|
|
85
|
-
@import './components/td.css';
|
|
86
|
-
@import './components/td_user.css';
|
|
87
|
-
@import './components/th.css';
|
|
88
|
-
@import './components/single_column_layout.css';
|
|
89
|
-
@import './components/two_column_layout.css';
|
|
90
|
-
@import './components/tr.css';
|
|
91
|
-
@import './components/table.css';
|
|
6
|
+
@import './components.css';
|
package/package.json
CHANGED
package/tokens.css
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
@theme inline {
|
|
2
2
|
--color-text-primary: var(--Colors-Grey-900);
|
|
3
|
-
--color-text-secondary: var(--Colors-Grey-
|
|
3
|
+
--color-text-secondary: var(--Colors-Grey-700);
|
|
4
|
+
--color-text-tertiary: var(--Colors-Grey-600);
|
|
4
5
|
--color-text-brand: var(--Colors-Brand-500);
|
|
5
6
|
--color-text-disabled: var(--Colors-Grey-300);
|
|
6
7
|
--color-text-success: var(--Colors-RedSeed-Green-500);
|