chnages were made for the attandence screen

This commit is contained in:
Daniah Ayad Al-sultani
2025-12-03 14:59:45 +03:00
parent 2bfeabe586
commit 4123e43417
6 changed files with 449 additions and 32 deletions

11
assets/images/error.svg Normal file
View File

@@ -0,0 +1,11 @@
<svg width="97" height="97" viewBox="0 0 97 97" fill="none" xmlns="http://www.w3.org/2000/svg">
<mask id="mask0_250_2225" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="21" y="21" width="55" height="55">
<path d="M28.292 28.2917L68.7087 68.7084M28.292 68.7084L68.7087 28.2917" stroke="black" stroke-width="13" stroke-linecap="round" stroke-linejoin="round"/>
</mask>
<g mask="url(#mask0_250_2225)">
<path d="M20.5559 43.8879C20.1513 43.8915 19.753 43.788 19.4014 43.588C19.1435 43.4431 18.9171 43.2481 18.7354 43.0146C18.5537 42.781 18.4205 42.5136 18.3434 42.228C18.2663 41.9423 18.247 41.6442 18.2866 41.351C18.3261 41.0578 18.4238 40.7754 18.5737 40.5204C21.4645 35.6955 30.2597 24.4338 49.4514 24.4338C57.7682 24.4338 65.0626 26.6184 71.1215 30.9245C76.1083 34.4585 78.9031 38.4588 80.2345 40.3854C80.4034 40.6283 80.5219 40.9025 80.5832 41.1918C80.6445 41.4812 80.6473 41.7799 80.5914 42.0704C80.5356 42.3608 80.4221 42.6372 80.2578 42.8831C80.0935 43.1291 79.8817 43.3397 79.6348 43.5026C79.1301 43.8362 78.5154 43.9601 77.9209 43.8482C77.3264 43.7362 76.7989 43.3971 76.4501 42.9028C74.0407 39.4378 66.6939 28.8944 49.4514 28.8944C32.6212 28.8944 25.012 38.5967 22.5335 42.7574C22.3344 43.1048 22.0461 43.3928 21.6984 43.5915C21.3508 43.7903 20.9563 43.8926 20.5559 43.8879Z" fill="#B84A4A"/>
<path d="M59.1205 87.9688C58.9291 87.9711 58.7382 87.9494 58.5522 87.9043C44.6308 84.4558 39.4325 70.5388 39.2211 69.9601L39.1882 69.8326C39.0742 69.4308 36.2809 59.8875 40.569 54.2979C42.5347 51.749 45.5244 50.4416 49.4722 50.4416C53.1426 50.4416 55.7905 51.5826 57.6107 53.944C59.11 55.8722 59.7098 58.2502 60.29 60.5412C61.509 65.3121 62.3891 67.8175 67.4554 68.0754C69.6804 68.1879 71.1423 66.8864 71.9714 65.7784C74.213 62.7572 74.6028 57.8318 72.913 53.4837C70.742 47.8717 63.0368 37.2908 49.4512 37.2908C43.6517 37.2908 38.323 39.1544 34.0499 42.6569C30.5129 45.5582 27.7106 49.6544 26.3612 53.8646C23.8588 61.7032 27.1409 74.0248 27.1724 74.1373C27.249 74.424 27.2674 74.7233 27.2266 75.0173C27.1857 75.3113 27.0865 75.5941 26.9346 75.8492C26.7827 76.1042 26.5812 76.3262 26.3422 76.5021C26.1031 76.6781 25.8312 76.8044 25.5426 76.8736C24.9594 77.0287 24.3387 76.9491 23.8135 76.6521C23.2883 76.355 22.9003 75.864 22.7328 75.2843C22.5829 74.722 19.0774 61.5802 21.9681 52.5211C25.1168 42.7049 34.834 32.8092 49.4557 32.8092C56.2133 32.8092 62.5975 35.1062 67.9262 39.4438C72.0524 42.8174 75.4229 47.3484 77.1862 51.8779C79.4277 57.6609 78.8265 64.1516 75.6583 68.3918C73.5472 71.2195 70.5411 72.6979 67.211 72.5375C58.5358 72.1026 56.9764 66.0468 55.8399 61.6297C54.6704 57.0987 53.9223 54.9141 49.4557 54.9141C47.0028 54.9141 45.28 55.5888 44.208 56.9862C42.7461 58.8979 42.6322 61.8861 42.7941 64.0541C42.9003 65.5647 43.1565 67.0609 43.5588 68.5207C43.9156 69.4203 48.5621 80.8154 59.6903 83.5727C59.9779 83.6408 60.2491 83.7654 60.4882 83.9393C60.7272 84.1131 60.9293 84.3328 61.0828 84.5854C61.2362 84.838 61.338 85.1187 61.382 85.4109C61.4261 85.7032 61.4117 86.0013 61.3395 86.288C61.2037 86.7719 60.9134 87.1981 60.5127 87.5016C60.1121 87.8051 59.6231 87.9691 59.1205 87.9688Z" fill="#B84A4A"/>
<path d="M34.3562 80.6752C34.0606 80.5753 33.7881 80.4169 33.555 80.2094C33.322 80.002 33.133 79.7497 32.9996 79.4676C29.6086 72.1371 28.7313 64.9317 30.2422 56.8096L30.2562 56.7684C31.3695 51.4298 34.7607 44.4891 40.9788 41.0395C45.5682 38.4944 50.896 38.2198 56.7866 40.2242C63.7532 42.5947 68.1257 47.6967 69.4593 54.9717C70.4249 60.2559 69.4101 64.8488 69.3611 65.0349C69.2917 65.3238 69.166 65.5963 68.9912 65.8366C68.8164 66.0769 68.596 66.2804 68.3424 66.4354C68.0889 66.5904 67.8072 66.6939 67.5136 66.7399C67.22 66.7859 66.9203 66.7735 66.6314 66.7035C66.0452 66.5724 65.534 66.2161 65.2082 65.7115C64.8825 65.2068 64.7682 64.5943 64.8901 64.0061C65.4198 61.2233 65.4329 58.3669 64.9288 55.5794C63.8715 50.0106 60.6536 46.2676 55.3293 44.4559C50.7304 42.891 46.6612 43.0506 43.256 44.9407C38.3473 47.6654 35.5927 53.4987 34.7165 57.6795C33.3712 64.8587 34.1487 71.1986 37.1374 77.6447C37.2626 77.9123 37.3328 78.2024 37.3437 78.4976C37.3546 78.7929 37.306 79.0873 37.2008 79.3634C37.0956 79.6396 36.936 79.8917 36.7314 80.1049C36.5268 80.3181 36.2815 80.4879 36.01 80.6044C35.4863 80.831 34.8973 80.8562 34.3562 80.6752Z" fill="#B84A4A"/>
<path d="M66.9184 80.499C62.0455 80.499 57.9028 79.1496 54.5877 76.4673C47.9276 71.1011 47.181 62.3614 47.148 61.9925C47.101 61.3871 47.2966 60.7879 47.6915 60.3266C48.0864 59.8653 48.6484 59.5798 49.2538 59.5329C49.8592 59.4859 50.4585 59.6814 50.9198 60.0764C51.3811 60.4713 51.6666 61.0333 51.7135 61.6387C51.73 61.7677 52.3957 68.9165 57.5295 73.0338C60.5672 75.4597 64.6274 76.4223 69.6307 75.86C70.2287 75.7875 70.8311 75.9547 71.3062 76.325C71.7813 76.6953 72.0905 77.2386 72.1661 77.8362C72.1989 78.1314 72.1725 78.4302 72.0885 78.7151C72.0046 79 71.8648 79.2653 71.6772 79.4956C71.4896 79.7259 71.258 79.9165 70.996 80.0563C70.734 80.1962 70.4467 80.2825 70.151 80.3101C69.078 80.4353 67.9987 80.4984 66.9184 80.499ZM70.7687 20.9164C68.8675 19.6794 62.1265 16 49.451 16C36.1457 16 29.3882 20.0647 27.8933 21.0978C27.7946 21.1584 27.7022 21.2287 27.6174 21.3077C27.6085 21.3163 27.5969 21.3216 27.5845 21.3227C27.3457 21.5311 27.1542 21.788 27.0226 22.0763C26.891 22.3646 26.8224 22.6776 26.8213 22.9945C26.8254 23.2915 26.8881 23.5848 27.0057 23.8576C27.1234 24.1304 27.2937 24.3773 27.507 24.5841C27.7202 24.791 27.9722 24.9537 28.2484 25.063C28.5247 25.1723 28.8198 25.226 29.1168 25.221C29.5929 25.2207 30.0575 25.0747 30.4482 24.8027C30.5127 24.7547 36.3287 20.4816 49.4555 20.4816C62.5823 20.4816 68.4297 24.7397 68.4927 24.7712C68.8919 25.0672 69.3767 25.2251 69.8736 25.221C70.1709 25.2256 70.4662 25.1714 70.7424 25.0615C71.0187 24.9517 71.2706 24.7884 71.4836 24.5809C71.6966 24.3735 71.8665 24.126 71.9837 23.8528C72.1008 23.5795 72.1628 23.2858 72.1661 22.9885C72.1662 22.5431 72.0333 22.1079 71.7843 21.7387C71.5353 21.3695 71.1816 21.0831 70.7687 20.9164Z" fill="#B84A4A"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 5.8 KiB

View File

@@ -0,0 +1,6 @@
<svg width="75" height="75" viewBox="0 0 75 75" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.26329 29.5699C8.86833 29.5734 8.47946 29.4724 8.13612 29.2771C7.88432 29.1356 7.66326 28.9453 7.4859 28.7173C7.30854 28.4893 7.17843 28.2282 7.10319 27.9493C7.02795 27.6704 7.00908 27.3793 7.0477 27.093C7.08631 26.8068 7.18163 26.5311 7.32807 26.2821C10.1504 21.5714 18.7374 10.5764 37.4748 10.5764C45.5948 10.5764 52.7164 12.7092 58.6319 16.9134C63.5007 20.3637 66.2293 24.2693 67.5292 26.1503C67.6941 26.3874 67.8098 26.6551 67.8697 26.9376C67.9295 27.2202 67.9323 27.5118 67.8777 27.7954C67.8231 28.079 67.7124 28.3488 67.552 28.5889C67.3916 28.8291 67.1847 29.0347 66.9437 29.1937C66.451 29.5194 65.8508 29.6404 65.2704 29.5311C64.6899 29.4218 64.1749 29.0908 63.8344 28.6081C61.482 25.2252 54.3091 14.9313 37.4748 14.9313C21.043 14.9313 13.6139 24.404 11.1941 28.4662C10.9997 28.8054 10.7182 29.0865 10.3788 29.2806C10.0393 29.4746 9.65425 29.5745 9.26329 29.5699Z" fill="#2B6B5A"/>
<path d="M46.9152 72.6073C46.7284 72.6096 46.542 72.5884 46.3604 72.5444C32.7685 69.1775 27.6933 55.59 27.4869 55.0249L27.4547 54.9005C27.3434 54.5082 24.6162 45.1907 28.8029 39.7335C30.722 37.2449 33.6409 35.9684 37.4953 35.9684C41.0788 35.9684 43.664 37.0824 45.4411 39.388C46.9049 41.2705 47.4905 43.5922 48.057 45.829C49.2471 50.487 50.1064 52.9331 55.0528 53.1849C57.2251 53.2947 58.6524 52.024 59.4619 50.9422C61.6504 47.9926 62.031 43.1838 60.3812 38.9386C58.2615 33.4594 50.7388 23.1289 37.4748 23.1289C31.8126 23.1289 26.61 24.9485 22.438 28.3681C18.9848 31.2007 16.2488 35.1999 14.9314 39.3104C12.4882 46.9635 15.6926 58.9935 15.7233 59.1032C15.7981 59.3832 15.8161 59.6754 15.7763 59.9624C15.7364 60.2495 15.6394 60.5256 15.4911 60.7746C15.3428 61.0236 15.1462 61.2404 14.9128 61.4121C14.6794 61.5839 14.4139 61.7072 14.1321 61.7748C13.5628 61.9262 12.9568 61.8485 12.444 61.5585C11.9312 61.2684 11.5524 60.7891 11.3888 60.2231C11.2424 59.6741 7.81995 46.8434 10.6423 37.9988C13.7164 28.4149 23.2036 18.7535 37.4792 18.7535C44.0768 18.7535 50.3099 20.9961 55.5124 25.231C59.541 28.5247 62.8317 32.9485 64.5532 37.3708C66.7417 43.0169 66.1547 49.354 63.0615 53.4937C61.0004 56.2546 58.0654 57.6979 54.8142 57.5413C46.3443 57.1168 44.8219 51.2043 43.7123 46.8917C42.5705 42.468 41.84 40.3351 37.4792 40.3351C35.0843 40.3351 33.4023 40.9939 32.3557 42.3582C30.9284 44.2246 30.8172 47.1421 30.9752 49.2588C31.079 50.7336 31.3291 52.1944 31.7218 53.6196C32.0702 54.4979 36.6067 65.6233 47.4715 68.3153C47.7523 68.3818 48.0171 68.5035 48.2505 68.6732C48.4839 68.843 48.6812 69.0574 48.831 69.3041C48.9808 69.5507 49.0802 69.8247 49.1232 70.11C49.1662 70.3954 49.1521 70.6865 49.0817 70.9663C48.9491 71.4388 48.6656 71.8549 48.2744 72.1512C47.8833 72.4475 47.4059 72.6077 46.9152 72.6073Z" fill="#2B6B5A"/>
<path d="M29.4689 71.6031C29.1643 71.6037 28.8626 71.543 28.5819 71.4246C28.3013 71.3061 28.0473 71.1323 27.8353 70.9136C22.3956 65.2046 19.3185 58.8207 18.1606 50.8383V50.7958C17.5107 45.5113 18.4622 38.0295 23.1246 32.8855C26.5661 29.0898 31.4041 27.1604 37.4791 27.1604C44.6638 27.1604 50.3099 30.5009 53.8304 36.8058C56.3849 41.3862 56.8914 45.9505 56.9045 46.1378C56.9313 46.4267 56.9008 46.7181 56.8149 46.9952C56.7289 47.2723 56.5891 47.5297 56.4035 47.7527C56.2179 47.9757 55.9901 48.1599 55.7332 48.2948C55.4763 48.4296 55.1953 48.5125 54.9064 48.5386C54.3233 48.6018 53.7388 48.4333 53.2789 48.0693C52.8191 47.7053 52.5208 47.1751 52.4486 46.5931C52.063 43.8545 51.1767 41.2101 49.8341 38.7922C47.1055 33.9776 42.954 31.53 37.463 31.53C32.7201 31.53 29.0093 32.9573 26.4563 35.7752C22.7762 39.8374 22.0647 46.0954 22.5698 50.2352C23.5842 57.2939 26.2967 62.9093 31.0865 67.9274C31.2864 68.1353 31.4424 68.3814 31.5454 68.6508C31.6483 68.9203 31.696 69.2078 31.6856 69.496C31.6752 69.7843 31.607 70.0676 31.485 70.3289C31.3629 70.5903 31.1896 70.8245 30.9752 71.0176C30.5625 71.3917 30.026 71.6002 29.4689 71.6031Z" fill="#2B6B5A"/>
<path d="M54.5287 65.3144C49.7711 65.3144 45.7265 63.9969 42.4899 61.3781C35.9875 56.1389 35.2585 47.6061 35.2263 47.246C35.1804 46.6549 35.3713 46.0698 35.7569 45.6194C36.1425 45.1691 36.6911 44.8903 37.2822 44.8445C37.8733 44.7987 38.4584 44.9896 38.9088 45.3752C39.3591 45.7607 39.6379 46.3094 39.6837 46.9005C39.6998 47.0264 40.3498 54.0061 45.362 58.0258C48.3278 60.3944 52.2919 61.3341 57.1768 60.7852C57.7606 60.7144 58.3487 60.8776 58.8126 61.2391C59.2764 61.6007 59.5783 62.1311 59.6522 62.7146C59.6841 63.0028 59.6584 63.2945 59.5764 63.5726C59.4945 63.8508 59.3579 64.1099 59.1748 64.3347C58.9917 64.5595 58.7656 64.7456 58.5098 64.8822C58.2539 65.0187 57.9735 65.1029 57.6847 65.1299C56.6372 65.2522 55.5834 65.3137 54.5287 65.3144ZM58.2879 7.14215C56.4317 5.93447 49.8502 2.34216 37.4747 2.34216C24.4845 2.34216 17.8869 6.31068 16.4274 7.31928C16.331 7.37845 16.2408 7.44711 16.158 7.52422C16.1493 7.53266 16.1379 7.53783 16.1258 7.53886C15.8928 7.74234 15.7058 7.99317 15.5773 8.27462C15.4488 8.55607 15.3818 8.86167 15.3807 9.17106C15.3847 9.46107 15.4459 9.74745 15.5608 10.0138C15.6757 10.2801 15.842 10.5211 16.0502 10.7231C16.2584 10.925 16.5044 11.0839 16.7741 11.1906C17.0438 11.2973 17.3319 11.3497 17.6219 11.3449C18.0867 11.3446 18.5403 11.2021 18.9218 10.9365C18.9848 10.8896 24.6631 6.71763 37.4791 6.71763C50.2952 6.71763 56.0042 10.875 56.0657 10.9057C56.4555 11.1947 56.9287 11.3489 57.4139 11.3449C57.7042 11.3493 57.9925 11.2964 58.2622 11.1892C58.5319 11.0819 58.7779 10.9225 58.9858 10.72C59.1938 10.5174 59.3597 10.2758 59.474 10.009C59.5884 9.74223 59.6489 9.45546 59.6522 9.1652C59.6523 8.73042 59.5225 8.30552 59.2794 7.94504C59.0363 7.58457 58.691 7.30498 58.2879 7.14215Z" fill="#2B6B5A"/>
</svg>

After

Width:  |  Height:  |  Size: 5.6 KiB

11
assets/images/tick.svg Normal file
View File

@@ -0,0 +1,11 @@
<svg width="118" height="118" viewBox="0 0 118 118" fill="none" xmlns="http://www.w3.org/2000/svg">
<mask id="mask0_250_2219" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="34" y="28" width="62" height="56">
<path d="M87.4966 28.851L95.4026 34.397L61.1236 83.839H53.2176L34.1016 57.053L42.0076 49.678L57.1706 63.838L87.4966 28.851Z" fill="black"/>
</mask>
<g mask="url(#mask0_250_2219)">
<path d="M29.0923 47.3968C28.6259 47.4009 28.1668 47.2817 27.7614 47.0511C27.464 46.884 27.203 46.6592 26.9936 46.39C26.7842 46.1208 26.6305 45.8125 26.5417 45.4832C26.4528 45.1539 26.4306 44.8101 26.4761 44.4721C26.5217 44.1341 26.6343 43.8085 26.8072 43.5145C30.1398 37.9522 40.2793 24.9693 62.4043 24.9693C71.9923 24.9693 80.4016 27.4877 87.3865 32.452C93.1355 36.5262 96.3575 41.1378 97.8924 43.359C98.0871 43.6389 98.2238 43.955 98.2945 44.2886C98.3651 44.6222 98.3684 44.9666 98.3039 45.3015C98.2395 45.6363 98.1087 45.9549 97.9193 46.2385C97.7299 46.522 97.4857 46.7648 97.201 46.9526C96.6192 47.3371 95.9106 47.48 95.2252 47.351C94.5398 47.2219 93.9317 46.831 93.5296 46.2612C90.7519 42.2666 82.2822 30.1116 62.4043 30.1116C43.0017 30.1116 34.2295 41.2969 31.3722 46.0935C31.1427 46.494 30.8103 46.826 30.4095 47.0551C30.0087 47.2843 29.554 47.4022 29.0923 47.3968Z" fill="#2B6B5A"/>
<path d="M73.5512 98.2151C73.3306 98.2178 73.1105 98.1928 72.8961 98.1408C56.8469 94.1652 50.8541 78.1211 50.6104 77.4539L50.5723 77.307C50.441 76.8438 47.2207 65.8417 52.1643 59.3978C54.4304 56.4594 57.877 54.9521 62.4282 54.9521C66.6596 54.9521 69.7122 56.2675 71.8106 58.9899C73.5391 61.2128 74.2305 63.9542 74.8995 66.5954C76.3048 72.0955 77.3194 74.9839 83.16 75.2812C85.7252 75.4108 87.4105 73.9105 88.3663 72.6331C90.9505 69.1501 91.3999 63.472 89.4518 58.4593C86.949 51.9894 78.0661 39.7913 62.404 39.7913C55.7181 39.7913 49.575 41.9398 44.6487 45.9776C40.5711 49.3223 37.3406 54.0446 35.7849 58.8983C32.9 67.935 36.6837 82.1399 36.72 82.2696C36.8084 82.6002 36.8296 82.9451 36.7825 83.2841C36.7354 83.623 36.621 83.9491 36.4459 84.2431C36.2707 84.5371 36.0385 84.7931 35.7629 84.9959C35.4873 85.1987 35.1739 85.3443 34.8411 85.4241C34.1688 85.6029 33.4533 85.5112 32.8478 85.1687C32.2423 84.8262 31.795 84.2602 31.6019 83.5919C31.429 82.9437 27.3878 67.7932 30.7203 57.3495C34.3502 46.033 45.5527 34.6248 62.4092 34.6248C70.1996 34.6248 77.5597 37.2728 83.7028 42.2734C88.4597 46.1626 92.3454 51.3862 94.3781 56.608C96.9622 63.2749 96.2691 70.7576 92.6168 75.6459C90.183 78.9059 86.7173 80.6102 82.8783 80.4252C72.8771 79.924 71.0794 72.9425 69.7692 67.8503C68.421 62.6267 67.5585 60.1083 62.4092 60.1083C59.5814 60.1083 57.5953 60.8861 56.3594 62.4971C54.6741 64.7009 54.5427 68.1459 54.7294 70.6453C54.8519 72.3867 55.1472 74.1116 55.611 75.7945C56.0223 76.8317 61.379 89.9684 74.2081 93.1471C74.5397 93.2257 74.8523 93.3693 75.1279 93.5698C75.4035 93.7702 75.6365 94.0234 75.8134 94.3146C75.9903 94.6059 76.1076 94.9294 76.1584 95.2663C76.2092 95.6033 76.1926 95.947 76.1094 96.2775C75.9529 96.8353 75.6181 97.3267 75.1562 97.6765C74.6943 98.0264 74.1307 98.2155 73.5512 98.2151Z" fill="#2B6B5A"/>
<path d="M52.9507 97.0294C52.591 97.0301 52.2348 96.9584 51.9034 96.8186C51.572 96.6787 51.2721 96.4735 51.0217 96.2152C44.5985 89.474 40.9652 81.936 39.5979 72.5104V72.4603C38.8305 66.2203 39.954 57.3859 45.4593 51.3119C49.5231 46.8298 55.2358 44.5516 62.4092 44.5516C70.8927 44.5516 77.5596 48.4961 81.7167 55.9408C84.7329 61.3494 85.331 66.7389 85.3466 66.9601C85.3782 67.3012 85.3422 67.6453 85.2407 67.9725C85.1392 68.2997 84.9741 68.6036 84.7549 68.867C84.5358 69.1303 84.2668 69.3478 83.9635 69.507C83.6601 69.6662 83.3283 69.7641 82.9871 69.7949C82.2987 69.8696 81.6085 69.6706 81.0655 69.2408C80.5225 68.811 80.1703 68.1849 80.085 67.4977C79.6297 64.2639 78.5832 61.1415 76.9978 58.2864C73.7759 52.6013 68.8738 49.7113 62.3902 49.7113C56.7898 49.7113 52.408 51.3966 49.3934 54.724C45.048 59.5206 44.2079 66.91 44.8042 71.7982C46.0021 80.1331 49.205 86.7637 54.8607 92.6891C55.0968 92.9346 55.2811 93.2252 55.4026 93.5434C55.5241 93.8616 55.5804 94.201 55.5682 94.5414C55.5559 94.8818 55.4753 95.2162 55.3313 95.5249C55.1872 95.8335 54.9825 96.11 54.7294 96.338C54.242 96.7798 53.6086 97.026 52.9507 97.0294Z" fill="#2B6B5A"/>
<path d="M82.5411 89.6037C76.9234 89.6037 72.1476 88.048 68.3258 84.9557C60.6477 78.7693 59.7869 68.6938 59.7489 68.2686C59.6948 67.5707 59.9202 66.8798 60.3755 66.348C60.8308 65.8162 61.4787 65.4871 62.1766 65.433C62.8746 65.3789 63.5654 65.6043 64.0972 66.0596C64.629 66.5148 64.9581 67.1627 65.0122 67.8607C65.0313 68.0093 65.7987 76.2509 71.7172 80.9974C75.2191 83.7941 79.8999 84.9038 85.668 84.2557C86.3574 84.172 87.0518 84.3647 87.5995 84.7916C88.1473 85.2185 88.5037 85.8449 88.5909 86.5338C88.6287 86.8742 88.5983 87.2186 88.5015 87.5471C88.4047 87.8755 88.2435 88.1814 88.0273 88.4469C87.811 88.7124 87.5441 88.9321 87.242 89.0933C86.9399 89.2546 86.6087 89.354 86.2678 89.3859C85.0308 89.5302 83.7865 89.6029 82.5411 89.6037ZM86.9799 20.9142C84.7882 19.4882 77.0168 15.2464 62.4039 15.2464C47.0651 15.2464 39.2746 19.9324 37.5513 21.1234C37.4375 21.1932 37.331 21.2743 37.2333 21.3653C37.223 21.3753 37.2095 21.3814 37.1952 21.3826C36.9201 21.6229 36.6992 21.9191 36.5475 22.2514C36.3958 22.5837 36.3167 22.9446 36.3154 23.3099C36.3202 23.6524 36.3924 23.9905 36.5281 24.305C36.6637 24.6195 36.8601 24.9041 37.1059 25.1425C37.3517 25.381 37.6422 25.5686 37.9607 25.6946C38.2792 25.8206 38.6194 25.8825 38.9618 25.8768C39.5106 25.8764 40.0463 25.7081 40.4967 25.3945C40.571 25.3392 47.2759 20.4129 62.4091 20.4129C77.5423 20.4129 84.2835 25.3219 84.3561 25.3582C84.8163 25.6995 85.3751 25.8815 85.948 25.8768C86.2907 25.882 86.6311 25.8195 86.9496 25.6929C87.2682 25.5663 87.5585 25.378 87.8041 25.1389C88.0496 24.8997 88.2456 24.6145 88.3806 24.2994C88.5156 23.9844 88.5871 23.6458 88.5909 23.303C88.5911 22.7896 88.4378 22.2879 88.1507 21.8623C87.8637 21.4366 87.456 21.1065 86.9799 20.9142Z" fill="#2B6B5A"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 5.8 KiB

View File

@@ -1,5 +1,6 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import '../widgets/login_animation_screen.dart'; // Import the LoginAnimationScreen
class AttendanceScreen extends StatelessWidget {
const AttendanceScreen({super.key});
@@ -88,10 +89,6 @@ class AttendanceScreen extends StatelessWidget {
top: 70,
left: 24,
child: _ShadowedCard(
child: _FingerButton(
icon: "assets/images/login.svg",
label: "تسجيل الدخول",
),
shadow: const [
// Strong BLACK shadow bottom-right
BoxShadow(
@@ -101,6 +98,21 @@ class AttendanceScreen extends StatelessWidget {
offset: Offset(5, 5),
),
],
child: _FingerButton(
icon: "assets/images/login.svg",
label: "تسجيل الدخول",
onTap: () {
// Navigate to LoginAnimationScreen with success state
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => LoginAnimationScreen(
isLogin: true,
isSuccess: true, // Set to true for success, false for error
),
),
);
},
),
),
),
@@ -109,12 +121,6 @@ class AttendanceScreen extends StatelessWidget {
bottom: 10,
right: 24,
child: _ShadowedCard(
child: _FingerButton(
icon: "assets/images/logout.svg",
label: "تسجيل خروج",
),
// GREEN glow top-left
shadow: const [
// Strong BLACK shadow bottom-right
BoxShadow(
@@ -137,6 +143,21 @@ class AttendanceScreen extends StatelessWidget {
offset: Offset(5, 5),
),
],
child: _FingerButton(
icon: "assets/images/logout.svg",
label: "تسجيل خروج",
onTap: () {
// Navigate to LoginAnimationScreen with success state
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => LoginAnimationScreen(
isLogin: false,
isSuccess: true, // Set to true for success, false for error
),
),
);
},
),
),
),
],
@@ -176,33 +197,41 @@ class _ShadowedCard extends StatelessWidget {
class _FingerButton extends StatelessWidget {
final String icon;
final String label;
final VoidCallback onTap; // Added onTap callback
const _FingerButton({required this.icon, required this.label});
const _FingerButton({
required this.icon,
required this.label,
required this.onTap, // Added this parameter
});
@override
Widget build(BuildContext context) {
return Container(
height: 160,
width: 160,
decoration: BoxDecoration(
color: const Color(0xFFEAFBF3),
borderRadius: BorderRadius.circular(32),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SvgPicture.asset(icon, width: 62, height: 62),
const SizedBox(height: 10),
Text(
label,
style: const TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
color: Colors.black,
return GestureDetector(
onTap: onTap, // Added gesture detection
child: Container(
height: 160,
width: 160,
decoration: BoxDecoration(
color: const Color(0xFFEAFBF3),
borderRadius: BorderRadius.circular(32),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SvgPicture.asset(icon, width: 62, height: 62),
const SizedBox(height: 10),
Text(
label,
style: const TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
color: Colors.black,
),
),
),
],
],
),
),
);
}
}
}

View File

@@ -0,0 +1,354 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import '../widgets/app_background.dart';
class LoginAnimationScreen extends StatefulWidget {
final bool isLogin;
final bool isSuccess;
const LoginAnimationScreen({
super.key,
required this.isLogin,
required this.isSuccess,
});
@override
State<LoginAnimationScreen> createState() => _LoginAnimationScreenState();
}
class _LoginAnimationScreenState extends State<LoginAnimationScreen>
with TickerProviderStateMixin {
late AnimationController ringController;
late AnimationController progressController;
late Animation<double> ringAnimation;
late Animation<double> progressAnimation;
bool showResult = false;
@override
void initState() {
super.initState();
ringController = AnimationController(
vsync: this,
duration: const Duration(seconds: 1),
);
progressController = AnimationController(
vsync: this,
duration: const Duration(seconds: 2),
);
ringAnimation = Tween<double>(
begin: 0.0,
end: 1.0,
).animate(CurvedAnimation(parent: ringController, curve: Curves.easeOut));
progressAnimation = Tween<double>(begin: 0.0, end: 1.0).animate(
CurvedAnimation(parent: progressController, curve: Curves.linear),
);
startAnimations();
Future.delayed(const Duration(seconds: 2), () {
if (mounted) {
setState(() {
showResult = true;
});
ringController.stop();
progressController.stop();
if (widget.isSuccess) {
Future.delayed(const Duration(seconds: 2), () {
if (mounted) Navigator.of(context).pop();
});
}
}
});
}
void startAnimations() {
progressController.repeat();
startPulseAnimation();
}
void startPulseAnimation() {
ringController.forward().then((_) {
ringController.reset();
if (!showResult) startPulseAnimation();
});
}
@override
void dispose() {
ringController.dispose();
progressController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: AppBackground(
child: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text(
widget.isLogin ? "تسجيل الدخول" : "تسجيل خروج",
style: const TextStyle(
color: Colors.white,
fontSize: 30,
fontWeight: FontWeight.bold,
decoration: TextDecoration.none,
),
),
const SizedBox(height: 100),
Container(
width: 280,
height: 400,
decoration: BoxDecoration(
color: const Color(0xFFEEFFFA),
borderRadius: BorderRadius.circular(38),
boxShadow: [
BoxShadow(
color: const Color(0x34000000),
blurRadius: 20,
offset: const Offset(0, 10),
),
],
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SizedBox(
width: 160,
height: 160,
child: Stack(
alignment: Alignment.center,
children: [
Container(
width: 120,
height: 120,
decoration: const BoxDecoration(
color: Color(0xFFE5E5E5),
shape: BoxShape.circle,
),
),
AnimatedSwitcher(
duration: const Duration(milliseconds: 500),
child: _buildIcon(
showResult,
widget.isSuccess,
key: ValueKey(
"icon_${showResult}_${widget.isSuccess}",
),
),
),
if (!showResult)
Positioned.fill(
child: AnimatedBuilder(
animation: progressAnimation,
builder: (_, __) {
return CustomPaint(
painter: _ProgressRingPainter(
progress: progressAnimation.value,
),
);
},
),
),
if (!showResult)
Positioned.fill(
child: AnimatedBuilder(
animation: ringAnimation,
builder: (_, __) {
return CustomPaint(
painter: _PulseRingsPainter(
progress: ringAnimation.value,
),
);
},
),
),
],
),
),
const SizedBox(height: 40),
AnimatedSwitcher(
duration: const Duration(milliseconds: 500),
child:
showResult
? Text(
widget.isSuccess
? "تم تسجيل دخولك بنجاح"
: "تم رفض تسجيل الدخول ",
key: ValueKey("text_${widget.isSuccess}"),
style: const TextStyle(
fontSize: 17,
fontWeight: FontWeight.w600,
decoration: TextDecoration.none,
),
)
: const Text(
"يتم تسجيل الدخول ...",
key: ValueKey("loading_text"),
style: TextStyle(
fontSize: 16,
decoration: TextDecoration.none,
),
),
),
],
),
),
],
),
),
),
);
}
/// >>> FIXED ICON BUILDER <<<
Widget _buildIcon(bool showResult, bool isSuccess, {required Key key}) {
if (showResult) {
if (isSuccess) {
return SizedBox(
key: key,
width: 70,
height: 70,
child: SvgPicture.asset(
"assets/images/tick.svg",
width: 70,
height: 70,
placeholderBuilder:
(context) => Icon(
Icons.check_circle,
size: 70,
color: const Color(0xFF32C59A),
),
),
);
} else {
return SizedBox(
key: key,
width: 70,
height: 70,
child: SvgPicture.asset(
"assets/images/error.svg",
width: 70,
height: 70,
placeholderBuilder:
(context) => Icon(Icons.error, size: 70, color: Colors.red),
),
);
}
}
return SizedBox(
key: key,
width: 70,
height: 70,
child: SvgPicture.asset(
"assets/images/finger_print.svg",
width: 70,
height: 70,
placeholderBuilder:
(context) => Icon(
Icons.fingerprint,
size: 70,
color: const Color(0xFF102D25),
),
),
);
}
}
class _ProgressRingPainter extends CustomPainter {
final double progress;
_ProgressRingPainter({required this.progress});
@override
void paint(Canvas canvas, Size size) {
final center = size.center(Offset.zero);
// radius slightly bigger than gray circle (60)
final radius = 50.0;
// background circle (very subtle)
final bgPaint =
Paint()
..color = const Color(0x0032C599)
..style = PaintingStyle.stroke
..strokeWidth = 3.0;
canvas.drawCircle(center, radius, bgPaint);
// foreground arc that animates
final progressPaint =
Paint()
..color = const Color(0xC40A4433)
..style = PaintingStyle.stroke
..strokeWidth = 3.0
..strokeCap = StrokeCap.round;
const startAngle = -1.5708; // -90° in radians
final sweepAngle = 2 * 3.1415926 * progress;
canvas.drawArc(
Rect.fromCircle(center: center, radius: radius),
startAngle,
sweepAngle,
false,
progressPaint,
);
}
@override
bool shouldRepaint(_ProgressRingPainter oldDelegate) =>
oldDelegate.progress != progress;
}
class _PulseRingsPainter extends CustomPainter {
final double progress;
_PulseRingsPainter({required this.progress});
@override
void paint(Canvas canvas, Size size) {
final center = size.center(Offset.zero);
final baseRadius = 60.0; // start at grey circle
final maxRadius = 130.0; // outermost ripple
final ringPhases = [0.0, 0.25, 0.5];
for (final phase in ringPhases) {
final ringProgress = (progress - phase).clamp(0.0, 1.0);
if (ringProgress > 0) {
final radius = baseRadius + (maxRadius - baseRadius) * ringProgress;
final opacity = (1.0 - ringProgress) * 0.45;
final paint =
Paint()
..color = const Color(0xFF32C59A).withOpacity(opacity)
..style = PaintingStyle.stroke
..strokeWidth = 2;
canvas.drawCircle(center, radius, paint);
}
}
}
@override
bool shouldRepaint(_PulseRingsPainter oldDelegate) =>
oldDelegate.progress != progress;
}

View File

@@ -22,6 +22,12 @@ flutter:
uses-material-design: true
assets:
- assets/images/
- assets/images/finger_print.svg
- assets/images/login.svg
- assets/images/logout.svg
- assets/images/tick.svg
- assets/images/error.svg
fonts:
- family: AbdElRady
fonts: