michalspeckle
3c7a652e98
* feat(fe): render different CardImportFileArea variants based on context * feat(fe): remove default emptyStateVariant * refactor(fe): use container classes * feat(fe): remove click from full card upload area. Only on buttons * chore(fe): updates to empty states, clean up. * feat(fe): new empty state illustrations refactor * chore(fe): removing nested selectors and clean up * chore(fe): removed default variant * feat(fe): empty state illustration slot added and styling changes * feat(fe): new empty state illustrations and styling changes * chore(fe): copy change * chore(fe): refactor --------- Co-authored-by: andrewwallacespeckle <andrew@speckle.systems>
145 lines
4.2 KiB
Vue
145 lines
4.2 KiB
Vue
<template>
|
|
<svg
|
|
width="194"
|
|
height="141"
|
|
viewBox="0 0 194 141"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<rect
|
|
x="0.585984"
|
|
y="0.177422"
|
|
width="136.5"
|
|
height="102.75"
|
|
rx="5.625"
|
|
transform="matrix(0.948683 -0.316228 0.613941 0.789352 -0.0788556 59.0923)"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5 fill-foundation-2"
|
|
fill="currentClass"
|
|
stroke-width="1"
|
|
/>
|
|
<g clip-path="url(#clip0_3199_61296)">
|
|
<g clip-path="url(#clip1_3199_61296)">
|
|
<path
|
|
d="M70.2824 95.2933L109.853 89.7539L91.3457 65.9593L57.4464 78.7897L70.2824 95.2933Z"
|
|
fill="currentClass"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5 fill-foundation-page"
|
|
stroke-linejoin="round"
|
|
/>
|
|
<path
|
|
d="M152.677 64.5974L109.853 89.7541L91.3457 65.9595L142.236 51.1733L152.677 64.5974Z"
|
|
fill="currentClass"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5 fill-foundation-2"
|
|
stroke-linejoin="round"
|
|
/>
|
|
<path
|
|
d="M73.3722 50.6422L102.838 32.4529L118.925 53.1364L85.5759 66.3327L73.3722 50.6422Z"
|
|
fill="currentClass"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5 fill-foundation-page"
|
|
stroke-linejoin="round"
|
|
/>
|
|
<path
|
|
d="M147.845 62.3604L109.583 81.6142L100.721 70.2205L142.424 55.3906L147.845 62.3604Z"
|
|
ffill="currentClass"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5 fill-foundation-page"
|
|
stroke-linejoin="round"
|
|
/>
|
|
<path
|
|
d="M62.457 76.8955L76.129 94.4738"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5"
|
|
stroke-miterlimit="10"
|
|
/>
|
|
<path
|
|
d="M68.167 74.7349L82.7952 93.5425"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5"
|
|
stroke-miterlimit="10"
|
|
/>
|
|
<path
|
|
d="M74.7324 72.25L90.4587 92.4694"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5"
|
|
stroke-miterlimit="10"
|
|
/>
|
|
<path
|
|
d="M82.3652 69.3608L99.3684 91.2221"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5"
|
|
stroke-miterlimit="10"
|
|
/>
|
|
<path
|
|
d="M93.3637 68.5535L144.205 52.373L140.505 47.6161L86.7197 60.0112L93.3637 68.5535Z"
|
|
fill="currentClass"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5 fill-foundation-2"
|
|
stroke-linejoin="round"
|
|
/>
|
|
<path
|
|
d="M93.3634 68.5533L57.7386 80.975L53.1967 75.1355L86.7195 60.011L93.3634 68.5533Z"
|
|
fill="currentClass"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5 fill-foundation-page"
|
|
stroke-linejoin="round"
|
|
/>
|
|
<path
|
|
d="M137.005 48.4229L118.564 52.6721L102.838 32.4526L124.516 32.3656L137.005 48.4229Z"
|
|
fill="currentClass"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5 fill-foundation-2"
|
|
stroke-linejoin="round"
|
|
/>
|
|
</g>
|
|
</g>
|
|
<rect
|
|
x="0.585984"
|
|
y="0.177422"
|
|
width="136.5"
|
|
height="102.75"
|
|
rx="5.625"
|
|
transform="matrix(0.948683 -0.316228 0.613941 0.789352 -0.0788556 44.0923)"
|
|
stroke="currentClass"
|
|
class="stroke-outline-5 dash-moving"
|
|
stroke-width="1"
|
|
stroke-dashoffset="25"
|
|
stroke-dasharray="3 4"
|
|
/>
|
|
<defs>
|
|
<clipPath id="clip0_3199_61296">
|
|
<rect
|
|
width="137.25"
|
|
height="103.5"
|
|
rx="6"
|
|
transform="matrix(0.948683 -0.316228 0.613941 0.789352 0 43.8696)"
|
|
fill="currentColor"
|
|
class="fill-foundation"
|
|
/>
|
|
</clipPath>
|
|
<clipPath id="clip1_3199_61296">
|
|
<rect
|
|
width="91"
|
|
height="60"
|
|
fill="currentColor"
|
|
class="fill-foundation"
|
|
transform="matrix(0.948683 -0.316228 0.613941 0.789352 37.0537 54.3804)"
|
|
/>
|
|
</clipPath>
|
|
</defs>
|
|
</svg>
|
|
</template>
|
|
<style scoped>
|
|
.dash-moving {
|
|
animation: dash 2s ease-in-out 0s 1 normal forwards running;
|
|
}
|
|
|
|
@keyframes dash {
|
|
100% {
|
|
stroke-dashoffset: 0;
|
|
}
|
|
}
|
|
</style>
|