agroptima-design-system 0.34.7 → 0.34.8
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
CHANGED
|
@@ -76,8 +76,7 @@
|
|
|
76
76
|
}
|
|
77
77
|
}
|
|
78
78
|
|
|
79
|
-
&.primary
|
|
80
|
-
&.secondary {
|
|
79
|
+
&.primary {
|
|
81
80
|
&:disabled {
|
|
82
81
|
> .icon {
|
|
83
82
|
> svg {
|
|
@@ -89,4 +88,18 @@
|
|
|
89
88
|
}
|
|
90
89
|
}
|
|
91
90
|
}
|
|
91
|
+
|
|
92
|
+
&.secondary {
|
|
93
|
+
&:disabled {
|
|
94
|
+
> .icon {
|
|
95
|
+
> svg {
|
|
96
|
+
fill: color_alias.$neutral-white;
|
|
97
|
+
fill-opacity: 0.6;
|
|
98
|
+
path {
|
|
99
|
+
fill: color_alias.$neutral-white;
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
}
|
|
92
105
|
}
|
|
@@ -24,13 +24,24 @@
|
|
|
24
24
|
border-spacing: 0 config.$space-2x;
|
|
25
25
|
width: 100%;
|
|
26
26
|
|
|
27
|
+
&.is-sticky {
|
|
28
|
+
.cards-table-header {
|
|
29
|
+
position: sticky;
|
|
30
|
+
top: 60px;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.cards-table-head {
|
|
34
|
+
position: relative;
|
|
35
|
+
z-index: 1;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
27
39
|
.cards-table-header,
|
|
28
40
|
.cards-table-cell {
|
|
29
41
|
vertical-align: top;
|
|
30
42
|
padding: config.$space-2x config.$space-3x;
|
|
31
43
|
}
|
|
32
44
|
|
|
33
|
-
|
|
34
45
|
.cards-table-body .cards-table-row {
|
|
35
46
|
box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.25);
|
|
36
47
|
cursor: default;
|
|
@@ -99,7 +110,7 @@
|
|
|
99
110
|
&.with-title .cards-table-row > .cards-table-cell:first-child {
|
|
100
111
|
@include typography.cards-table-list-highlight-text;
|
|
101
112
|
}
|
|
102
|
-
|
|
113
|
+
|
|
103
114
|
.cards-table-row.disabled {
|
|
104
115
|
background: color_alias.$neutral-color-50;
|
|
105
116
|
.cards-table-cell {
|
|
@@ -123,7 +134,7 @@
|
|
|
123
134
|
> .cards-table-cell {
|
|
124
135
|
border-color: color_alias.$primary-color-1000;
|
|
125
136
|
}
|
|
126
|
-
}
|
|
137
|
+
}
|
|
127
138
|
}
|
|
128
139
|
|
|
129
140
|
@media only screen and (max-width: breakpoints.$large) {
|
|
@@ -7,6 +7,7 @@ export interface CardsTableProps
|
|
|
7
7
|
extends React.ComponentPropsWithoutRef<'table'> {
|
|
8
8
|
variant?: Variant
|
|
9
9
|
withTitle?: boolean
|
|
10
|
+
isSticky?: boolean
|
|
10
11
|
}
|
|
11
12
|
|
|
12
13
|
export function CardsTable({
|
|
@@ -14,11 +15,13 @@ export function CardsTable({
|
|
|
14
15
|
summary,
|
|
15
16
|
variant = 'primary',
|
|
16
17
|
withTitle = false,
|
|
18
|
+
isSticky = false,
|
|
17
19
|
children,
|
|
18
20
|
...props
|
|
19
21
|
}: CardsTableProps): React.JSX.Element {
|
|
20
22
|
const cssClasses = classNames('cards-table-list', variant, className, {
|
|
21
23
|
'with-title': withTitle,
|
|
24
|
+
'is-sticky': isSticky,
|
|
22
25
|
})
|
|
23
26
|
return (
|
|
24
27
|
<table summary={summary} role="table" className={cssClasses} {...props}>
|
package/src/atoms/Drawer.scss
CHANGED
|
@@ -8,6 +8,9 @@
|
|
|
8
8
|
display: flex;
|
|
9
9
|
justify-content: flex-end;
|
|
10
10
|
z-index: depth.$z-modal;
|
|
11
|
+
position: fixed;
|
|
12
|
+
top: 0;
|
|
13
|
+
right: 0;
|
|
11
14
|
|
|
12
15
|
.backdrop {
|
|
13
16
|
position: fixed;
|
|
@@ -86,10 +89,13 @@
|
|
|
86
89
|
}
|
|
87
90
|
}
|
|
88
91
|
}
|
|
92
|
+
}
|
|
93
|
+
// Media queries
|
|
94
|
+
// Mobile & tablet cases
|
|
95
|
+
@media only screen and (max-width: breakpoints.$medium) {
|
|
96
|
+
.drawer-container {
|
|
97
|
+
width: 100%;
|
|
89
98
|
|
|
90
|
-
// Media queries
|
|
91
|
-
// Mobile & tablet cases
|
|
92
|
-
@media only screen and (max-width: breakpoints.$medium) {
|
|
93
99
|
.drawer {
|
|
94
100
|
width: 100%;
|
|
95
101
|
}
|
|
@@ -4,6 +4,12 @@ import { Meta } from "@storybook/blocks";
|
|
|
4
4
|
|
|
5
5
|
# Changelog
|
|
6
6
|
|
|
7
|
+
## 0.34.8
|
|
8
|
+
|
|
9
|
+
* Add fixed position to Drawer component container due to bug related with sticky CardsTable
|
|
10
|
+
* Add sticky styles to CardsTable component
|
|
11
|
+
* Add opacity style on IconButton secondary variant
|
|
12
|
+
|
|
7
13
|
## 0.34.7
|
|
8
14
|
|
|
9
15
|
* Fix TabMenu hover link border
|