agroptima-design-system 0.21.1 → 0.21.2
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
package/src/atoms/Card/Card.scss
CHANGED
|
@@ -60,6 +60,7 @@
|
|
|
60
60
|
&.primary {
|
|
61
61
|
@include typography.body-regular-primary;
|
|
62
62
|
box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.25);
|
|
63
|
+
border: 1px solid transparent;
|
|
63
64
|
|
|
64
65
|
&.disabled {
|
|
65
66
|
@include typography.body-regular-disabled;
|
|
@@ -73,5 +74,11 @@
|
|
|
73
74
|
border: 1px solid color_alias.$primary-color-1000;
|
|
74
75
|
box-shadow: none;
|
|
75
76
|
}
|
|
77
|
+
|
|
78
|
+
&.error {
|
|
79
|
+
border: 1px solid color_alias.$error-color-600;
|
|
80
|
+
background-color: color_alias.$error-color-50;
|
|
81
|
+
box-shadow: none;
|
|
82
|
+
}
|
|
76
83
|
}
|
|
77
84
|
}
|
package/src/atoms/Card/Card.tsx
CHANGED
|
@@ -8,6 +8,7 @@ export interface CardProps extends React.ComponentPropsWithoutRef<'div'> {
|
|
|
8
8
|
variant?: Variant
|
|
9
9
|
isDisabled?: boolean
|
|
10
10
|
isActive?: boolean
|
|
11
|
+
error?: boolean
|
|
11
12
|
}
|
|
12
13
|
|
|
13
14
|
export function Card({
|
|
@@ -15,12 +16,14 @@ export function Card({
|
|
|
15
16
|
variant = 'primary',
|
|
16
17
|
isDisabled = false,
|
|
17
18
|
isActive = false,
|
|
19
|
+
error = false,
|
|
18
20
|
children,
|
|
19
21
|
...props
|
|
20
22
|
}: CardProps): React.JSX.Element {
|
|
21
23
|
const cssClasses = classNames('card', className, variant, {
|
|
22
24
|
disabled: isDisabled,
|
|
23
25
|
active: isActive,
|
|
26
|
+
error: error,
|
|
24
27
|
})
|
|
25
28
|
|
|
26
29
|
return (
|
|
@@ -56,7 +56,6 @@
|
|
|
56
56
|
|
|
57
57
|
&.primary {
|
|
58
58
|
background: color_alias.$neutral-white;
|
|
59
|
-
border-top: 1px solid color_alias.$neutral-color-200;
|
|
60
59
|
border-bottom: 1px solid color_alias.$neutral-color-200;
|
|
61
60
|
|
|
62
61
|
&.active {
|
|
@@ -81,8 +80,6 @@
|
|
|
81
80
|
|
|
82
81
|
&:not(.disabled):hover {
|
|
83
82
|
background: color_alias.$primary-color-50;
|
|
84
|
-
border-top: 1px solid color_alias.$neutral-color-200;
|
|
85
|
-
border-bottom: 1px solid color_alias.$neutral-color-200;
|
|
86
83
|
}
|
|
87
84
|
|
|
88
85
|
&.disabled {
|
package/src/atoms/Input.scss
CHANGED
|
@@ -4,6 +4,12 @@ import { Meta } from "@storybook/blocks";
|
|
|
4
4
|
|
|
5
5
|
# Changelog
|
|
6
6
|
|
|
7
|
+
## 0.21.2
|
|
8
|
+
|
|
9
|
+
* Update Card with error state
|
|
10
|
+
* Update styles for component CardMenuOption
|
|
11
|
+
* Add width 100% for input date component in safari mobile
|
|
12
|
+
|
|
7
13
|
## 0.21.1
|
|
8
14
|
|
|
9
15
|
* Create Typography examples page
|