@yogiswara/honcho-editor-ui 3.6.8 → 3.6.9
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.
|
@@ -23,7 +23,7 @@ export default function HImageEditorSkeleton(props) {
|
|
|
23
23
|
transform: 'scale(0.92)',
|
|
24
24
|
},
|
|
25
25
|
transition: 'transform 0.1s ease-in-out',
|
|
26
|
-
}, children: _jsx(CardMedia, { title: "back", src: "svg/Back.svg", component: "img" }) }) }), _jsx(Stack, { direction: "row", justifyContent: "flex-end", alignItems: "center", spacing: 0.1, sx: { pt: !isMobile ? "0px" : "2px", pr: isMobile ? "10px" : "
|
|
26
|
+
}, children: _jsx(CardMedia, { title: "back", src: "svg/Back.svg", component: "img" }) }) }), _jsx(Stack, { direction: "row", justifyContent: "flex-end", alignItems: "center", spacing: 0.1, sx: { pt: !isMobile ? "0px" : "2px", pr: isMobile ? "10px" : "6px" }, children: _jsx(Skeleton, { variant: "rounded", width: "110px", height: "18px",
|
|
27
27
|
// animation="wave"
|
|
28
28
|
sx: {
|
|
29
29
|
bgcolor: alpha(colors.background, 0.1),
|
|
@@ -38,35 +38,35 @@ export default function HImageEditorSkeleton(props) {
|
|
|
38
38
|
position: 'inherit',
|
|
39
39
|
right: '40px',
|
|
40
40
|
top: '55px',
|
|
41
|
-
width: '
|
|
41
|
+
width: '272px',
|
|
42
42
|
pt: '4px',
|
|
43
43
|
height: 'calc(100vh - 70px)',
|
|
44
44
|
zIndex: 1200,
|
|
45
45
|
backgroundColor: '#000000',
|
|
46
46
|
overflow: 'hidden',
|
|
47
|
-
}, children: _jsxs(Stack, { direction: "row", sx: { height: '100%', p: "0px" }, children: [_jsxs(Stack, { direction: "column", sx: { height: '95%' }, children: [_jsx(Box, { sx: { display: 'flex', flexDirection: 'column', p: "0px", pt: "8px" }, children: _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', py: "6px", gap: "8px" }, children: [_jsx(Skeleton, { variant: "rounded", width: "
|
|
47
|
+
}, children: _jsxs(Stack, { direction: "row", sx: { height: '100%', p: "0px" }, children: [_jsxs(Stack, { direction: "column", sx: { height: '95%' }, children: [_jsx(Box, { sx: { display: 'flex', flexDirection: 'column', p: "0px", pt: "8px" }, children: _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', py: "6px", gap: "8px" }, children: [_jsx(Skeleton, { variant: "rounded", width: "198px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.1), } }), _jsx(Skeleton, { variant: "rounded", width: "198px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.07), } })] }) }), _jsx(Box, { sx: { display: 'flex', flexDirection: 'column', p: "0px", pt: "8px" }, children: _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', py: "6px", gap: "8px" }, children: [_jsx(Skeleton, { variant: "rounded", width: "198px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.1), } }), _jsx(Skeleton, { variant: "rounded", width: "198px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.07), } })] }) }), _jsx(Box, { sx: { display: 'flex', flexDirection: 'column', p: "0px", pt: "8px" }, children: _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', py: "6px", gap: "8px" }, children: [_jsx(Skeleton, { variant: "rounded", width: "198px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.1), } }), _jsx(Skeleton, { variant: "rounded", width: "198px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.07), } })] }) })] }), _jsxs(Stack, { justifyContent: "flex-start",
|
|
48
48
|
// spacing={"15px"}
|
|
49
49
|
sx: {
|
|
50
|
-
width: '10px',
|
|
50
|
+
// width: '10px',
|
|
51
51
|
flexShrink: 0,
|
|
52
52
|
pt: "0px",
|
|
53
|
-
pl: "
|
|
53
|
+
pl: "8px",
|
|
54
54
|
}, children: [_jsx(Box, { sx: {
|
|
55
55
|
width: "50px",
|
|
56
|
-
height: "
|
|
56
|
+
height: "48px",
|
|
57
57
|
py: "17px",
|
|
58
58
|
px: "16px",
|
|
59
|
-
}, children: _jsx(Skeleton, { variant: "circular", width:
|
|
59
|
+
}, children: _jsx(Skeleton, { variant: "circular", width: 20, height: 20, sx: { bgcolor: alpha(colors.background, 0.1), } }) }), _jsx(Box, { sx: {
|
|
60
60
|
width: "50px",
|
|
61
|
-
height: "
|
|
61
|
+
height: "48px",
|
|
62
62
|
py: "17px",
|
|
63
63
|
px: "16px",
|
|
64
|
-
}, children: _jsx(Skeleton, { variant: "circular", width:
|
|
64
|
+
}, children: _jsx(Skeleton, { variant: "circular", width: 20, height: 20, sx: { bgcolor: alpha(colors.background, 0.1), } }) }), _jsx(Box, { sx: {
|
|
65
65
|
width: "50px",
|
|
66
|
-
height: "
|
|
66
|
+
height: "48px",
|
|
67
67
|
py: "17px",
|
|
68
68
|
px: "16px",
|
|
69
|
-
}, children: _jsx(Skeleton, { variant: "circular", width:
|
|
69
|
+
}, children: _jsx(Skeleton, { variant: "circular", width: 20, height: 20, sx: { bgcolor: alpha(colors.background, 0.1), } }) })] })] }) })), isMobile && (_jsx(Paper, { elevation: 0, sx: {
|
|
70
70
|
position: 'fixed',
|
|
71
71
|
bottom: 0,
|
|
72
72
|
left: 0,
|
|
@@ -78,10 +78,10 @@ export default function HImageEditorSkeleton(props) {
|
|
|
78
78
|
pt: "110px",
|
|
79
79
|
// px: "143px",
|
|
80
80
|
gap: "10px"
|
|
81
|
-
}, children: _jsx(Skeleton, { variant: "rounded", width: "
|
|
82
|
-
pt: "
|
|
83
|
-
pb: "
|
|
81
|
+
}, children: _jsx(Skeleton, { variant: "rounded", width: "260px", height: 18, sx: { bgcolor: alpha(colors.background, 0.1), } }) }), _jsx(Stack, { direction: "row", justifyContent: "center", alignItems: "center", sx: {
|
|
82
|
+
pt: "24px",
|
|
83
|
+
pb: "16px",
|
|
84
84
|
px: "16px",
|
|
85
85
|
gap: "24px"
|
|
86
|
-
}, children: _jsx(Skeleton, { variant: "rounded", width:
|
|
86
|
+
}, children: _jsx(Skeleton, { variant: "rounded", width: "88px", height: 18, sx: { bgcolor: alpha(colors.background, 0.1), } }) })] }) }))] })] }));
|
|
87
87
|
}
|