woocommerce/plugins/woocommerce-admin/client/activity-panel/setup-progress.js

39 lines
1.3 KiB
JavaScript
Raw Normal View History

export const SetupProgress = ( {
setupTasksComplete,
setupCompletePercent,
} ) => (
<svg
className="woocommerce-layout__activity-panel-tab-icon setup-progress"
viewBox="0 0 25 25"
>
<path
className="setup-progress-ring"
d="M 12.476 23.237 C 18.369 23.237 23.146 18.414 23.146 12.464 C 23.146 6.512 18.369 1.687 12.476 1.687 C 6.581 1.687 1.803 6.512 1.803 12.464 C 1.803 18.414 6.581 23.237 12.476 23.237 Z"
/>
<path
className="setup-progress-slice"
transform="matrix(-0.034188, 0, 0, 0.034134, 38.373184, -8.278505)"
d="M 522 607 A 237 237 0 0 1 759 370 L 759 607 Z"
fill={ setupTasksComplete > 0 ? 'currentColor' : 'white' }
/>
<path
className="setup-progress-slice"
transform="matrix(-0.034188, 0, 0, -0.034134, 38.368454, 33.13131)"
d="M 522 607 A 237 237 0 0 1 759 370 L 759 607 Z"
fill={ setupCompletePercent >= 50 ? 'currentColor' : 'white' }
/>
<path
className="setup-progress-slice"
transform="matrix(0.034188, 0, 0, -0.034134, -13.500516, 33.133827)"
d="M 522 607 A 237 237 0 0 1 759 370 L 759 607 Z"
fill={ setupCompletePercent >= 75 ? 'currentColor' : 'white' }
/>
<path
className="setup-progress-slice"
transform="matrix(0.034188, 0, 0, 0.034134, -13.495783, -8.281025)"
d="M 522 607 A 237 237 0 0 1 759 370 L 759 607 Z"
fill="white"
/>
</svg>
);