@pingux/astro 1.26.1-alpha.2 → 1.26.1-alpha.3
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/lib/cjs/recipes/Arrow.stories.js +17 -13
- package/lib/recipes/Arrow.stories.js +17 -13
- package/package.json +1 -1
|
@@ -23,24 +23,28 @@ var _default = {
|
|
|
23
23
|
};
|
|
24
24
|
exports["default"] = _default;
|
|
25
25
|
var ArrowIcon = "\u25BA";
|
|
26
|
+
var sx = {
|
|
27
|
+
wrapper: {
|
|
28
|
+
height: '8px',
|
|
29
|
+
width: '80px',
|
|
30
|
+
alignItems: 'center'
|
|
31
|
+
},
|
|
32
|
+
arrowLine: {
|
|
33
|
+
width: '100%',
|
|
34
|
+
// Use this instead of border property, to avoid cropping of strokes in Safari and FF
|
|
35
|
+
backgroundImage: "linear-gradient(to right, ".concat(_colors.line.light, " 50%, white 50%)"),
|
|
36
|
+
backgroundRepeat: 'repeat-x',
|
|
37
|
+
backgroundSize: '10px 2px',
|
|
38
|
+
height: '2px'
|
|
39
|
+
}
|
|
40
|
+
};
|
|
26
41
|
|
|
27
42
|
var Default = function Default() {
|
|
28
43
|
return (0, _react2.jsx)(_Box["default"], {
|
|
29
44
|
isRow: true,
|
|
30
|
-
|
|
31
|
-
width: 80,
|
|
32
|
-
sx: {
|
|
33
|
-
'align-items': 'center'
|
|
34
|
-
}
|
|
45
|
+
sx: sx.wrapper
|
|
35
46
|
}, (0, _react2.jsx)(_Box["default"], {
|
|
36
|
-
|
|
37
|
-
,
|
|
38
|
-
sx: {
|
|
39
|
-
backgroundImage: "linear-gradient(to right, ".concat(_colors.line.light, " 50%, white 50%)"),
|
|
40
|
-
backgroundRepeat: 'repeat-x',
|
|
41
|
-
backgroundSize: '10px 2px',
|
|
42
|
-
height: 2
|
|
43
|
-
}
|
|
47
|
+
sx: sx.arrowLine
|
|
44
48
|
}), (0, _react2.jsx)(_Box["default"], {
|
|
45
49
|
color: "line.regular"
|
|
46
50
|
}, ArrowIcon));
|
|
@@ -6,23 +6,27 @@ export default {
|
|
|
6
6
|
title: 'Recipes/Arrow'
|
|
7
7
|
};
|
|
8
8
|
var ArrowIcon = "\u25BA";
|
|
9
|
+
var sx = {
|
|
10
|
+
wrapper: {
|
|
11
|
+
height: '8px',
|
|
12
|
+
width: '80px',
|
|
13
|
+
alignItems: 'center'
|
|
14
|
+
},
|
|
15
|
+
arrowLine: {
|
|
16
|
+
width: '100%',
|
|
17
|
+
// Use this instead of border property, to avoid cropping of strokes in Safari and FF
|
|
18
|
+
backgroundImage: "linear-gradient(to right, ".concat(line.light, " 50%, white 50%)"),
|
|
19
|
+
backgroundRepeat: 'repeat-x',
|
|
20
|
+
backgroundSize: '10px 2px',
|
|
21
|
+
height: '2px'
|
|
22
|
+
}
|
|
23
|
+
};
|
|
9
24
|
export var Default = function Default() {
|
|
10
25
|
return ___EmotionJSX(Box, {
|
|
11
26
|
isRow: true,
|
|
12
|
-
|
|
13
|
-
width: 80,
|
|
14
|
-
sx: {
|
|
15
|
-
'align-items': 'center'
|
|
16
|
-
}
|
|
27
|
+
sx: sx.wrapper
|
|
17
28
|
}, ___EmotionJSX(Box, {
|
|
18
|
-
|
|
19
|
-
,
|
|
20
|
-
sx: {
|
|
21
|
-
backgroundImage: "linear-gradient(to right, ".concat(line.light, " 50%, white 50%)"),
|
|
22
|
-
backgroundRepeat: 'repeat-x',
|
|
23
|
-
backgroundSize: '10px 2px',
|
|
24
|
-
height: 2
|
|
25
|
-
}
|
|
29
|
+
sx: sx.arrowLine
|
|
26
30
|
}), ___EmotionJSX(Box, {
|
|
27
31
|
color: "line.regular"
|
|
28
32
|
}, ArrowIcon));
|