logo and assets adjustment

This commit is contained in:
Yared Yemane 2026-02-27 07:24:43 -08:00
parent cb4796e8d5
commit 28f7ac2dcd
17 changed files with 126 additions and 75 deletions

5
src/assets/Alert.svg Normal file
View File

@ -0,0 +1,5 @@
<svg width="114" height="114" viewBox="0 0 114 114" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M66.1428 99.75H47.8572C25.8626 99.75 14.8654 99.75 10.8127 92.596C6.76008 85.4425 12.385 75.9591 23.6348 56.9929L32.7777 41.5783C43.5841 23.3595 48.9872 14.25 57 14.25C65.0128 14.25 70.4159 23.3594 81.2222 41.5783L90.3654 56.9929C101.615 75.9591 107.24 85.4425 103.187 92.596C99.1344 99.75 88.1372 99.75 66.1428 99.75Z" stroke="#9E2891" stroke-width="7.125" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M57 42.75V64.125" stroke="#9E2891" stroke-width="7.125" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M57 80.713V80.7604" stroke="#9E2891" stroke-width="7.125" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

After

Width:  |  Height:  |  Size: 753 B

View File

@ -0,0 +1,4 @@
<svg width="114" height="115" viewBox="0 0 114 115" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M108.361 64.9546C111.363 65.9012 113.03 69.1024 112.083 72.1048L110.663 76.6103L108.759 81.2049L106.463 85.616L103.791 89.8103L100.764 93.7557L97.404 97.4222L93.7374 100.782L89.792 103.809L85.5977 106.481L81.4073 108.663C78.615 110.116 75.173 109.031 73.7194 106.239C72.2658 103.447 73.3511 100.005 76.1434 98.5509L79.8923 96.5994L83.247 94.4622L86.4027 92.0408L89.3353 89.3536L92.0225 86.4209L94.4439 83.2653L96.5811 79.9106L98.4177 76.3824L99.9399 72.7076L101.211 68.6767C102.157 65.6744 105.359 64.0079 108.361 64.9546Z" fill="#9E2891"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M108.851 53.7714C105.777 54.4527 102.733 52.5136 102.052 49.4402L101.137 45.3139L99.9412 41.5204L98.4191 37.8456L96.5824 34.3174L94.4452 30.9627L92.0238 27.807L89.3366 24.8744L86.404 22.1872L83.2483 19.7658L79.8936 17.6286L76.3654 15.7919L72.6906 14.2698L68.8971 13.0737L65.0138 12.2128L61.0702 11.6936L57.0963 11.5201L53.1225 11.6936L49.1789 12.2128L45.2956 13.0737L41.5021 14.2698L37.8272 15.792L34.2991 17.6286L30.9444 19.7658L27.7887 22.1872L24.8561 24.8744L22.1689 27.807L19.7475 30.9627L17.6103 34.3173L15.7736 37.8456L14.2515 41.5203L13.0554 45.3139L12.1945 49.1972L11.6753 53.1408L11.5018 57.1147L11.6753 61.0885L12.1945 65.0321L13.0554 68.9154L14.2515 72.7089L15.7736 76.3837L17.6103 79.912L19.7475 83.2666L22.1689 86.4223L24.8561 89.3549L27.7887 92.0421L30.9443 94.4635L34.2991 96.6008L37.8273 98.4374L41.502 99.9595L45.2956 101.156L49.1789 102.017L53.1225 102.536L57.345 102.72C60.49 102.857 62.9282 105.518 62.7909 108.663C62.6536 111.808 59.9927 114.247 56.8477 114.109L52.128 113.903L47.1975 113.254L42.3423 112.178L37.5993 110.682L33.0048 108.779L28.5936 106.483L24.3994 103.811L20.454 100.783L16.7874 97.4236L13.4277 93.7571L10.4002 89.8116L7.7282 85.6174L5.43189 81.2062L3.52878 76.6117L2.03334 71.8687L0.956956 67.0136L0.307837 62.083L0.0909175 57.1147L0.307857 52.1463L0.95697 47.2158L2.03335 42.3606L3.52876 37.6177L5.43188 33.0231L7.7282 28.6119L10.4002 24.4177L13.4277 20.4723L16.7874 16.8057L20.454 13.446L24.3994 10.4185L28.5936 7.7465L33.0048 5.45019L37.5993 3.54707L42.3423 2.05164L47.1975 0.975266L52.128 0.326146L57.0964 0.109224L62.0647 0.326146L66.9952 0.975265L71.8504 2.05164L76.5934 3.54707L81.1879 5.45019L85.5991 7.74651L89.7933 10.4185L93.7387 13.446L97.4053 16.8057L100.765 20.4723L103.792 24.4177L106.465 28.6119L108.761 33.0231L110.664 37.6177L112.159 42.3606L113.182 46.9728C113.863 50.0462 111.924 53.09 108.851 53.7714Z" fill="#9E2891" fill-opacity="0.2"/>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

8
src/assets/Mascot.svg Normal file
View File

@ -0,0 +1,8 @@
<svg width="170" height="196" viewBox="0 0 170 196" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M117.067 182.177C115.877 197.212 110.275 195.264 85.2333 195.212C84.4448 195.21 75.1908 196.597 70.8903 191.049C65.6205 184.25 72.0278 153.148 66.6476 148.541C35.4189 121.795 4.51062 115.662 0.0823302 67.1799C-1.67884 47.8957 25.4175 31.9131 23.7554 61.6575C23.719 62.3058 22.9739 65.1635 25.0985 62.8067C29.2141 58.2412 41.0922 63.3382 31.2926 74.5349C28.6322 77.5748 24.8148 77.7486 29.7086 86.6516C31.7965 90.4499 32.1575 90.3838 32.4261 90.1526C41.4869 82.3661 45.6132 74.0124 53.4047 80.4715C54.0587 81.0137 84.7318 107.292 87.455 109.625C94.8854 115.991 95.9815 110.8 108.517 100.555C133.126 80.4434 138.456 71.3292 144.851 76.8954C171.122 99.7616 171.024 101.369 169.414 104.755C166.698 110.466 118.649 145.024 117.265 151.52C117.004 152.747 117.06 155.903 117.067 182.176V182.177Z" fill="#9E2891"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M95.9691 7.04231C107.402 12.0196 133.385 46.145 132.81 49.3317C132.545 50.7992 131.661 50.4639 115.134 43.4362C88.5694 32.1406 77.2952 56.2361 54.3034 49.0066C52.8236 48.5409 50.3187 46.5017 62.8984 31.6198C77.3155 14.5642 81.6895 4.59241 95.9691 7.04231Z" fill="#9E2891"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M104.13 80.7417C101.825 93.3925 78.112 87.9719 81.2646 79.2604C83.4853 73.1244 89.8626 86.8841 97.1122 80.5444C97.7996 79.9435 102.375 73.8938 104.13 80.7417Z" fill="#9E2891"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M67.3682 66.1875C67.5867 65.3843 69.8818 56.9538 76.5731 61.3381C85.3369 67.0807 70.2095 79.6629 67.3682 66.1875Z" fill="#9E2891"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M106.098 66.1791C106.299 65.3769 108.584 56.2798 115.233 61.3404C123.931 67.9593 108.563 79.161 106.098 66.1791Z" fill="#9E2891"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M89.5097 3.27682C89.8473 3.71664 89.8388 3.7058 90.174 4.14097C91.8303 6.28896 92.274 4.5622 94.3639 1.95891C96.0729 -0.16895 96.6436 -0.723371 98.6653 1.09553C100.365 2.62483 99.0602 3.86144 97.4946 5.84759C96.4128 7.21893 96.3423 7.28397 96.4213 7.96074C96.4988 8.62279 96.7775 8.4323 98.8574 9.274C105.076 11.7913 99.5535 16.8431 88.6765 15.9038C82.979 15.4121 79.9885 12.8584 81.4551 10.8831C83.1269 8.63131 86.2172 9.03241 86.4046 7.96926C86.5788 6.97811 85.8719 6.46241 85.0635 5.44804C82.9534 2.79983 82.852 2.17959 84.6577 0.764118C86.7856 -0.903788 87.5932 0.850068 89.5097 3.27682Z" fill="#9E2891"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

8
src/assets/Practice.svg Normal file
View File

@ -0,0 +1,8 @@
<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M63.9919 0C60.8419 0 57.6937 1.20941 55.3022 3.60086L50.6045 8.29848C46.3616 12.5413 40.6045 14.9155 34.6041 14.9155H27.1926C20.4286 14.9155 14.902 20.4419 14.902 27.206V32.6496V34.6214C14.902 40.6217 12.5277 46.3747 8.28487 50.6175L3.58719 55.3152C-1.19573 60.0981 -1.19573 67.9196 3.58719 72.7025L8.28487 77.4001C12.5277 81.643 14.902 87.3919 14.902 93.3922V100.808C14.902 107.572 20.4286 113.098 27.1926 113.098H34.6041C40.6045 113.098 46.3616 115.476 50.6045 119.719L55.3022 124.413C60.0851 129.196 67.8988 129.196 72.6817 124.413L77.3834 119.719C81.6263 115.476 87.3795 113.098 93.3798 113.098H100.791C107.555 113.098 113.082 107.572 113.082 100.808V93.3922C113.082 87.3919 115.476 81.643 119.719 77.4001L124.413 72.7025C129.196 67.9196 129.196 60.0981 124.413 55.3152L119.719 50.6175C115.476 46.3746 113.082 40.6217 113.082 34.6214V27.206C113.082 20.4419 107.555 14.9155 100.791 14.9155H93.3798C87.3795 14.9155 81.6263 12.5414 77.3834 8.29848L72.6817 3.60086C70.2902 1.20941 67.142 7.80299e-06 63.9919 0Z" fill="#9E2891" fill-opacity="0.2"/>
<path d="M63.9929 8C61.2366 8 58.482 9.05824 56.3894 11.1508L52.2789 15.2612C48.5664 18.9737 43.5289 21.051 38.2786 21.051H31.7936C25.875 21.051 21.0393 25.8867 21.0393 31.8052V36.5684V38.2937C21.0393 43.544 18.9618 48.5778 15.2493 52.2903L11.1388 56.4008C6.95374 60.5858 6.95374 67.4297 11.1388 71.6147L15.2493 75.7251C18.9618 79.4376 21.0393 84.4679 21.0393 89.7182V96.2067C21.0393 102.125 25.875 106.961 31.7936 106.961H38.2786C43.5289 106.961 48.5664 109.042 52.2789 112.754L56.3894 116.861C60.5745 121.046 67.4115 121.046 71.5965 116.861L75.7105 112.754C79.423 109.042 84.457 106.961 89.7073 106.961H96.1924C102.111 106.961 106.947 102.125 106.947 96.2067V89.7182C106.947 84.4679 109.042 79.4376 112.754 75.7251L116.861 71.6147C121.046 67.4297 121.046 60.5859 116.861 56.4008L112.754 52.2903C109.042 48.5778 106.947 43.544 106.947 38.2937V31.8052C106.947 25.8867 102.111 21.051 96.1924 21.051H89.7073C84.457 21.051 79.423 18.9737 75.7105 15.2612L71.5965 11.1508C69.504 9.05823 66.7492 8.00001 63.9929 8Z" fill="#9E2891"/>
<path d="M56.417 54.2498C56.417 52.056 58.3571 49.9165 60.7503 49.9165C63.1436 49.9165 65.0837 51.6949 65.0837 53.8887C65.0837 54.6795 64.8317 55.4163 64.397 56.0353C63.102 57.8802 60.7503 59.6394 60.7503 61.8332" stroke="white" stroke-width="3.25" stroke-linecap="round"/>
<path d="M60.75 67.25H60.7695" stroke="white" stroke-width="3.25" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M55.333 80.25C57.6088 82.1344 60.3478 83.3349 63.4873 83.5407C65.9609 83.703 68.5434 83.7028 71.0121 83.5407C71.8621 83.4851 72.7888 83.2848 73.5867 82.9605C74.4744 82.5997 74.9186 82.4193 75.1444 82.4466C75.3699 82.4739 75.6973 82.7122 76.3521 83.1887C77.5065 84.0287 78.9607 84.6321 81.1174 84.5803C82.2079 84.5541 82.7533 84.5409 82.9972 84.1303C83.2414 83.7195 82.9374 83.151 82.3292 82.0139C81.486 80.4368 80.9517 78.6313 81.7614 77.1846C83.1558 75.1182 84.3401 72.6712 84.5132 70.0283C84.6062 68.6083 84.6062 67.1375 84.5132 65.7175C84.398 63.9564 83.9705 62.2825 83.2856 60.75" stroke="white" stroke-width="3.25" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M64.5127 74.8739C71.7633 74.3983 77.5387 68.6181 78.0139 61.3615C78.1068 59.9415 78.1068 58.4707 78.0139 57.0506C77.5387 49.794 71.7633 44.0137 64.5127 43.5381C62.0391 43.3758 59.4565 43.3761 56.988 43.5381C49.7374 44.0137 43.962 49.794 43.4867 57.0506C43.3937 58.4707 43.3937 59.9415 43.4867 61.3615C43.6598 64.0044 44.8443 66.4514 46.2387 68.5178C47.0483 69.9645 46.514 71.7699 45.6707 73.3471C45.0626 74.4841 44.7586 75.0527 45.0027 75.4635C45.2468 75.874 45.7921 75.8873 46.8827 75.9135C49.0393 75.9653 50.4937 75.3618 51.648 74.5218C52.3028 74.0454 52.6301 73.807 52.8558 73.7797C53.0814 73.7524 53.5254 73.9329 54.4133 74.2937C55.2113 74.618 56.1379 74.8182 56.988 74.8739C59.4565 75.036 62.0391 75.0362 64.5127 74.8739Z" stroke="white" stroke-width="3.25" stroke-linejoin="round"/>
</svg>

After

Width:  |  Height:  |  Size: 4.0 KiB

24
src/assets/logo.svg Normal file
View File

@ -0,0 +1,24 @@
<svg width="524" height="173" viewBox="0 0 524 173" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_23_9014)">
<path d="M194.31 28.74L206.48 51L219.27 28.76H232.21L212.29 62.86V83H200.67V62.84L180.75 28.74H194.31Z" fill="white"/>
<path d="M247.79 32.69C247.809 33.51 247.661 34.3253 247.353 35.0855C247.045 35.8457 246.584 36.5347 246 37.11C245.412 37.6963 244.71 38.1565 243.938 38.4625C243.166 38.7686 242.34 38.914 241.51 38.89C240.677 38.907 239.85 38.7584 239.076 38.4528C238.302 38.1472 237.596 37.6908 237 37.11C236.41 36.5373 235.944 35.8494 235.631 35.0891C235.317 34.3287 235.164 33.5122 235.18 32.69C235.159 31.8731 235.31 31.0609 235.623 30.3062C235.937 29.5516 236.406 28.8714 237 28.31C237.604 27.7351 238.317 27.2854 239.096 26.9867C239.875 26.6881 240.706 26.5465 241.54 26.57C242.362 26.5477 243.18 26.6902 243.946 26.989C244.712 27.2879 245.41 27.737 246 28.31C246.586 28.8756 247.048 29.5572 247.356 30.3113C247.665 31.0655 247.812 31.8756 247.79 32.69ZM246.93 43.15V83H236V43.15H246.93Z" fill="white"/>
<path d="M316.92 61.13V83.07H306V60.74C306 54.7 303.7 51.68 299.1 51.68C298.017 51.641 296.939 51.8473 295.947 52.2837C294.954 52.7201 294.074 53.3752 293.37 54.2C291.819 56.1915 291.048 58.6803 291.2 61.2V83.07H280.26V60.74C280.26 54.7 277.927 51.68 273.26 51.68C272.176 51.6412 271.098 51.855 270.11 52.3045C269.123 52.754 268.253 53.4269 267.57 54.27C266.061 56.2816 265.304 58.7583 265.43 61.27V83.07H254.53V43.15H264.06L265.06 48.15C266.341 46.4745 267.981 45.1076 269.86 44.15C272.055 43.1452 274.447 42.643 276.86 42.68C282.54 42.68 286.494 44.9267 288.72 49.42C290.134 47.2728 292.099 45.5458 294.41 44.42C296.907 43.2298 299.645 42.6342 302.41 42.68C304.364 42.6151 306.308 42.9668 308.115 43.7116C309.922 44.4565 311.55 45.5774 312.89 47C315.57 49.8067 316.914 54.5167 316.92 61.13Z" fill="white"/>
<path d="M363 83H357.42C352.4 83 349.944 80.83 350.05 76.49C348.731 78.6384 346.895 80.4226 344.71 81.68C342.347 82.9271 339.701 83.5403 337.03 83.46C332.59 83.46 329.014 82.44 326.3 80.4C324.968 79.4019 323.9 78.0925 323.19 76.5864C322.481 75.0802 322.151 73.4231 322.23 71.76C322.153 69.8652 322.549 67.9809 323.382 66.2771C324.214 64.5733 325.458 63.1034 327 62C330.12 59.7 334.654 58.55 340.6 58.55H348.51V56.56C348.542 55.736 348.377 54.9164 348.029 54.1687C347.681 53.4211 347.161 52.7668 346.51 52.26C344.913 51.1085 342.966 50.5465 341 50.67C339.238 50.5873 337.492 51.0481 336 51.99C335.383 52.3861 334.857 52.9079 334.455 53.5213C334.054 54.1348 333.786 54.8261 333.67 55.55H323.19C323.3 53.6561 323.848 51.8134 324.79 50.1668C325.732 48.5201 327.043 47.1144 328.62 46.06C331.874 43.8133 336.187 42.69 341.56 42.69C347.187 42.69 351.54 43.93 354.62 46.41C357.7 48.89 359.237 52.48 359.23 57.18V71.18C359.19 71.5381 359.224 71.9007 359.331 72.2449C359.438 72.5891 359.614 72.9075 359.85 73.18C360.408 73.5936 361.098 73.7892 361.79 73.73H363V83ZM340.47 65.78C338.602 65.6742 336.747 66.1493 335.16 67.14C334.544 67.5708 334.048 68.1509 333.717 68.8261C333.386 69.5012 333.233 70.2492 333.27 71C333.247 71.6411 333.379 72.2783 333.654 72.8578C333.929 73.4374 334.339 73.9423 334.85 74.33C336.106 75.2174 337.625 75.6544 339.16 75.57C340.39 75.6344 341.62 75.4517 342.777 75.0326C343.935 74.6135 344.997 73.9666 345.9 73.13C346.741 72.2633 347.401 71.2376 347.84 70.1129C348.28 68.9882 348.49 67.7872 348.46 66.58V65.8L340.47 65.78Z" fill="white"/>
<path d="M391.54 53.07H387.2C384.1 53.07 381.827 54 380.38 55.86C378.827 58.0794 378.063 60.7553 378.21 63.46V83H367.29V43.15H377.21L378.21 49.15C379.277 47.3096 380.799 45.7739 382.63 44.69C384.812 43.5903 387.239 43.0703 389.68 43.18H391.54V53.07Z" fill="white"/>
<path d="M433.94 83H424.25L423.25 78.19C421.853 79.9283 420.065 81.3117 418.032 82.2275C415.999 83.1434 413.778 83.5657 411.55 83.46C409.459 83.5413 407.373 83.2027 405.415 82.4642C403.457 81.7256 401.667 80.6021 400.15 79.16C397.21 76.2867 395.74 71.4967 395.74 64.79V43.15H406.66V63.46C406.66 67.08 407.3 69.8 408.56 71.63C409.218 72.552 410.101 73.2899 411.125 73.7732C412.149 74.2564 413.28 74.4688 414.41 74.39C415.642 74.4479 416.869 74.1975 417.979 73.6614C419.09 73.1253 420.049 72.3206 420.77 71.32C422.257 69.28 423 66.4267 423 62.76V43.15H433.93L433.94 83Z" fill="white"/>
<path d="M200.9 89.43H214.85L234.54 143.68H222.06L217.87 131.82H197.26L193.07 143.68H181.07L200.9 89.43ZM214.7 122.43L207.49 101.82L200.36 122.43H214.7Z" fill="white"/>
<path d="M255.77 144.15C251.999 144.235 248.268 143.369 244.92 141.63C241.873 140.003 239.377 137.507 237.75 134.46C236.09 131.132 235.226 127.464 235.226 123.745C235.226 120.026 236.09 116.358 237.75 113.03C239.403 109.984 241.927 107.501 245 105.9C248.362 104.162 252.107 103.296 255.89 103.38C261.224 103.38 265.557 104.737 268.89 107.45C272.315 110.281 274.532 114.312 275.09 118.72H263.75C263.384 116.884 262.417 115.223 261 114C259.536 112.814 257.693 112.197 255.81 112.26C254.504 112.217 253.205 112.482 252.02 113.035C250.835 113.587 249.797 114.411 248.99 115.44C247.323 117.885 246.431 120.776 246.431 123.735C246.431 126.694 247.323 129.585 248.99 132.03C249.799 133.056 250.838 133.877 252.023 134.427C253.207 134.978 254.505 135.243 255.81 135.2C257.737 135.266 259.623 134.634 261.12 133.42C262.579 132.164 263.552 130.438 263.87 128.54H275.11C274.597 133.016 272.376 137.121 268.91 140C265.517 142.76 261.137 144.143 255.77 144.15Z" fill="white"/>
<path d="M320.17 143.68H314.59C309.583 143.68 307.13 141.51 307.23 137.17C305.907 139.319 304.068 141.103 301.88 142.36C299.521 143.609 296.878 144.226 294.21 144.15C289.76 144.15 286.21 143.15 283.47 141.08C282.137 140.082 281.069 138.773 280.36 137.266C279.65 135.76 279.321 134.103 279.4 132.44C279.31 130.546 279.691 128.659 280.51 126.949C281.328 125.239 282.558 123.758 284.09 122.64C287.223 120.34 291.76 119.19 297.7 119.19H305.6V117.25C305.632 116.426 305.467 115.606 305.119 114.858C304.772 114.11 304.251 113.456 303.6 112.95C302.059 111.957 300.275 111.407 298.442 111.359C296.61 111.312 294.8 111.768 293.21 112.68C292.595 113.078 292.071 113.6 291.671 114.213C291.271 114.827 291.005 115.517 290.89 116.24H280.33C280.442 114.347 280.99 112.505 281.932 110.858C282.874 109.212 284.184 107.806 285.76 106.75C289.013 104.503 293.326 103.38 298.7 103.38C304.34 103.38 308.693 104.62 311.76 107.1C314.826 109.58 316.363 113.17 316.37 117.87V131.87C316.332 132.228 316.367 132.59 316.474 132.934C316.58 133.278 316.756 133.596 316.99 133.87C317.552 134.274 318.239 134.466 318.93 134.41H320.17V143.68ZM297.62 126.47C295.751 126.36 293.895 126.836 292.31 127.83C291.694 128.257 291.197 128.833 290.865 129.505C290.532 130.177 290.376 130.921 290.41 131.67C290.388 132.312 290.521 132.95 290.798 133.529C291.074 134.109 291.487 134.613 292 135C293.252 135.887 294.767 136.324 296.3 136.24C297.523 136.301 298.746 136.117 299.897 135.698C301.047 135.279 302.102 134.634 303 133.8C303.844 132.936 304.506 131.911 304.946 130.785C305.386 129.66 305.594 128.458 305.56 127.25V126.47H297.62Z" fill="white"/>
<path d="M364.27 143.68H354.73L353.65 138.18C352.225 140.111 350.352 141.666 348.191 142.712C346.031 143.757 343.649 144.261 341.25 144.18C337.925 144.23 334.65 143.358 331.79 141.66C328.968 139.944 326.695 137.456 325.24 134.49C323.61 131.134 322.802 127.44 322.88 123.71C322.795 120.002 323.604 116.329 325.24 113C326.711 110.043 328.998 107.569 331.83 105.87C334.706 104.174 337.992 103.302 341.33 103.35C346.49 103.35 350.49 105.157 353.33 108.77V89.43H364.26L364.27 143.68ZM353.5 123.84C353.645 120.825 352.708 117.857 350.86 115.47C350.01 114.432 348.931 113.605 347.708 113.054C346.485 112.502 345.151 112.241 343.81 112.29C342.464 112.241 341.124 112.503 339.895 113.054C338.665 113.605 337.579 114.432 336.72 115.47C334.978 117.885 334.041 120.787 334.041 123.765C334.041 126.743 334.978 129.645 336.72 132.06C337.581 133.095 338.668 133.919 339.897 134.468C341.126 135.018 342.465 135.278 343.81 135.23C345.147 135.283 346.479 135.027 347.701 134.482C348.924 133.938 350.005 133.119 350.86 132.09C352.705 129.748 353.642 126.818 353.5 123.84Z" fill="white"/>
<path d="M379.88 105.9C383.105 104.17 386.722 103.301 390.38 103.38C394.058 103.311 397.698 104.12 401 105.74C403.986 107.237 406.486 109.55 408.21 112.41C410.559 116.613 411.392 121.496 410.57 126.24H381.7V126.55C381.805 129.079 382.792 131.492 384.49 133.37C385.356 134.219 386.389 134.878 387.524 135.305C388.658 135.732 389.87 135.917 391.08 135.85C393.027 135.923 394.952 135.426 396.62 134.42C398.103 133.446 399.147 131.932 399.53 130.2H410.3C409.913 132.787 408.881 135.236 407.3 137.32C405.634 139.494 403.446 141.214 400.94 142.32C398.09 143.586 394.998 144.21 391.88 144.15C387.901 144.251 383.955 143.401 380.37 141.67C377.234 140.103 374.642 137.629 372.93 134.57C371.14 131.282 370.243 127.583 370.33 123.84C370.23 120.073 371.09 116.342 372.83 113C374.447 110.003 376.895 107.538 379.88 105.9ZM397 113.49C395.244 112.124 393.064 111.416 390.84 111.49C388.664 111.409 386.532 112.119 384.84 113.49C383.196 114.894 382.157 116.879 381.94 119.03H400C399.746 116.868 398.672 114.885 397 113.49Z" fill="white"/>
<path d="M479.28 121.82V143.76H468.35V121.44C468.35 115.393 466.05 112.37 461.45 112.37C460.366 112.329 459.288 112.535 458.295 112.972C457.303 113.408 456.422 114.064 455.72 114.89C454.167 116.881 453.392 119.369 453.54 121.89V143.75H442.62V121.44C442.62 115.393 440.286 112.37 435.62 112.37C434.534 112.33 433.453 112.543 432.464 112.992C431.475 113.442 430.604 114.115 429.92 114.96C428.413 116.973 427.659 119.449 427.79 121.96V143.74H416.89V103.84H426.42L427.42 108.84C428.7 107.164 430.341 105.798 432.22 104.84C434.415 103.835 436.806 103.333 439.22 103.37C444.9 103.37 448.85 105.617 451.07 110.11C452.49 107.965 454.458 106.238 456.77 105.11C459.266 103.92 462.004 103.324 464.77 103.37C466.717 103.299 468.657 103.642 470.462 104.376C472.267 105.111 473.895 106.22 475.24 107.63C477.926 110.477 479.273 115.207 479.28 121.82Z" fill="white"/>
<path d="M502.21 132.44L511.67 103.84H523.37L505.7 149.34C504.985 151.312 504.102 153.219 503.06 155.04C502.312 156.331 501.231 157.398 499.93 158.13C498.401 158.889 496.706 159.25 495 159.18H484.39V150H490.39C491.439 150.081 492.486 149.836 493.39 149.3C494.197 148.556 494.808 147.625 495.17 146.59L496.17 143.95L480.9 103.84H492.52L502.21 132.44Z" fill="white"/>
<path d="M121.07 26.53L98.76 39.42L76.03 52.54L53.26 39.39L53.24 39.38L30.96 26.52L31.41 25.76L53.24 13.15L53.26 13.13L76.02 0L98.76 13.12L120.6 25.74L121.07 26.53Z" fill="white"/>
<path d="M53.26 172.41H98.76V110.9L121.51 97.78L137.93 88.29L152.02 80.15L129.27 40.75L98.76 58.36L92.43 62.02L76 71.49L59.6 62.03L53.26 58.37L53.24 58.36L22.75 40.75L0 80.16L14.09 88.3L30.5 97.78L53.24 110.9L53.26 110.91V137.18V172.41Z" fill="white"/>
</g>
<defs>
<clipPath id="clip0_23_9014">
<rect width="523.37" height="172.42" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 11 KiB

5
src/assets/success.svg Normal file
View File

@ -0,0 +1,5 @@
<svg width="128" height="128" viewBox="0 0 128 128" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M63.9919 0C60.8419 0 57.6937 1.20941 55.3022 3.60086L50.6045 8.29848C46.3616 12.5413 40.6045 14.9155 34.6041 14.9155H27.1926C20.4286 14.9155 14.902 20.4419 14.902 27.206V32.6496V34.6214C14.902 40.6217 12.5277 46.3747 8.28487 50.6175L3.58719 55.3152C-1.19573 60.0981 -1.19573 67.9196 3.58719 72.7025L8.28487 77.4001C12.5277 81.643 14.902 87.3919 14.902 93.3922V100.808C14.902 107.572 20.4286 113.098 27.1926 113.098H34.6041C40.6045 113.098 46.3616 115.476 50.6045 119.719L55.3022 124.413C60.0851 129.196 67.8988 129.196 72.6817 124.413L77.3834 119.719C81.6263 115.476 87.3795 113.098 93.3798 113.098H100.791C107.555 113.098 113.082 107.572 113.082 100.808V93.3922C113.082 87.3919 115.476 81.643 119.719 77.4001L124.413 72.7025C129.196 67.9196 129.196 60.0981 124.413 55.3152L119.719 50.6175C115.476 46.3746 113.082 40.6217 113.082 34.6214V27.206C113.082 20.4419 107.555 14.9155 100.791 14.9155H93.3798C87.3795 14.9155 81.6263 12.5414 77.3834 8.29848L72.6817 3.60086C70.2902 1.20941 67.142 7.80299e-06 63.9919 0Z" fill="#9E2891" fill-opacity="0.2"/>
<path d="M63.9929 8.00006C61.2366 8.00006 58.482 9.0583 56.3894 11.1508L52.2789 15.2612C48.5664 18.9737 43.5289 21.0511 38.2786 21.0511H31.7936C25.875 21.0511 21.0393 25.8867 21.0393 31.8053V36.5684V38.2938C21.0393 43.5441 18.9618 48.5779 15.2493 52.2904L11.1388 56.4009C6.95374 60.5859 6.95374 67.4297 11.1388 71.6148L15.2493 75.7252C18.9618 79.4377 21.0393 84.468 21.0393 89.7183V96.2068C21.0393 102.125 25.875 106.961 31.7936 106.961H38.2786C43.5289 106.961 48.5664 109.042 52.2789 112.754L56.3894 116.861C60.5745 121.046 67.4115 121.046 71.5965 116.861L75.7105 112.754C79.423 109.042 84.457 106.961 89.7073 106.961H96.1924C102.111 106.961 106.947 102.125 106.947 96.2068V89.7183C106.947 84.468 109.042 79.4377 112.754 75.7252L116.861 71.6148C121.046 67.4297 121.046 60.5859 116.861 56.4009L112.754 52.2904C109.042 48.5779 106.947 43.5441 106.947 38.2938V31.8053C106.947 25.8867 102.111 21.0511 96.1924 21.0511H89.7073C84.457 21.0511 79.423 18.9738 75.7105 15.2612L71.5965 11.1508C69.504 9.05829 66.7492 8.00007 63.9929 8.00006Z" fill="#9E2891"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M81.9362 50.3204C82.8406 51.1118 82.9227 52.4904 82.1182 53.3832L59.4729 78.5182C58.6643 79.4157 57.2758 79.4727 56.3963 78.6448L43.2922 66.3084C42.475 65.5391 42.3968 64.2571 43.0979 63.3807C43.8716 62.4136 45.3123 62.2805 46.233 63.1087L56.4 72.2537C57.2836 73.0485 58.6439 72.9774 59.4399 72.095L78.9182 50.4986C79.7063 49.6246 81.0506 49.5454 81.9362 50.3204Z" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -1,15 +1,17 @@
export function BrandLogo() {
import logoSrc from "../../assets/logo.svg";
export function BrandLogo({
className = "h-10",
variant = "dark",
}: {
className?: string;
variant?: "light" | "dark";
}) {
return (
<div className="flex items-center gap-2">
<div className="grid h-9 w-9 place-items-center rounded-lg bg-brand-500 text-white">
<div className="h-4 w-4 rotate-45 rounded-[3px] bg-white/90" />
</div>
<div className="leading-tight">
<div className="text-sm font-semibold text-brand-600">Yimaru</div>
<div className="text-xs font-medium text-brand-400">Academy</div>
</div>
</div>
)
<img
src={logoSrc}
alt="Yimaru Academy"
className={`${className} ${variant === "dark" ? "brightness-0" : ""}`}
/>
);
}

View File

@ -11,6 +11,7 @@ import {
Bell,
UsersRound,
} from "lucide-react"
import spinnerSrc from "../assets/Circular-indeterminate progress indicator.svg"
import {
Area,
AreaChart,
@ -26,6 +27,7 @@ import {
YAxis,
} from "recharts"
import { StatCard } from "../components/dashboard/StatCard"
import alertSrc from "../assets/Alert.svg"
import { Card, CardContent, CardHeader, CardTitle } from "../components/ui/card"
// import { cn } from "../lib/utils"
import { getTeamMemberById } from "../api/team.api"
@ -110,9 +112,15 @@ export function DashboardPage() {
</div>
{loading ? (
<div className="flex items-center justify-center py-20 text-grayScale-500">Loading dashboard</div>
<div className="flex flex-col items-center justify-center gap-3 py-20">
<img src={spinnerSrc} alt="" className="h-10 w-10 animate-spin" />
<span className="text-sm font-medium text-grayScale-400">Loading dashboard</span>
</div>
) : !dashboard ? (
<div className="flex items-center justify-center py-20 text-destructive">Failed to load dashboard data.</div>
<div className="flex flex-col items-center justify-center gap-3 py-20">
<img src={alertSrc} alt="" className="h-12 w-12" />
<span className="text-sm font-medium text-destructive">Failed to load dashboard data.</span>
</div>
) : (
<>
{/* Stat Cards */}

View File

@ -1,4 +1,5 @@
import { useEffect, useState } from "react"
import spinnerSrc from "../../assets/Circular-indeterminate progress indicator.svg"
import {
Area,
AreaChart,
@ -14,6 +15,7 @@ import {
XAxis,
YAxis,
} from "recharts"
import alertSrc from "../../assets/Alert.svg"
import {
Users,
BadgeCheck,
@ -304,7 +306,10 @@ export function AnalyticsPage() {
return (
<div className="mx-auto w-full max-w-6xl">
<div className="mb-4 text-sm font-semibold text-grayScale-500">Analytics</div>
<div className="flex items-center justify-center py-20 text-grayScale-500">Loading analytics</div>
<div className="flex flex-col items-center justify-center gap-3 py-20">
<img src={spinnerSrc} alt="" className="h-10 w-10 animate-spin" />
<span className="text-sm font-medium text-grayScale-400">Loading analytics</span>
</div>
</div>
)
}
@ -314,6 +319,7 @@ export function AnalyticsPage() {
<div className="mx-auto w-full max-w-6xl">
<div className="mb-4 text-sm font-semibold text-grayScale-500">Analytics</div>
<div className="flex flex-col items-center justify-center gap-3 py-20">
<img src={alertSrc} alt="" className="h-12 w-12" />
<span className="text-sm text-destructive">Failed to load analytics data.</span>
<Button variant="outline" size="sm" onClick={fetchData}>
<RefreshCw className="mr-2 h-4 w-4" />

View File

@ -1,6 +1,7 @@
import { useState } from "react"
import { Link } from "react-router-dom"
import { ArrowLeft, Mail } from "lucide-react"
import { ArrowLeft } from "lucide-react"
import successSrc from "../../assets/success.svg"
import { BrandLogo } from "../../components/brand/BrandLogo"
import { Button } from "../../components/ui/button"
@ -30,13 +31,8 @@ export function ForgotPasswordPage() {
</div>
<div className="relative z-10 max-w-md px-12 text-center">
{/* Large brand icon */}
<div className="mx-auto mb-8 grid h-20 w-20 place-items-center rounded-2xl bg-white/15 shadow-lg backdrop-blur-sm">
<div className="h-9 w-9 rotate-45 rounded-lg bg-white/90" />
</div>
<h2 className="mb-4 text-3xl font-bold tracking-tight text-white">
Yimaru Academy
</h2>
{/* Brand logo */}
<BrandLogo variant="light" className="mx-auto mb-8 h-16" />
<p className="text-base leading-relaxed text-white/70">
Manage your academy, track student progress, and streamline
operations all from one powerful dashboard.
@ -64,9 +60,7 @@ export function ForgotPasswordPage() {
{submitted ? (
/* Success state */
<div className="text-center">
<div className="mx-auto mb-6 grid h-16 w-16 place-items-center rounded-full bg-brand-100/60">
<Mail className="h-7 w-7 text-brand-500" />
</div>
<img src={successSrc} alt="" className="mx-auto mb-6 h-20 w-20" />
<h1 className="mb-2 text-2xl font-bold tracking-tight text-grayScale-600">
Check your email
</h1>

View File

@ -6,6 +6,7 @@ import { BrandLogo } from "../../components/brand/BrandLogo";
import { Button } from "../../components/ui/button";
import { Input } from "../../components/ui/input";
import { login, loginWithGoogle } from "../../api/auth.api";
import type { LoginRequest } from "../../types/auth.types";
import type { LoginResult } from "../../api/auth.api";
@ -216,13 +217,8 @@ export function LoginPage() {
</div>
<div className="relative z-10 max-w-md px-12 text-center">
{/* Large brand icon */}
<div className="mx-auto mb-8 grid h-20 w-20 place-items-center rounded-2xl bg-white/15 shadow-lg backdrop-blur-sm">
<div className="h-9 w-9 rotate-45 rounded-lg bg-white/90" />
</div>
<h2 className="mb-4 text-3xl font-bold tracking-tight text-white">
Yimaru Academy
</h2>
{/* Brand logo */}
<BrandLogo variant="light" className="mx-auto mb-8 h-16" />
<p className="text-base leading-relaxed text-white/70">
Manage your academy, track student progress, and streamline
operations all from one powerful dashboard.

View File

@ -1,6 +1,8 @@
import { useEffect, useState } from "react"
import { Link } from "react-router-dom"
import { FolderOpen, RefreshCw, AlertCircle, BookOpen } from "lucide-react"
import { FolderOpen, RefreshCw, BookOpen } from "lucide-react"
import spinnerSrc from "../../assets/Circular-indeterminate progress indicator.svg"
import alertSrc from "../../assets/Alert.svg"
import { Card, CardContent, CardHeader, CardTitle } from "../../components/ui/card"
import { getCourseCategories } from "../../api/courses.api"
import type { CourseCategory } from "../../types/course.types"
@ -31,10 +33,7 @@ export function CourseCategoryPage() {
if (loading) {
return (
<div className="flex flex-col items-center justify-center gap-4 py-24">
<div className="relative">
<div className="h-12 w-12 rounded-full border-4 border-brand-100" />
<div className="absolute inset-0 h-12 w-12 animate-spin rounded-full border-4 border-transparent border-t-brand-500" />
</div>
<img src={spinnerSrc} alt="" className="h-10 w-10 animate-spin" />
<span className="text-sm font-medium text-grayScale-400">Loading categories</span>
</div>
)
@ -44,9 +43,7 @@ export function CourseCategoryPage() {
return (
<div className="flex items-center justify-center py-24">
<div className="flex flex-col items-center gap-4 rounded-2xl border border-red-100 bg-red-50/60 px-10 py-8 text-center shadow-sm">
<div className="grid h-12 w-12 place-items-center rounded-full bg-red-100">
<AlertCircle className="h-6 w-6 text-red-500" />
</div>
<img src={alertSrc} alt="" className="h-12 w-12" />
<div>
<p className="text-sm font-semibold text-red-700">{error}</p>
<p className="mt-1 text-xs text-red-400">

View File

@ -1,7 +1,10 @@
import { useEffect, useState, useRef } from "react"
import { Link, useParams, useNavigate } from "react-router-dom"
import { Plus, ArrowLeft, BookOpen, ToggleLeft, ToggleRight, X, Trash2, MoreVertical, Edit, RefreshCw, AlertCircle } from "lucide-react"
import { Plus, ArrowLeft, ToggleLeft, ToggleRight, X, Trash2, MoreVertical, Edit, AlertCircle } from "lucide-react"
import practiceSrc from "../../assets/Practice.svg"
import spinnerSrc from "../../assets/Circular-indeterminate progress indicator.svg"
import { Card, CardContent } from "../../components/ui/card"
import alertSrc from "../../assets/Alert.svg"
import { Button } from "../../components/ui/button"
import { Badge } from "../../components/ui/badge"
import { Input } from "../../components/ui/input"
@ -238,9 +241,7 @@ export function CoursesPage() {
if (loading) {
return (
<div className="flex flex-col items-center justify-center py-32">
<div className="rounded-2xl bg-brand-50/50 p-6">
<RefreshCw className="h-10 w-10 animate-spin text-brand-500" />
</div>
<img src={spinnerSrc} alt="" className="h-10 w-10 animate-spin" />
<p className="mt-4 text-sm font-medium text-grayScale-400">Loading courses...</p>
</div>
)
@ -250,9 +251,7 @@ export function CoursesPage() {
return (
<div className="flex items-center justify-center py-32">
<div className="mx-4 flex w-full max-w-md items-center gap-3 rounded-2xl border border-red-100 bg-red-50 px-6 py-5 shadow-sm">
<div className="rounded-full bg-red-100 p-2">
<AlertCircle className="h-5 w-5 shrink-0 text-red-500" />
</div>
<img src={alertSrc} alt="" className="h-10 w-10 shrink-0" />
<p className="text-sm font-medium text-red-600">{error}</p>
</div>
</div>
@ -291,9 +290,7 @@ export function CoursesPage() {
{courses.length === 0 ? (
<Card className="border-dashed border-grayScale-200 shadow-none">
<CardContent className="flex flex-col items-center justify-center py-20">
<div className="rounded-2xl bg-grayScale-50 p-5">
<BookOpen className="h-14 w-14 text-grayScale-300" />
</div>
<img src={practiceSrc} alt="" className="h-20 w-20" />
<h3 className="mt-5 text-base font-semibold text-grayScale-600">No courses yet</h3>
<p className="mt-1.5 text-sm text-grayScale-400">No courses found in this category</p>
<Button variant="outline" className="mt-6 border-brand-200 text-brand-600 transition-colors hover:bg-brand-50" onClick={handleOpenModal}>

View File

@ -1,7 +1,10 @@
import { useEffect, useState } from "react"
import { Link, useParams } from "react-router-dom"
import { ArrowLeft, HelpCircle, Plus, Edit, Trash2, X } from "lucide-react"
import { ArrowLeft, Plus, Edit, Trash2, X } from "lucide-react"
import practiceSrc from "../../assets/Practice.svg"
import spinnerSrc from "../../assets/Circular-indeterminate progress indicator.svg"
import { Card, CardContent, CardHeader, CardTitle } from "../../components/ui/card"
import alertSrc from "../../assets/Alert.svg"
import { Badge } from "../../components/ui/badge"
import { Button } from "../../components/ui/button"
import { getPracticeQuestions, createPracticeQuestion, updatePracticeQuestion, deletePracticeQuestion } from "../../api/courses.api"
@ -171,7 +174,7 @@ export function PracticeQuestionsPage() {
if (loading) {
return (
<div className="flex flex-col items-center justify-center py-20">
<div className="h-8 w-8 animate-spin rounded-full border-2 border-grayScale-200 border-t-brand-500" />
<img src={spinnerSrc} alt="" className="h-8 w-8 animate-spin" />
<p className="mt-4 text-sm font-medium text-grayScale-500">Loading questions...</p>
</div>
)
@ -180,9 +183,7 @@ export function PracticeQuestionsPage() {
if (error) {
return (
<div className="flex flex-col items-center justify-center py-20">
<div className="flex h-12 w-12 items-center justify-center rounded-full bg-red-100">
<X className="h-6 w-6 text-red-500" />
</div>
<img src={alertSrc} alt="" className="h-12 w-12" />
<p className="mt-4 text-sm font-medium text-red-600">{error}</p>
</div>
)
@ -212,9 +213,7 @@ export function PracticeQuestionsPage() {
{questions.length === 0 ? (
<Card className="border-2 border-dashed border-grayScale-200 shadow-none">
<CardContent className="flex flex-col items-center justify-center py-16">
<div className="flex h-16 w-16 items-center justify-center rounded-full bg-grayScale-100">
<HelpCircle className="h-8 w-8 text-grayScale-300" />
</div>
<img src={practiceSrc} alt="" className="h-20 w-20" />
<p className="mt-4 text-sm font-medium text-grayScale-600">No questions found for this practice</p>
<p className="mt-1 text-xs text-grayScale-400">Get started by adding your first question</p>
<Button variant="outline" className="mt-6 border-brand-200 text-brand-600 hover:bg-brand-50" onClick={handleAddQuestion}>

View File

@ -1,7 +1,9 @@
import { useEffect, useState } from "react"
import { Link, useParams, useNavigate } from "react-router-dom"
import { ArrowLeft, Plus, FileText, Layers, Edit, Trash2, X, Video, MoreVertical } from "lucide-react"
import spinnerSrc from "../../assets/Circular-indeterminate progress indicator.svg"
import { Card } from "../../components/ui/card"
import alertSrc from "../../assets/Alert.svg"
import { Badge } from "../../components/ui/badge"
import { Button } from "../../components/ui/button"
import { Input } from "../../components/ui/input"
@ -286,7 +288,7 @@ export function SubCourseContentPage() {
if (loading) {
return (
<div className="flex flex-col items-center justify-center py-20">
<div className="h-8 w-8 animate-spin rounded-full border-2 border-brand-500 border-t-transparent" />
<img src={spinnerSrc} alt="" className="h-8 w-8 animate-spin" />
<p className="mt-4 text-sm font-medium text-grayScale-500">Loading sub-course</p>
</div>
)
@ -295,9 +297,7 @@ export function SubCourseContentPage() {
if (error) {
return (
<div className="flex flex-col items-center justify-center py-20">
<div className="rounded-full bg-red-50 p-3">
<X className="h-6 w-6 text-red-500" />
</div>
<img src={alertSrc} alt="" className="h-12 w-12" />
<p className="mt-3 text-sm font-medium text-red-600">{error}</p>
</div>
)

View File

@ -1,7 +1,10 @@
import { useEffect, useState, useRef } from "react"
import { Link, useParams, useNavigate } from "react-router-dom"
import { ArrowLeft, Layers, ToggleLeft, ToggleRight, MoreVertical, X, Trash2, RefreshCw, AlertCircle, Edit } from "lucide-react"
import { ArrowLeft, ToggleLeft, ToggleRight, MoreVertical, X, Trash2, AlertCircle, Edit } from "lucide-react"
import practiceSrc from "../../assets/Practice.svg"
import spinnerSrc from "../../assets/Circular-indeterminate progress indicator.svg"
import { Card, CardContent } from "../../components/ui/card"
import alertSrc from "../../assets/Alert.svg"
import { Badge } from "../../components/ui/badge"
import { Button } from "../../components/ui/button"
import { getSubCoursesByCourse, getCoursesByCategory, getCourseCategories, createSubCourse, updateSubCourse, updateSubCourseStatus, deleteSubCourse } from "../../api/courses.api"
@ -199,9 +202,7 @@ export function SubCoursesPage() {
if (loading) {
return (
<div className="flex flex-col items-center justify-center py-24">
<div className="rounded-full bg-brand-50 p-4">
<RefreshCw className="h-8 w-8 animate-spin text-brand-500" />
</div>
<img src={spinnerSrc} alt="" className="h-10 w-10 animate-spin" />
<p className="mt-4 text-sm font-medium text-grayScale-400">Loading sub-courses...</p>
</div>
)
@ -211,9 +212,7 @@ export function SubCoursesPage() {
return (
<div className="flex items-center justify-center py-24">
<div className="mx-4 flex w-full max-w-md items-center gap-3 rounded-xl border border-red-100 bg-red-50 px-5 py-4 shadow-md">
<div className="rounded-full bg-red-100 p-2">
<AlertCircle className="h-5 w-5 shrink-0 text-red-500" />
</div>
<img src={alertSrc} alt="" className="h-10 w-10 shrink-0" />
<p className="text-sm font-medium text-red-600">{error}</p>
</div>
</div>
@ -250,9 +249,7 @@ export function SubCoursesPage() {
{subCourses.length === 0 ? (
<Card className="border border-dashed border-grayScale-200 shadow-none">
<CardContent className="flex flex-col items-center justify-center py-16">
<div className="rounded-2xl bg-brand-50 p-5">
<Layers className="h-10 w-10 text-brand-400" />
</div>
<img src={practiceSrc} alt="" className="h-20 w-20" />
<h3 className="mt-5 text-base font-semibold text-grayScale-600">No sub-courses yet</h3>
<p className="mt-1.5 max-w-xs text-center text-sm text-grayScale-400">Get started by adding your first sub-course to this course</p>
<Button className="mt-5 rounded-xl bg-brand-500 px-5 shadow-sm hover:bg-brand-600 hover:shadow-md" onClick={handleAddSubCourse}>

View File

@ -1,4 +1,5 @@
import { useCallback, useEffect, useState } from "react";
import spinnerSrc from "../../assets/Circular-indeterminate progress indicator.svg";
import {
Search,
ChevronDown,
@ -376,7 +377,7 @@ export function UserLogPage() {
<TableRow>
<TableCell colSpan={6} className="text-center py-12">
<div className="flex flex-col items-center gap-3">
<RefreshCw className="h-6 w-6 animate-spin text-grayScale-300" />
<img src={spinnerSrc} alt="" className="h-6 w-6 animate-spin" />
<span className="text-sm text-grayScale-400">Loading activity logs...</span>
</div>
</TableCell>