Skip to content

Commit a4ad3a0

Browse files
doublefacedoubleface
doubleface
authored and
doubleface
committed
feat: Change the CloudSync icon
1 parent 17750d4 commit a4ad3a0

File tree

3 files changed

+27
-37
lines changed

3 files changed

+27
-37
lines changed

‎assets/icons/illus/cloud-sync.svg‎

Lines changed: 1 addition & 8 deletions
Loading

‎react/Icons/CloudSync.jsx‎

Lines changed: 2 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,17 +3,8 @@ import React from 'react'
33

44
function SvgCloudSync(props) {
55
return (
6-
<svg viewBox="0 0 32 32" {...props}>
7-
<g fill="none" fillRule="evenodd">
8-
<path
9-
fill="#B2D3FF"
10-
d="M8.889 27.892A8.889 8.889 0 010 19.003a8.892 8.892 0 017.26-8.74c.765-4.13 4.387-7.26 8.74-7.26 4.353 0 7.975 3.13 8.74 7.26a8.892 8.892 0 017.26 8.74 8.888 8.888 0 01-8.627 8.885l-.262.004H8.89z"
11-
/>
12-
<path
13-
fill="#297EF1"
14-
d="M22.052 19.17a.89.89 0 01.405 1.19c-1.201 2.435-3.707 4.032-6.457 4.032-2.103 0-4.04-.962-5.373-2.471a.875.875 0 01-.85.693.889.889 0 01-.888-.889V18.17c0-.056.014-.106.023-.158.005-.024.004-.048.01-.071a.866.866 0 01.132-.285l.022-.024a.896.896 0 01.879-.327c.024.005.047.012.07.018a.842.842 0 01.22.102c.024.015.048.026.071.043.01.008.021.011.031.02l2.667 2.221a.89.89 0 01.113 1.252c-.166.2-.4.301-.64.313.96.832 2.198 1.34 3.513 1.34 2.065 0 3.958-1.206 4.862-3.04a.889.889 0 011.19-.404zm1.031-2.589c-.003.018-.002.036-.007.053a.862.862 0 01-.138.28c-.011.016-.024.026-.035.039a.88.88 0 01-.19.171c-.023.016-.043.03-.067.043a.91.91 0 01-.295.103c-.003 0-.005.002-.007.003-.008 0-.015-.003-.023-.002a.85.85 0 01-.362-.036.884.884 0 01-.225-.11c-.02-.014-.042-.023-.06-.038-.007-.005-.015-.006-.02-.012l-2.668-2.223a.888.888 0 01-.113-1.251.872.872 0 01.713-.305A5.448 5.448 0 0016 11.948c-2.103 0-4.007 1.213-4.89 3.06a.887.887 0 11-1.604-.764C10.682 11.78 13.21 10.17 16 10.17c2.127 0 4.061.93 5.385 2.412a.876.876 0 01.837-.634.89.89 0 01.889.888v3.556c0 .068-.014.128-.028.19z"
15-
/>
16-
</g>
6+
<svg viewBox="0 0 16 16" {...props}>
7+
<path d="M13 9.987c-.013 0-.02 0-.033.006A2.327 2.327 0 0010.667 8 2.33 2.33 0 008.56 9.347a1.992 1.992 0 00-1.893 1.986c0 1.107.893 2 2 2L13 13.32a1.667 1.667 0 000-3.333zM13.007 12h-4.34A.669.669 0 018 11.333c0-.366.3-.666.667-.666H9.5V10.5c0-.647.52-1.167 1.167-1.167.646 0 1.167.52 1.167 1.167v.833h1.173a.33.33 0 01.333.334.343.343 0 01-.333.333zM5.334 2.84v1.393A4 4 0 002.667 8c0 1.18.52 2.227 1.333 2.96V9.333h1.333v4h-4V12h1.82a5.295 5.295 0 01-1.82-4 5.33 5.33 0 014-5.16zM12 4h-1.82a5.32 5.32 0 011.774 3.333h-1.347A4.002 4.002 0 009.334 5.04v1.627H8v-4h4V4z" />
178
</svg>
189
)
1910
}

‎react/ProgressionBanner/Readme.md‎

Lines changed: 24 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,41 @@
11
A banner with a progress bar at the bottom.
22

33
```jsx
4-
import useProgression from 'cozy-ui/transpiled/react/helpers/useProgression'
5-
import ProgressionBanner from 'cozy-ui/transpiled/react/ProgressionBanner'
6-
import Icon from 'cozy-ui/transpiled/react/Icon'
7-
import CloudSync from 'cozy-ui/transpiled/react/Icons/CloudSync'
8-
import Variants from 'cozy-ui/docs/components/Variants'
9-
import MuiButton from 'cozy-ui/transpiled/react/Button'
10-
import { BreakpointsProvider } from 'cozy-ui/transpiled/react/providers/Breakpoints'
4+
import useProgression from "cozy-ui/transpiled/react/helpers/useProgression";
5+
import ProgressionBanner from "cozy-ui/transpiled/react/ProgressionBanner";
6+
import Icon from "cozy-ui/transpiled/react/Icon";
7+
import CloudSync from "cozy-ui/transpiled/react/Icons/CloudSync2";
8+
import Variants from "cozy-ui/docs/components/Variants";
9+
import MuiButton from "cozy-ui/transpiled/react/Button";
10+
import { BreakpointsProvider } from "cozy-ui/transpiled/react/providers/Breakpoints";
1111

12-
const { progression } = useProgression()
12+
const { progression } = useProgression();
1313

1414
const initialVariants = [
15-
{ withValue: true, progressBar: true, withButton: false }
16-
]
17-
18-
;
15+
{ withValue: true, progressBar: true, withButton: false },
16+
];
1917

2018
<BreakpointsProvider>
2119
<Variants initialVariants={initialVariants}>
22-
{variant => (
20+
{(variant) => (
2321
<ProgressionBanner
2422
progressBar={variant.progressBar}
2523
value={variant.withValue && progression}
26-
text={variant.withButton ? "Storage limit nearly reached" : "4 remaining items"}
24+
text={
25+
variant.withButton
26+
? "Storage limit nearly reached"
27+
: "4 remaining items"
28+
}
2729
icon={<Icon icon={CloudSync} />}
28-
button={variant.withButton && <MuiButton color='primary' onClick={() => alert("Clicked!")}>
29-
Manage your storage space
30-
</MuiButton>}
30+
button={
31+
variant.withButton && (
32+
<MuiButton color="primary" onClick={() => alert("Clicked!")}>
33+
Manage your storage space
34+
</MuiButton>
35+
)
36+
}
3137
/>
3238
)}
3339
</Variants>
34-
</BreakpointsProvider>
40+
</BreakpointsProvider>;
3541
```

0 commit comments

Comments
 (0)