testio-tailwind 3.13.0 → 3.15.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/package.json +1 -1
- package/src/assets/stylesheets/app.css +1 -0
- package/src/assets/stylesheets/components/button_group.css +11 -0
- package/src/assets/stylesheets/components/dropdown.css +1 -1
- package/src/assets/stylesheets/components/layout.css +1 -1
- package/src/assets/stylesheets/components/tables.css +15 -10
- package/src/pages/buttons/button_group.haml +16 -0
- package/src/pages/buttons/dropdown-menu.haml +1 -1
- package/src/pages/components/tables_formrow.haml +55 -0
package/package.json
CHANGED
|
@@ -26,6 +26,7 @@
|
|
|
26
26
|
@import './components/badges.css' layer(components);
|
|
27
27
|
@import './components/banner_card.css' layer(components);
|
|
28
28
|
@import './components/buttons.css' layer(components);
|
|
29
|
+
@import './components/button_group.css' layer(components);
|
|
29
30
|
@import './components/cards.css' layer(components);
|
|
30
31
|
@import './components/chat.css' layer(components);
|
|
31
32
|
@import './components/checkboxes_radiobuttons.css' layer(components);
|
|
@@ -3,11 +3,11 @@
|
|
|
3
3
|
@apply w-full mb-spacing;
|
|
4
4
|
|
|
5
5
|
th {
|
|
6
|
-
@apply py-xs dark:py-md px-sm align-middle border-t border-bordercolor dark:border-0 dark:bg-appbody dark:text-base dark:uppercase;
|
|
6
|
+
@apply py-xs dark:py-md px-sm dark:px-md align-middle border-t border-bordercolor dark:border-0 dark:bg-appbody dark:text-label dark:text-label-color dark:text-base dark:uppercase;
|
|
7
7
|
}
|
|
8
8
|
|
|
9
9
|
td {
|
|
10
|
-
@apply py-xs dark:py-md px-sm align-middle border-t border-bordercolor dark:border-0 dark:bg-black;
|
|
10
|
+
@apply py-xs dark:py-md px-sm dark:px-md align-middle border-t border-bordercolor dark:border-0 dark:bg-black;
|
|
11
11
|
}
|
|
12
12
|
|
|
13
13
|
tr {
|
|
@@ -25,20 +25,21 @@
|
|
|
25
25
|
|
|
26
26
|
.table-bordered {
|
|
27
27
|
@apply border dark:border-2 border-bordercolor dark:border-appbody;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
.table-bordered th,
|
|
31
|
+
.table-bordered td {
|
|
32
|
+
@apply border first:border-l-0 dark:border-0 border-bordercolor dark:border-appbody;
|
|
33
|
+
}
|
|
28
34
|
|
|
35
|
+
.table-bordered thead {
|
|
29
36
|
th,
|
|
30
37
|
td {
|
|
31
|
-
@apply border
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
thead {
|
|
35
|
-
th,
|
|
36
|
-
td {
|
|
37
|
-
@apply border-b border-bordercolor dark:border-appbody;
|
|
38
|
-
}
|
|
38
|
+
@apply border-b border-bordercolor dark:border-appbody;
|
|
39
39
|
}
|
|
40
40
|
}
|
|
41
41
|
|
|
42
|
+
|
|
42
43
|
.table td {
|
|
43
44
|
|
|
44
45
|
&.td-fixed-width {
|
|
@@ -55,6 +56,10 @@
|
|
|
55
56
|
}
|
|
56
57
|
}
|
|
57
58
|
|
|
59
|
+
.table.align-top td {
|
|
60
|
+
@apply align-top;
|
|
61
|
+
}
|
|
62
|
+
|
|
58
63
|
.table.table-borderless {
|
|
59
64
|
th {
|
|
60
65
|
border: 0;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: Button group
|
|
3
|
+
tags: button
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
.btn-group
|
|
7
|
+
%button.btn.btn-primary.btn-square
|
|
8
|
+
.icon.icon-check
|
|
9
|
+
%button.btn.btn-danger.btn-square
|
|
10
|
+
.icon.icon-cross
|
|
11
|
+
.pb-xs
|
|
12
|
+
.btn-group.borderless
|
|
13
|
+
%button.btn.btn-primary.btn-square
|
|
14
|
+
.icon.icon-check
|
|
15
|
+
%button.btn.btn-danger.btn-square
|
|
16
|
+
.icon.icon-cross
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
---
|
|
2
|
+
tags: ['components']
|
|
3
|
+
title: Table within form
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
%p.mb-xs Tables cannot contain form elements directly, instead wrap the whole table with a form element.
|
|
7
|
+
|
|
8
|
+
%form
|
|
9
|
+
%table.table.table-bordered.align-top
|
|
10
|
+
%thead
|
|
11
|
+
%th Table header
|
|
12
|
+
%th Table header
|
|
13
|
+
%th Table header
|
|
14
|
+
%th
|
|
15
|
+
%tbody
|
|
16
|
+
%tr
|
|
17
|
+
%td Cell content
|
|
18
|
+
%td Cell content
|
|
19
|
+
%td Cell content
|
|
20
|
+
%td.text-right
|
|
21
|
+
%details.dropdown-actions.dropright.ml-auto
|
|
22
|
+
%summary
|
|
23
|
+
.btn.btn-square
|
|
24
|
+
%span.icon.text-icon-default.icon-more
|
|
25
|
+
.popover-menu
|
|
26
|
+
%a.popover-action{href:'#'}
|
|
27
|
+
%span.icon.text-icon-default.icon-pencil
|
|
28
|
+
Edit
|
|
29
|
+
%a.popover-action{href:'#'}
|
|
30
|
+
%span.icon.text-icon-default.icon-duplicate
|
|
31
|
+
Duplicate
|
|
32
|
+
%a.popover-action{href:'#'}
|
|
33
|
+
%span.icon.text-icon-default.icon-remove
|
|
34
|
+
Delete
|
|
35
|
+
%tr
|
|
36
|
+
%td
|
|
37
|
+
%select.tom-select.min-w-spacing-4xl{placeholder: "Please select"}
|
|
38
|
+
%option{value: ""}
|
|
39
|
+
%option{value:"Option 1"} Option 1
|
|
40
|
+
%option{value:"Option 2"} Option 2
|
|
41
|
+
%option{value:"Option 3"} Option 3
|
|
42
|
+
%option{value:"Option 4"} ABC
|
|
43
|
+
%option{value:"Option 5"} DEF
|
|
44
|
+
%option{value:"Option 6"} WHY
|
|
45
|
+
%option{value:"Option 7"} XYZ
|
|
46
|
+
%td
|
|
47
|
+
%input.form-control.min-w-spacing-4xl{type:'text', placeholder:"Add min-w to avoid squishing"}
|
|
48
|
+
%td
|
|
49
|
+
%textarea.form-control.min-w-spacing-4xl{rows:'1', placeholder:"Text area with min-w"}
|
|
50
|
+
%td.text-right
|
|
51
|
+
.btn-group.ml-auto
|
|
52
|
+
%button.btn.btn-primary.btn-square
|
|
53
|
+
.icon.icon-check
|
|
54
|
+
%button.btn.btn-danger.btn-square
|
|
55
|
+
.icon.icon-cross
|