Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2024-12-16 20:26:19 -05:00
Code Issues Activity

chore(console): update light loading illustration (#4040)

Browse source
This commit is contained in:
Xiao Yijun 2023-06-15 15:28:16 +08:00 committed by GitHub
parent 6d1013e573
commit 205bb5f44d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 31 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

73
packages/console/src/assets/images/loading-illustration.svg
View file

@ -1,55 +1,44 @@
<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="128" cy="124" r="78" stroke="#E2E0EC" stroke-width="60"/>
<path d="M218.66 54C218.66 52.8955 217.765 52 216.66 52C215.556 52 214.66 52.8954 214.66 54V230C214.66 231.105 215.556 232 216.66 232C217.765 232 218.66 231.105 218.66 230V54Z" fill="#ADAAB4"/>
<rect width="4" height="140" rx="2" transform="matrix(-0.5 0.866025 0.866025 0.5 131.415 33)" fill="#ADAAB4"/>
<path d="M231.038 223.732C231.038 219.314 227.456 215.732 223.038 215.732H199.038C194.619 215.732 191.038 219.314 191.038 223.732V231.732H231.038V223.732Z" fill="#D9D9D9"/>
<circle r="8" transform="matrix(-1 0 0 1 216.66 84)" fill="#C9C5D0"/>
<circle r="4" transform="matrix(-1 0 0 1 216.66 84)" fill="#78767F"/>
<circle r="12" transform="matrix(-0.707107 -0.707107 -0.707107 0.707107 127.112 60.5477)" fill="#FFB95A"/>
<path d="M103.778 38.6274C103.778 38.6274 113.909 48.7581 126.405 61.2548C138.902 73.7516 149.033 83.8822 149.033 83.8822C161.53 71.3855 161.53 51.1242 149.033 38.6274C136.536 26.1306 116.275 26.1306 103.778 38.6274Z" fill="url(#paint0_linear_494_13573)"/>
<path d="M40 134C40 129.582 43.5817 126 48 126H176C180.418 126 184 129.582 184 134V234H40V134Z" fill="#ADAAB4"/>
<path d="M44 134C44 131.791 45.7909 130 48 130H176C178.209 130 180 131.791 180 134V230H44V134Z" fill="#47464E"/>
<circle cx="128" cy="124" r="78" stroke="#F5EEFF" stroke-width="60"/>
<path d="M218.66 54C218.66 52.8954 217.765 52 216.66 52C215.556 52 214.66 52.8954 214.66 54V230C214.66 231.105 215.556 232 216.66 232C217.765 232 218.66 231.105 218.66 230V54Z" fill="#AF9EFF"/>
<rect width="4" height="140" rx="2" transform="matrix(-0.5 0.866025 0.866025 0.5 131.414 33)" fill="#AF9EFF"/>
<path d="M231.037 223.732C231.037 219.314 227.455 215.732 223.037 215.732H199.037C194.619 215.732 191.037 219.314 191.037 223.732V231.732H231.037V223.732Z" fill="#D9D9D9"/>
<circle cx="8" cy="8" r="8" transform="matrix(-1 0 0 1 224.66 76)" fill="#7958FF"/>
<circle cx="4" cy="4" r="4" transform="matrix(-1 0 0 1 220.66 80)" fill="#CABEFF"/>
<circle cx="12" cy="12" r="12" transform="matrix(-0.707107 -0.707107 -0.707107 0.707107 144.082 60.5479)" fill="#FFB95A"/>
<path d="M103.778 38.6275C103.778 38.6275 113.909 48.7581 126.405 61.2549C138.902 73.7517 149.033 83.8823 149.033 83.8823C161.53 71.3855 161.53 51.1242 149.033 38.6275C136.536 26.1307 116.275 26.1307 103.778 38.6275Z" fill="#947DFF"/>
<path d="M40 134C40 129.582 43.5817 126 48 126H176C180.418 126 184 129.582 184 134V234H40V134Z" fill="#7958FF"/>
<path d="M44 134C44 131.791 45.7909 130 48 130H176C178.209 130 180 131.791 180 134V230H44V134Z" fill="#CABEFF"/>
<path d="M40 228H232V230C232 232.209 230.209 234 228 234H40V228Z" fill="#7958FF"/>
<path d="M102 130H122V132C122 134.209 120.209 136 118 136H106C103.791 136 102 134.209 102 132V130Z" fill="#1B1B22"/>
<rect x="84" y="157" width="80" height="48" rx="4" fill="#78767F"/>
<path d="M84 161C84 158.791 85.7909 157 88 157H160C162.209 157 164 158.791 164 161V163H84V161Z" fill="#ADAAB4"/>
<circle cx="89" cy="160" r="1" fill="#FF897A"/>
<circle cx="93" cy="160" r="1" fill="#FFB95A"/>
<circle cx="97" cy="160" r="1" fill="#68BE6C"/>
<rect x="92" y="171" width="20" height="4" rx="2" fill="#908C9E"/>
<rect x="128" y="171" width="28" height="26" rx="2" fill="#908C9E"/>
<rect x="92" y="179" width="28" height="4" rx="2" fill="#908C9E"/>
<rect x="92" y="193" width="8" height="4" rx="2" fill="#908C9E"/>
<path d="M21 162H69L63.6113 226.664C63.3212 230.146 63.1761 231.887 62.0279 232.944C60.8797 234 59.1328 234 55.6389 234H34.3611C30.8672 234 29.1203 234 27.9721 232.944C26.8239 231.887 26.6788 230.146 26.3887 226.664L21 162Z" fill="#E3DFE3"/>
<g opacity="0.06">
<path d="M69 152H61L55 224H55.6389C59.1328 224 60.8797 224 62.0279 222.944C63.1761 221.887 63.3212 220.146 63.6113 216.664L69 152Z" fill="black" style="mix-blend-mode:soft-light"/>
</g>
<path d="M102 130H122V132C122 134.209 120.209 136 118 136H106C103.791 136 102 134.209 102 132V130Z" fill="#947DFF"/>
<rect x="84" y="157" width="80" height="48" rx="4" fill="#E6DEFF"/>
<circle cx="89" cy="160" r="1" fill="#AF9EFF"/>
<circle cx="93" cy="160" r="1" fill="#F5EEFF"/>
<circle cx="97" cy="160" r="1" fill="#F5EEFF"/>
<rect x="92" y="167" width="20" height="4" rx="2" fill="#F5EEFF"/>
<rect x="130" y="167" width="20" height="32" rx="4" fill="#F5EEFF"/>
<rect x="92" y="175" width="28" height="4" rx="2" fill="#F5EEFF"/>
<rect x="92" y="189" width="8" height="4" rx="2" fill="#F5EEFF"/>
<path d="M21 162H69L63.6113 226.664C63.3212 230.146 63.1761 231.887 62.0279 232.944C60.8797 234 59.1328 234 55.6389 234H34.3611C30.8672 234 29.1203 234 27.9721 232.944C26.8239 231.887 26.6788 230.146 26.3887 226.664L21 162Z" fill="#E6DEFF"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M69 152H21L21.1667 154H68.8333L69 152Z" fill="black" fill-opacity="0.06"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M26.6806 210C24.9336 210 24.0602 210 23.4861 209.472C22.912 208.944 22.8395 208.073 22.6944 206.332L20.361 178.332C20.1921 176.305 20.1077 175.292 20.7019 174.646C21.2961 174 22.3131 174 24.3472 174H65.6528C67.6869 174 68.704 174 69.2982 174.646C69.8924 175.292 69.8079 176.305 69.639 178.332L67.3057 206.332C67.1606 208.073 67.0881 208.944 66.514 209.472C65.9399 210 65.0664 210 63.3195 210H26.6806Z" fill="#CABEFF"/>
<path style="mix-blend-mode:soft-light" fill-rule="evenodd" clip-rule="evenodd" d="M63 210H63.3195C65.0664 210 65.9399 210 66.514 209.472C67.088 208.944 67.1606 208.073 67.3057 206.332L69.639 178.332C69.8079 176.305 69.8924 175.292 69.2982 174.646C68.7388 174.038 67.8046 174.002 66 174L63 210Z" fill="black" fill-opacity="0.4"/>
<path style="mix-blend-mode:soft-light" fill-rule="evenodd" clip-rule="evenodd" d="M63 210L66 174C67.8047 174.002 68.7388 174.038 69.2982 174.646C69.8924 175.291 69.8079 176.305 69.639 178.332L67.3057 206.332C67.1606 208.073 67.0881 208.943 66.514 209.472C65.9758 209.967 65.1746 209.998 63.6375 210H63Z" fill="black" fill-opacity="0.4"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M28 184C28 183.448 28.4477 183 29 183C29.5523 183 30 183.448 30 184V200C30 200.552 29.5523 201 29 201C28.4477 201 28 200.552 28 200V184ZM32 184C32 183.448 32.4477 183 33 183C33.5523 183 34 183.448 34 184V200C34 200.552 33.5523 201 33 201C32.4477 201 32 200.552 32 200V184ZM37 183C36.4477 183 36 183.448 36 184V200C36 200.552 36.4477 201 37 201C37.5523 201 38 200.552 38 200V184C38 183.448 37.5523 183 37 183ZM40 184C40 183.448 40.4477 183 41 183C41.5523 183 42 183.448 42 184V200C42 200.552 41.5523 201 41 201C40.4477 201 40 200.552 40 200V184ZM45 183C44.4477 183 44 183.448 44 184V200C44 200.552 44.4477 201 45 201C45.5523 201 46 200.552 46 200V184C46 183.448 45.5523 183 45 183ZM48 184C48 183.448 48.4477 183 49 183C49.5523 183 50 183.448 50 184V200C50 200.552 49.5523 201 49 201C48.4477 201 48 200.552 48 200V184ZM53 183C52.4477 183 52 183.448 52 184V200C52 200.552 52.4477 201 53 201C53.5523 201 54 200.552 54 200V184C54 183.448 53.5523 183 53 183ZM56 184C56 183.448 56.4477 183 57 183C57.5523 183 58 183.448 58 184V200C58 200.552 57.5523 201 57 201C56.4477 201 56 200.552 56 200V184ZM61 183C60.4477 183 60 183.448 60 184V200C60 200.552 60.4477 201 61 201C61.5523 201 62 200.552 62 200V184C62 183.448 61.5523 183 61 183Z" fill="#947DFF"/>
<path d="M23.1766 147.47C24.0566 144.83 24.4966 143.51 25.5442 142.755C26.5917 142 27.9832 142 30.7661 142H59.2339C62.0168 142 63.4083 142 64.4558 142.755C65.5034 143.51 65.9434 144.83 66.8234 147.47L69 154H21L23.1766 147.47Z" fill="#F7F8F8"/>
<path d="M23.1766 147.47C24.0566 144.83 24.4966 143.51 25.5442 142.755C26.5917 142 27.9832 142 30.7661 142H59.2339C62.0168 142 63.4083 142 64.4558 142.755C65.5034 143.51 65.9434 144.83 66.8234 147.47L69 154H21L23.1766 147.47Z" fill="#F5EEFF"/>
<g opacity="0.06">
<path d="M61 154H69L66.8234 147.47C65.9434 144.83 65.5034 143.51 64.4558 142.755C63.4083 142 62.0168 142 59.2339 142H57L61 154Z" fill="black" style="mix-blend-mode:soft-light"/>
</g>
<rect x="15" y="154" width="60" height="8" rx="2" fill="#F7F8F8"/>
<rect x="15" y="154" width="60" height="8" rx="2" fill="#F5EEFF"/>
<g opacity="0.06">
<path d="M67 154H71C72.8856 154 73.8284 154 74.4142 154.586C75 155.172 75 156.114 75 158C75 159.886 75 160.828 74.4142 161.414C73.8284 162 72.8856 162 71 162H67V154Z" fill="black" style="mix-blend-mode:soft-light"/>
</g>
<path d="M151 221H214V228H155C152.791 228 151 226.209 151 224V221Z" fill="#F4E560"/>
<path d="M207 221H240V224C240 226.209 238.209 228 236 228H211C208.791 228 207 226.209 207 224V221Z" fill="#5F5D67"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M211.5 223C211.224 223 211 223.224 211 223.5C211 223.776 211.224 224 211.5 224H212.5C212.776 224 213 223.776 213 223.5C213 223.224 212.776 223 212.5 223H211.5ZM211.5 225C211.224 225 211 225.224 211 225.5C211 225.776 211.224 226 211.5 226H212.5C212.776 226 213 225.776 213 225.5C213 225.224 212.776 225 212.5 225H211.5ZM214 225.5C214 225.224 214.224 225 214.5 225H215.5C215.776 225 216 225.224 216 225.5C216 225.776 215.776 226 215.5 226H214.5C214.224 226 214 225.776 214 225.5ZM217.5 225C217.224 225 217 225.224 217 225.5C217 225.776 217.224 226 217.5 226H218.5C218.776 226 219 225.776 219 225.5C219 225.224 218.776 225 218.5 225H217.5ZM220 225.5C220 225.224 220.224 225 220.5 225H221.5C221.776 225 222 225.224 222 225.5C222 225.776 221.776 226 221.5 226H220.5C220.224 226 220 225.776 220 225.5ZM214.5 223C214.224 223 214 223.224 214 223.5C214 223.776 214.224 224 214.5 224H215.5C215.776 224 216 223.776 216 223.5C216 223.224 215.776 223 215.5 223H214.5ZM217 223.5C217 223.224 217.224 223 217.5 223H218.5C218.776 223 219 223.224 219 223.5C219 223.776 218.776 224 218.5 224H217.5C217.224 224 217 223.776 217 223.5ZM220.5 223C220.224 223 220 223.224 220 223.5C220 223.776 220.224 224 220.5 224H221.5C221.776 224 222 223.776 222 223.5C222 223.224 221.776 223 221.5 223H220.5Z" fill="#F4E560"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M230.5 223C230.224 223 230 223.224 230 223.5C230 223.776 230.224 224 230.5 224H231.5C231.776 224 232 223.776 232 223.5C232 223.224 231.776 223 231.5 223H230.5ZM230.5 225C230.224 225 230 225.224 230 225.5C230 225.776 230.224 226 230.5 226H231.5C231.776 226 232 225.776 232 225.5C232 225.224 231.776 225 231.5 225H230.5ZM233.5 225C233.224 225 233 225.224 233 225.5C233 225.776 233.224 226 233.5 226H234.5C234.776 226 235 225.776 235 225.5C235 225.224 234.776 225 234.5 225H233.5ZM236 225.5C236 225.224 236.224 225 236.5 225H237.5C237.776 225 238 225.224 238 225.5C238 225.776 237.776 226 237.5 226H236.5C236.224 226 236 225.776 236 225.5ZM233 223.5C233 223.224 233.224 223 233.5 223H234.5C234.776 223 235 223.224 235 223.5C235 223.776 234.776 224 234.5 224H233.5C233.224 224 233 223.776 233 223.5ZM236.5 223C236.224 223 236 223.224 236 223.5C236 223.776 236.224 224 236.5 224H237.5C237.776 224 238 223.776 238 223.5C238 223.224 237.776 223 237.5 223H236.5Z" fill="#F4E560"/>
<rect x="224" y="224" width="4" height="2" rx="1" fill="#F4E560"/>
<rect x="71.3594" y="8.57092" width="8" height="8" transform="rotate(-40.65 71.3594 8.57092)" fill="#D1C9F9"/>
<rect x="233.613" y="107.516" width="8" height="8" transform="rotate(30.813 233.613 107.516)" fill="#CABEFF"/>
<path d="M151 221H214V228H155C152.791 228 151 226.209 151 224V221Z" fill="#FFB95A"/>
<path d="M207 221H240V224C240 226.209 238.209 228 236 228H211C208.791 228 207 226.209 207 224V221Z" fill="#47464E"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M211.5 223C211.224 223 211 223.224 211 223.5C211 223.776 211.224 224 211.5 224H212.5C212.776 224 213 223.776 213 223.5C213 223.224 212.776 223 212.5 223H211.5ZM211.5 225C211.224 225 211 225.224 211 225.5C211 225.776 211.224 226 211.5 226H212.5C212.776 226 213 225.776 213 225.5C213 225.224 212.776 225 212.5 225H211.5ZM214 225.5C214 225.224 214.224 225 214.5 225H215.5C215.776 225 216 225.224 216 225.5C216 225.776 215.776 226 215.5 226H214.5C214.224 226 214 225.776 214 225.5ZM217.5 225C217.224 225 217 225.224 217 225.5C217 225.776 217.224 226 217.5 226H218.5C218.776 226 219 225.776 219 225.5C219 225.224 218.776 225 218.5 225H217.5ZM220 225.5C220 225.224 220.224 225 220.5 225H221.5C221.776 225 222 225.224 222 225.5C222 225.776 221.776 226 221.5 226H220.5C220.224 226 220 225.776 220 225.5ZM214.5 223C214.224 223 214 223.224 214 223.5C214 223.776 214.224 224 214.5 224H215.5C215.776 224 216 223.776 216 223.5C216 223.224 215.776 223 215.5 223H214.5ZM217 223.5C217 223.224 217.224 223 217.5 223H218.5C218.776 223 219 223.224 219 223.5C219 223.776 218.776 224 218.5 224H217.5C217.224 224 217 223.776 217 223.5ZM220.5 223C220.224 223 220 223.224 220 223.5C220 223.776 220.224 224 220.5 224H221.5C221.776 224 222 223.776 222 223.5C222 223.224 221.776 223 221.5 223H220.5Z" fill="#FFB95A"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M230.5 223C230.224 223 230 223.224 230 223.5C230 223.776 230.224 224 230.5 224H231.5C231.776 224 232 223.776 232 223.5C232 223.224 231.776 223 231.5 223H230.5ZM230.5 225C230.224 225 230 225.224 230 225.5C230 225.776 230.224 226 230.5 226H231.5C231.776 226 232 225.776 232 225.5C232 225.224 231.776 225 231.5 225H230.5ZM233.5 225C233.224 225 233 225.224 233 225.5C233 225.776 233.224 226 233.5 226H234.5C234.776 226 235 225.776 235 225.5C235 225.224 234.776 225 234.5 225H233.5ZM236 225.5C236 225.224 236.224 225 236.5 225H237.5C237.776 225 238 225.224 238 225.5C238 225.776 237.776 226 237.5 226H236.5C236.224 226 236 225.776 236 225.5ZM233 223.5C233 223.224 233.224 223 233.5 223H234.5C234.776 223 235 223.224 235 223.5C235 223.776 234.776 224 234.5 224H233.5C233.224 224 233 223.776 233 223.5ZM236.5 223C236.224 223 236 223.224 236 223.5C236 223.776 236.224 224 236.5 224H237.5C237.776 224 238 223.776 238 223.5C238 223.224 237.776 223 237.5 223H236.5Z" fill="#FFB95A"/>
<rect x="224" y="224" width="4" height="2" rx="1" fill="#FFB95A"/>
<rect x="71.3594" y="8.5708" width="8" height="8" rx="2" transform="rotate(-40.65 71.3594 8.5708)" fill="#FFD5FF"/>
<rect x="233.613" y="107.516" width="8" height="8" rx="2" transform="rotate(30.813 233.613 107.516)" fill="#FFD5FF"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M214.957 18.1043C214.957 18.0467 215.004 18 215.061 18H216.939C216.997 18 217.043 18.0467 217.043 18.1043V21.4086L219.905 19.7565C219.955 19.7277 220.018 19.7448 220.047 19.7947L220.986 21.4207C221.015 21.4705 220.998 21.5343 220.948 21.5631L218.086 23.2153L220.948 24.8675C220.998 24.8963 221.015 24.9601 220.986 25.01L220.047 26.636C220.019 26.6859 219.955 26.703 219.905 26.6742L217.043 25.022V28.3264C217.043 28.384 216.997 28.4307 216.939 28.4307H215.061C215.004 28.4307 214.957 28.384 214.957 28.3264V25.0219L212.095 26.6742C212.045 26.703 211.982 26.6859 211.953 26.636L211.014 25.01C210.985 24.9601 211.002 24.8963 211.052 24.8675L213.914 23.2153L211.052 21.5631C211.002 21.5343 210.985 21.4705 211.014 21.4207L211.953 19.7947C211.982 19.7448 212.046 19.7277 212.095 19.7565L214.957 21.4087V18.1043Z" fill="#FFFBFF"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M160.957 97C163.166 97 164.957 95.2091 164.957 93C164.957 90.7909 163.166 89 160.957 89C158.748 89 156.957 90.7909 156.957 93C156.957 95.2091 158.748 97 160.957 97ZM160.957 95C162.062 95 162.957 94.1046 162.957 93C162.957 91.8954 162.062 91 160.957 91C159.852 91 158.957 91.8954 158.957 93C158.957 94.1046 159.852 95 160.957 95Z" fill="#C4C7C7"/>
<path d="M12.2891 104.696L13.4832 107.26C14.1427 108.676 15.8253 109.29 17.2414 108.63V108.63C18.6574 107.971 20.34 108.584 20.9995 110V110C21.659 111.416 23.3416 112.029 24.7576 111.37V111.37C26.1737 110.71 27.8562 111.324 28.5158 112.74L29.7099 115.304" stroke="#F7F8F8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_494_13573" x1="148.16" y1="35.0001" x2="151.66" y2="86.5001" gradientUnits="userSpaceOnUse">
<stop stop-color="#7958FF"/>
<stop offset="1" stop-color="#FD8EFF"/>
</linearGradient>
</defs>
<path d="M12.2891 104.696L13.4832 107.26C14.1427 108.676 15.8253 109.29 17.2414 108.63V108.63C18.6574 107.971 20.34 108.584 20.9995 110V110C21.659 111.416 23.3416 112.029 24.7576 111.37V111.37C26.1737 110.71 27.8562 111.324 28.5158 112.74L29.7099 115.304" stroke="#FFD5FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 9.2 KiB