canvas option 팝업 제작 및 로그인 페이지 추가
This commit is contained in:
parent
557479b88c
commit
fe45151e0a
3
public/static/images/canvas/grid_option_arr.svg
Normal file
3
public/static/images/canvas/grid_option_arr.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="16" height="15" viewBox="0 0 16 15" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8.70711 0.292893C8.31658 -0.0976311 7.68342 -0.0976311 7.29289 0.292893L0.928932 6.65685C0.538408 7.04738 0.538408 7.68054 0.928932 8.07107C1.31946 8.46159 1.95262 8.46159 2.34315 8.07107L8 2.41421L13.6569 8.07107C14.0474 8.46159 14.6805 8.46159 15.0711 8.07107C15.4616 7.68054 15.4616 7.04738 15.0711 6.65685L8.70711 0.292893ZM9 15V1H7L7 15H9Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 474 B |
10
public/static/images/main/id_delete.svg
Normal file
10
public/static/images/main/id_delete.svg
Normal file
@ -0,0 +1,10 @@
|
||||
<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="del" clip-path="url(#clip0_2002_5458)">
|
||||
<path id="패스 35" fill-rule="evenodd" clip-rule="evenodd" d="M3.25991e-06 8.5C3.25991e-06 6.81886 0.498519 5.17547 1.43251 3.77766C2.3665 2.37984 3.69402 1.29037 5.24719 0.647027C6.80036 0.00368289 8.50943 -0.164645 10.1583 0.163329C11.8071 0.491303 13.3217 1.30085 14.5104 2.4896C15.6992 3.67834 16.5087 5.1929 16.8367 6.84173C17.1646 8.49057 16.9963 10.1996 16.353 11.7528C15.7096 13.306 14.6202 14.6335 13.2223 15.5675C11.8245 16.5015 10.1811 17 8.5 17C7.38349 17.001 6.27774 16.7818 5.24603 16.355C4.21433 15.9281 3.27691 15.3021 2.48741 14.5126C1.69792 13.7231 1.07185 12.7857 0.645035 11.754C0.218216 10.7223 -0.000974971 9.61651 3.25991e-06 8.5ZM8.5 7.3015L10.7015 5.1L11.9 6.2985L9.6985 8.5L11.9 10.7015L10.7015 11.9L8.5 9.6985L6.2985 11.9L5.1 10.7015L7.3015 8.5L5.1 6.2985L6.2985 5.1L8.5 7.3015Z" fill="#A8B6C7"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2002_5458">
|
||||
<rect width="17" height="17" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
3
public/static/images/main/login-arr.svg
Normal file
3
public/static/images/main/login-arr.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="6" height="8" viewBox="0 0 6 8" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path id="Vector 4" d="M1.5 6.5L4 4L1.5 1.5" stroke="#898989" stroke-width="1.5"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 182 B |
26
public/static/images/main/login-logo.svg
Normal file
26
public/static/images/main/login-logo.svg
Normal file
@ -0,0 +1,26 @@
|
||||
<svg width="236" height="44" viewBox="0 0 236 44" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="Group">
|
||||
<g id="Group_2">
|
||||
<g id="Group_3">
|
||||
<path id="Vector" d="M17.4212 22.333C16.8099 16.7713 22.6433 12.3114 30.4386 12.3718C38.2415 12.4322 45.0634 16.9902 45.6747 22.5443C46.2859 28.1135 40.4601 32.5658 32.6572 32.5054C24.8543 32.4451 18.0324 27.8946 17.4212 22.333ZM47.1311 24.0535C46.4293 17.1562 38.5736 11.5115 29.5934 11.4361C20.6057 11.3606 13.8971 16.8921 14.6064 23.7894C15.3158 30.6868 23.164 36.339 32.1441 36.4144C41.1242 36.4823 47.8405 30.9584 47.1311 24.0535Z" fill="#FBB584"/>
|
||||
<path id="Vector_2" d="M33.5703 36.5502C29.1481 41.1761 22.047 41.5609 17.7079 37.4105C13.3687 33.26 13.4442 26.1513 17.8739 21.533C22.2961 16.9146 29.4047 16.5298 33.7287 20.6727C38.0603 24.8232 37.9924 31.9318 33.5627 36.5502M17.1796 21.3821C12.0406 26.755 11.9576 35.0183 16.991 39.8404C22.0244 44.6625 30.2876 44.2173 35.4267 38.8443C40.5733 33.4713 40.6563 25.208 35.6153 20.3859C30.5819 15.5638 22.3262 16.0091 17.1796 21.3821Z" fill="#F89B6C"/>
|
||||
<path id="Vector_3" d="M17.6551 4.08603C26.8541 0.637356 35.955 4.12376 37.9774 11.8738C39.9998 19.6315 34.1816 28.7022 24.9826 32.1508C15.7836 35.6071 6.68277 32.1131 4.66036 24.363C2.63794 16.6129 8.45616 7.5347 17.6551 4.08603ZM9.10514 7.04419C-0.440965 14.5981 -2.87088 25.5553 3.67933 31.5019C10.222 37.4559 23.2696 36.1504 32.8157 28.589C42.3618 21.0351 44.7917 10.0854 38.2415 4.13131C31.6913 -1.82275 18.6437 -0.517231 9.10514 7.04419Z" fill="#F37321"/>
|
||||
</g>
|
||||
<g id="Group_4">
|
||||
<path id="Vector_4" d="M69.0608 13.2701V30.3475H66.3894V21.3447H56.2698V30.3475H53.5908V13.2701H56.2698V18.9978H66.3894V13.2701H69.0608Z" fill="white"/>
|
||||
<path id="Vector_5" d="M75.4751 30.3473C74.23 30.3473 73.2263 30.0153 72.5094 29.2984C71.7548 28.6041 71.3926 27.7136 71.3926 26.6043V25.6912C71.3926 24.5744 71.7473 23.6839 72.5094 22.9745C73.2263 22.2576 74.2225 21.903 75.4751 21.903H82.4555V21.835C82.4555 20.4767 81.7009 19.7824 80.2067 19.7824H72.4491V17.511H80.1614C81.7688 17.511 82.9913 17.9336 83.8365 18.7335C84.6817 19.5334 85.1269 20.6729 85.1269 22.1671V26.6949C85.1269 27.857 84.727 28.7701 83.9421 29.4342C83.2252 30.0605 82.2291 30.3473 80.9311 30.3473H75.4676H75.4751ZM80.3576 24.1744H76.1241C74.7432 24.1744 74.0715 24.7555 74.0715 25.9101V26.3326C74.0715 27.4948 74.7432 28.0457 76.1241 28.0457H80.3576C81.7386 28.0457 82.4555 27.4872 82.4555 26.3326V25.9101C82.4555 24.7479 81.7386 24.1744 80.3576 24.1744Z" fill="white"/>
|
||||
<path id="Vector_6" d="M92.9525 17.511H95.5861C97.2388 17.511 98.5518 18.0015 99.5102 18.9599C100.446 19.9409 100.936 21.2766 100.936 22.9972V30.3548H98.2651V23.133C98.2651 22.0614 98.0387 21.2842 97.6387 20.7936C97.1029 20.1673 96.3709 19.8353 95.3899 19.8353H93.1185C92.1601 19.8353 91.4205 20.1673 90.8923 20.7936C90.4923 21.2842 90.3112 22.0614 90.3112 23.133V30.3548H87.6398V22.9972C87.6398 21.2842 88.1077 19.9409 89.0661 18.9599C90.0018 18.0015 91.3149 17.511 92.9675 17.511H92.9525Z" fill="white"/>
|
||||
<path id="Vector_7" d="M113.267 28.6343C112.309 29.7964 111.124 30.3473 109.72 30.3473H108.068C106.574 30.3473 105.396 29.8794 104.521 28.9437C103.676 28.0758 103.276 26.8232 103.276 25.2233V17.511H105.932V25.246C105.932 26.1817 106.136 26.876 106.536 27.2986C106.981 27.7891 107.585 28.0381 108.339 28.0381H109.502C110.256 28.0381 110.86 27.7891 111.328 27.2986C111.728 26.876 111.954 26.1817 111.954 25.246V17.511H114.588V25.246C114.588 26.1817 114.792 26.876 115.191 27.2986C115.637 27.7891 116.24 28.0381 116.995 28.0381H118.157C118.912 28.0381 119.516 27.7891 119.983 27.2986C120.383 26.876 120.61 26.1817 120.61 25.246V17.511H123.266V25.2233C123.266 26.8307 122.821 28.0758 121.976 28.9437C121.085 29.8794 119.9 30.3473 118.406 30.3473H116.776C115.395 30.3473 114.21 29.7889 113.275 28.6343H113.267Z" fill="white"/>
|
||||
<path id="Vector_8" d="M131.099 19.8276C130.141 19.8276 129.401 20.1597 128.873 20.786C128.473 21.2765 128.292 22.0538 128.292 23.1254V30.3472H125.62V13.2246H128.292V18.2882C129.047 17.775 129.945 17.5109 130.948 17.5109H133.582C135.235 17.5109 136.548 18.0014 137.506 18.9598C138.442 19.9408 138.932 21.2765 138.932 22.9971V30.3548H136.253V23.1329C136.253 22.0614 136.027 21.2841 135.627 20.7936C135.091 20.1672 134.359 19.8352 133.378 19.8352H131.107L131.099 19.8276Z" fill="white"/>
|
||||
<path id="Vector_9" d="M145.211 30.3473C143.966 30.3473 142.962 30.0153 142.245 29.2984C141.491 28.6041 141.128 27.7136 141.128 26.6043V25.6912C141.128 24.5744 141.483 23.6839 142.245 22.9745C142.962 22.2576 143.958 21.903 145.211 21.903H152.191V21.835C152.191 20.4767 151.437 19.7824 149.942 19.7824H142.185V17.511H149.897C151.504 17.511 152.727 17.9336 153.572 18.7335C154.417 19.5334 154.863 20.6729 154.863 22.1671V26.6949C154.863 27.857 154.463 28.7701 153.678 29.4342C152.961 30.0605 151.965 30.3473 150.667 30.3473H145.203H145.211ZM150.093 24.1744H145.86C144.479 24.1744 143.807 24.7555 143.807 25.9101V26.3326C143.807 27.4948 144.479 28.0457 145.86 28.0457H150.093C151.474 28.0457 152.191 27.4872 152.191 26.3326V25.9101C152.191 24.7479 151.474 24.1744 150.093 24.1744Z" fill="white"/>
|
||||
</g>
|
||||
<g id="Group_5">
|
||||
<path id="Vector_10" d="M166.439 30.3548H163.963V28.0155H166.174C167.276 28.0004 168.046 27.6985 168.491 27.1023C168.846 26.6118 169.042 25.827 169.072 24.7403V13.2775H171.796V24.9215C171.796 26.7929 171.351 28.1664 170.461 29.0267C169.57 29.9171 168.227 30.3624 166.446 30.3624L166.439 30.3548Z" fill="white"/>
|
||||
<path id="Vector_11" d="M178.196 30.3547C176.951 30.3547 175.955 30.0076 175.23 29.3058C174.483 28.604 174.113 27.7059 174.113 26.6042V25.6911C174.113 24.5742 174.483 23.6686 175.23 22.9668C175.955 22.2499 176.951 21.8953 178.196 21.8953H185.176V21.8273C185.176 20.4615 184.422 19.7747 182.927 19.7747H175.17V17.5033H182.882C184.489 17.5033 185.712 17.9108 186.565 18.7258C187.425 19.5106 187.855 20.6577 187.855 22.1594V26.6872C187.855 27.8493 187.463 28.7624 186.67 29.434C185.953 30.0453 184.95 30.3472 183.659 30.3472H178.196V30.3547ZM183.078 24.1743H178.837C177.471 24.1743 176.785 24.7553 176.785 25.9175V26.3401C176.785 27.4871 177.471 28.0606 178.837 28.0606H183.078C184.474 28.0606 185.176 27.4871 185.176 26.3401V25.9175C185.176 24.7553 184.474 24.1743 183.078 24.1743Z" fill="white"/>
|
||||
<path id="Vector_12" d="M190.3 22.7481C190.3 21.0653 190.753 19.7824 191.659 18.892C192.564 17.9864 193.809 17.5261 195.402 17.511H198.903C200.495 17.5261 201.74 17.9864 202.654 18.892C203.574 19.7824 204.035 21.0729 204.035 22.7481V25.1328C204.035 26.8005 203.574 28.0758 202.654 28.9663C201.748 29.8719 200.503 30.3322 198.926 30.3473H192.972V34.7619H190.293V22.7406L190.3 22.7481ZM192.979 22.9066V28.0381H198.729C199.665 28.0381 200.367 27.7514 200.827 27.1703C201.182 26.6798 201.363 25.9553 201.363 25.0045V22.9066C201.363 21.9407 201.182 21.2087 200.827 20.7182C200.367 20.122 199.665 19.8277 198.729 19.8277H195.583C194.647 19.8277 193.953 20.122 193.507 20.7182C193.153 21.2087 192.972 21.9407 192.972 22.9066H192.979Z" fill="white"/>
|
||||
<path id="Vector_13" d="M210.306 30.3547C209.06 30.3547 208.064 30.0076 207.34 29.3058C206.593 28.604 206.223 27.7059 206.223 26.6042V25.6911C206.223 24.5742 206.593 23.6686 207.34 22.9668C208.064 22.2499 209.06 21.8953 210.306 21.8953H217.286V21.8273C217.286 20.4615 216.531 19.7747 215.037 19.7747H207.279V17.5033H214.992C216.599 17.5033 217.822 17.9108 218.674 18.7258C219.535 19.5106 219.965 20.6577 219.965 22.1594V26.6872C219.965 27.8493 219.572 28.7624 218.78 29.434C218.063 30.0453 217.059 30.3472 215.769 30.3472H210.306V30.3547ZM215.188 24.1743H210.947C209.581 24.1743 208.894 24.7553 208.894 25.9175V26.3401C208.894 27.4871 209.581 28.0606 210.947 28.0606H215.188C216.584 28.0606 217.286 27.4871 217.286 26.3401V25.9175C217.286 24.7553 216.584 24.1743 215.188 24.1743Z" fill="white"/>
|
||||
<path id="Vector_14" d="M227.79 17.511H230.424C232.092 17.511 233.397 17.994 234.348 18.9599C235.299 19.9258 235.774 21.2691 235.774 22.9972V30.3548H233.103V23.133C233.103 22.0614 232.892 21.2842 232.477 20.7936C231.956 20.1522 231.201 19.8353 230.228 19.8353H227.949C226.998 19.8353 226.258 20.1522 225.723 20.7936C225.338 21.2842 225.142 22.0614 225.142 23.133V30.3548H222.47V22.9972C222.47 21.2766 222.946 19.9258 223.896 18.9599C224.847 17.994 226.145 17.511 227.798 17.511H227.79Z" fill="white"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 8.1 KiB |
BIN
public/static/images/main/login_bg.png
Normal file
BIN
public/static/images/main/login_bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
10
public/static/images/main/login_id.svg
Normal file
10
public/static/images/main/login_id.svg
Normal file
@ -0,0 +1,10 @@
|
||||
<svg width="10" height="13" viewBox="0 0 10 13" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2002_5454)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M10 10.43C10.0131 10.9591 9.84045 11.476 9.51202 11.891C9.37771 12.0778 9.20121 12.2304 8.99688 12.3362C8.79254 12.442 8.56612 12.4981 8.33602 12.5H1.66402C1.43392 12.4981 1.2075 12.442 1.00317 12.3362C0.798831 12.2304 0.622337 12.0778 0.488022 11.891C0.159594 11.476 -0.013072 10.9591 2.21803e-05 10.43C-0.0013962 10.0111 0.0206383 9.59243 0.0660222 9.17599C0.112459 8.77336 0.195127 8.37575 0.313022 7.98799C0.416024 7.62702 0.569902 7.28256 0.770022 6.96499C0.956454 6.67736 1.20788 6.43758 1.50402 6.26499C1.82384 6.08298 2.18714 5.99138 2.55502 5.99999C2.87445 6.32242 3.2556 6.57716 3.67569 6.74897C4.09578 6.92079 4.54619 7.00616 5.00002 6.99999C5.45385 7.00616 5.90427 6.92079 6.32436 6.74897C6.74445 6.57716 7.1256 6.32242 7.44502 5.99999C7.81472 5.99217 8.17953 6.08553 8.50002 6.26999C8.79616 6.44258 9.04759 6.68236 9.23402 6.96999C9.43414 7.28756 9.58802 7.63202 9.69102 7.99299C9.80858 8.38078 9.89091 8.77839 9.93702 9.18099C9.98122 9.59582 10.0023 10.0128 10 10.43ZM8.00002 3.49999C8.00618 3.89482 7.93137 4.28673 7.78018 4.65152C7.629 5.01631 7.40467 5.34626 7.12102 5.62099C6.84629 5.90463 6.51635 6.12897 6.15156 6.28015C5.78676 6.43133 5.39486 6.50615 5.00002 6.49999C4.60519 6.50615 4.21328 6.43133 3.84849 6.28015C3.48369 6.12897 3.15375 5.90463 2.87902 5.62099C2.59538 5.34626 2.37104 5.01631 2.21986 4.65152C2.06868 4.28673 1.99386 3.89482 2.00002 3.49999C1.99386 3.10515 2.06868 2.71325 2.21986 2.34845C2.37104 1.98366 2.59538 1.65371 2.87902 1.37899C3.15375 1.09534 3.48369 0.871005 3.84849 0.719824C4.21328 0.568643 4.60519 0.493824 5.00002 0.499986C5.39486 0.493824 5.78676 0.568643 6.15156 0.719824C6.51635 0.871005 6.84629 1.09534 7.12102 1.37899C7.40467 1.65371 7.629 1.98366 7.78018 2.34845C7.93137 2.71325 8.00618 3.10515 8.00002 3.49999Z" fill="#A8B6C7"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2002_5454">
|
||||
<rect width="10" height="12" fill="white" transform="translate(0 0.5)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
10
public/static/images/main/login_password.svg
Normal file
10
public/static/images/main/login_password.svg
Normal file
@ -0,0 +1,10 @@
|
||||
<svg width="9" height="11" viewBox="0 0 9 11" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_2002_5470)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.49999 5.00004H6.49999V3.50004C6.50407 3.23682 6.45419 2.97555 6.3534 2.73236C6.25261 2.48916 6.10307 2.2692 5.91399 2.08604C5.73082 1.89696 5.51086 1.74741 5.26766 1.64662C5.02447 1.54584 4.76321 1.49595 4.49999 1.50004C4.23677 1.49595 3.9755 1.54584 3.73231 1.64662C3.48911 1.74741 3.26915 1.89696 3.08599 2.08604C2.89691 2.2692 2.74736 2.48916 2.64657 2.73236C2.54579 2.97555 2.4959 3.23682 2.49999 3.50004V5.00004ZM8.99999 5.75004V10.25C9.0017 10.3488 8.98315 10.4469 8.94548 10.5382C8.90781 10.6295 8.85183 10.7122 8.78099 10.781C8.71214 10.8519 8.6295 10.9079 8.53817 10.9455C8.44684 10.9832 8.34876 11.0017 8.24999 11H0.749986C0.651211 11.0017 0.553133 10.9832 0.461805 10.9455C0.370477 10.9079 0.287838 10.8519 0.218986 10.781C0.148142 10.7122 0.0921584 10.6295 0.0544922 10.5382C0.0168259 10.4469 -0.00172429 10.3488 -1.36628e-05 10.25V5.75004C-0.00172429 5.65126 0.0168259 5.55318 0.0544922 5.46186C0.0921584 5.37053 0.148142 5.28789 0.218986 5.21904C0.287838 5.14819 0.370477 5.09221 0.461805 5.05454C0.553133 5.01688 0.651211 4.99833 0.749986 5.00004H0.999986V3.50004C0.994046 3.03989 1.08247 2.58341 1.25979 2.15876C1.43711 1.73412 1.69958 1.35031 2.03099 1.03104C2.35026 0.699627 2.73407 0.437163 3.15871 0.259839C3.58336 0.082516 4.03984 -0.0059038 4.49999 3.65024e-05C4.96013 -0.0059038 5.41661 0.082516 5.84126 0.259839C6.26591 0.437163 6.64971 0.699627 6.96899 1.03104C7.3004 1.35031 7.56286 1.73412 7.74018 2.15876C7.91751 2.58341 8.00593 3.03989 7.99999 3.50004V5.00004H8.24999C8.34876 4.99833 8.44684 5.01688 8.53817 5.05454C8.6295 5.09221 8.71214 5.14819 8.78099 5.21904C8.85183 5.28789 8.90781 5.37053 8.94548 5.46186C8.98315 5.55318 9.0017 5.65126 8.99999 5.75004Z" fill="#A8B6C7"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2002_5470">
|
||||
<rect width="9" height="11" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.0 KiB |
11
public/static/images/main/password_hidden.svg
Normal file
11
public/static/images/main/password_hidden.svg
Normal file
@ -0,0 +1,11 @@
|
||||
<svg width="19" height="13" viewBox="0 0 19 13" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="hidden" clip-path="url(#clip0_2002_5472)">
|
||||
<path id="Mask" d="M9.5 0C7.4493 0.00116877 5.44643 0.619597 3.75206 1.7748C2.0577 2.93 0.750291 4.56848 0 6.477C0.749121 8.38638 2.05622 10.0257 3.75083 11.1812C5.44544 12.3367 7.44892 12.9548 9.5 12.9548C11.5511 12.9548 13.5546 12.3367 15.2492 11.1812C16.9438 10.0257 18.2509 8.38638 19 6.477C18.2497 4.56848 16.9423 2.93 15.2479 1.7748C13.5536 0.619597 11.5507 0.00116877 9.5 0ZM9.5 10.8C8.64598 10.8 7.81114 10.5468 7.10105 10.0723C6.39096 9.59782 5.83751 8.92344 5.51069 8.13443C5.18387 7.34542 5.09836 6.47721 5.26497 5.6396C5.43158 4.80199 5.84283 4.0326 6.44671 3.42871C7.0506 2.82483 7.81999 2.41358 8.6576 2.24697C9.49521 2.08036 10.3634 2.16587 11.1524 2.49269C11.9414 2.81951 12.6158 3.37296 13.0903 4.08305C13.5648 4.79314 13.818 5.62798 13.818 6.482C13.8175 7.62704 13.3624 8.72503 12.5527 9.5347C11.743 10.3444 10.645 10.7995 9.5 10.8ZM9.5 3.891C8.98755 3.891 8.4866 4.04296 8.06052 4.32766C7.63443 4.61237 7.30233 5.01702 7.10623 5.49047C6.91012 5.96391 6.85881 6.48487 6.95879 6.98748C7.05876 7.49008 7.30553 7.95176 7.66789 8.31411C8.03024 8.67647 8.49192 8.92324 8.99452 9.02321C9.49713 9.12319 10.0181 9.07188 10.4915 8.87577C10.965 8.67966 11.3696 8.34757 11.6543 7.92148C11.939 7.49539 12.091 6.99445 12.091 6.482C12.0922 6.14118 12.026 5.80348 11.8963 5.48831C11.7666 5.17314 11.5758 4.88671 11.3351 4.64548C11.0943 4.40424 10.8082 4.21296 10.4933 4.08263C10.1784 3.95229 9.84083 3.88547 9.5 3.886V3.891Z" fill="#A8B6C7"/>
|
||||
<path id="Vector 7178" d="M15 1L3 12.5225" stroke="white" stroke-width="1.5"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2002_5472">
|
||||
<rect width="19" height="12.955" fill="white" transform="translate(0 0.0224609)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
10
public/static/images/main/password_visible.svg
Normal file
10
public/static/images/main/password_visible.svg
Normal file
@ -0,0 +1,10 @@
|
||||
<svg width="19" height="13" viewBox="0 0 19 13" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="show" clip-path="url(#clip0_2253_7108)">
|
||||
<path id="Mask" d="M9.5 0C7.4493 0.00116877 5.44643 0.619597 3.75206 1.7748C2.0577 2.93 0.750291 4.56848 0 6.477C0.749121 8.38638 2.05622 10.0257 3.75083 11.1812C5.44544 12.3367 7.44892 12.9548 9.5 12.9548C11.5511 12.9548 13.5546 12.3367 15.2492 11.1812C16.9438 10.0257 18.2509 8.38638 19 6.477C18.2497 4.56848 16.9423 2.93 15.2479 1.7748C13.5536 0.619597 11.5507 0.00116877 9.5 0ZM9.5 10.8C8.64598 10.8 7.81114 10.5468 7.10105 10.0723C6.39096 9.59782 5.83751 8.92344 5.51069 8.13443C5.18387 7.34542 5.09836 6.47721 5.26497 5.6396C5.43158 4.80199 5.84283 4.0326 6.44671 3.42871C7.0506 2.82483 7.81999 2.41358 8.6576 2.24697C9.49521 2.08036 10.3634 2.16587 11.1524 2.49269C11.9414 2.81951 12.6158 3.37296 13.0903 4.08305C13.5648 4.79314 13.818 5.62798 13.818 6.482C13.8175 7.62704 13.3624 8.72503 12.5527 9.5347C11.743 10.3444 10.645 10.7995 9.5 10.8ZM9.5 3.891C8.98755 3.891 8.4866 4.04296 8.06052 4.32766C7.63443 4.61237 7.30233 5.01702 7.10623 5.49047C6.91012 5.96391 6.85881 6.48487 6.95879 6.98748C7.05876 7.49008 7.30553 7.95176 7.66789 8.31411C8.03024 8.67647 8.49192 8.92324 8.99452 9.02321C9.49713 9.12319 10.0181 9.07188 10.4915 8.87577C10.965 8.67966 11.3696 8.34757 11.6543 7.92148C11.939 7.49539 12.091 6.99445 12.091 6.482C12.0922 6.14118 12.026 5.80348 11.8963 5.48831C11.7666 5.17314 11.5758 4.88671 11.3351 4.64548C11.0943 4.40424 10.8082 4.21296 10.4933 4.08263C10.1784 3.95229 9.84083 3.88547 9.5 3.886V3.891Z" fill="#A8B6C7"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_2253_7108">
|
||||
<rect width="19" height="12.955" fill="white" transform="translate(0 0.0224609)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
@ -2,6 +2,9 @@
|
||||
|
||||
import CanvasLayout from '@/components/canvas/CanvasLayout'
|
||||
import CanvasMenu from '@/components/canvas/CanvasMenu'
|
||||
import GridCopy from '@/components/canvas/modal/gridoption/GridCopy'
|
||||
import GridMove from '@/components/canvas/modal/gridoption/GridMove'
|
||||
import GridOption from '@/components/canvas/modal/gridoption/GridOption'
|
||||
import OuterLineWall from '@/components/canvas/modal/outerlinesetting/OuterLineWall'
|
||||
import SettingModal01 from '@/components/canvas/modal/settoing01/SettingModal01'
|
||||
import Header from '@/components/layout/Header'
|
||||
@ -21,7 +24,10 @@ export default function CanvasPage() {
|
||||
<CanvasLayout/>
|
||||
</div>
|
||||
{modalOption.option && <SettingModal01/>}
|
||||
{modalOption.outerwall && <OuterLineWall/>}
|
||||
{/* {modalOption.outerwall && <OuterLineWall/>} 확인용 숨김처리*/}
|
||||
{modalOption.gridoption && <GridOption/>}
|
||||
{modalOption.gridcopy && <GridCopy/>}
|
||||
{modalOption.gridmove && <GridMove/>}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -186,6 +186,28 @@ export default function InputWrapPage (){
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="input-content pop">
|
||||
<div className="input-wrap">
|
||||
<h1>date-picker-wrap</h1>
|
||||
<div className="form-input">
|
||||
<span>check</span>
|
||||
<div className="flx mb5">
|
||||
<div className="d-check-box pop mr5">
|
||||
<input type="checkbox" id="ch05" />
|
||||
<label htmlFor="ch05">仕様確認</label>
|
||||
</div>
|
||||
<div className="d-check-box pop mr5">
|
||||
<input type="checkbox" id="ch06" />
|
||||
<label htmlFor="ch06">仕様確認</label>
|
||||
</div>
|
||||
<div className="d-check-box pop">
|
||||
<input type="checkbox" id="ch07" />
|
||||
<label htmlFor="ch07">仕様確認</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
50
src/app/login/page.jsx
Normal file
50
src/app/login/page.jsx
Normal file
@ -0,0 +1,50 @@
|
||||
'use client'
|
||||
|
||||
import '@/styles/style.scss'
|
||||
import Image from 'next/image'
|
||||
import Link from 'next/link'
|
||||
import { useState } from 'react'
|
||||
|
||||
export default function LoginPage(){
|
||||
const [passwordVisible, setPasswordVisible] = useState(false);
|
||||
return(
|
||||
<div className="login-wrap">
|
||||
<div className="login-inner">
|
||||
<Link href={'/login'} className="login-logo">
|
||||
<Image src="/static/images/main/login-logo.svg" alt="react" width={236} height={43} />
|
||||
</Link>
|
||||
<div className="login-input-frame">
|
||||
<div className="login-frame-tit">
|
||||
<span>Q.CAST III</span>
|
||||
太陽光発電システム図面管理サイト
|
||||
</div>
|
||||
<div className="login-input-wrap">
|
||||
<div className="login-area id">
|
||||
<input type="text" className='login-input' defaultValue={'IDを入力してください'}/>
|
||||
<button className='id-delete'></button>
|
||||
</div>
|
||||
<div className="login-area password">
|
||||
<input type="password" className='login-input' defaultValue={'asdasdasd'}/>
|
||||
<button className={`password-hidden ${passwordVisible ? 'visible' : ''}`} onClick={() => setPasswordVisible(!passwordVisible)}></button>
|
||||
</div>
|
||||
<div className="d-check-box login">
|
||||
<input type="checkbox" id="ch01" />
|
||||
<label htmlFor="ch01">ID Save</label>
|
||||
</div>
|
||||
<div className='login-btn-box'>
|
||||
<button className='login-btn'>Login</button>
|
||||
</div>
|
||||
<div className="reset-password">
|
||||
<Link href={'#'}>パスワードの初期化</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="login-guide-wrap">
|
||||
<span>※</span>当サイトをご利用の際は、事前申請が必要です。<br/>
|
||||
IDがない方は <Link href={'#'}>ID申請 クリックしてください。</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="login-copyright">COPYRIGHT©2024 Hanwha Japan All Rights Reserved.</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
54
src/components/canvas/modal/gridoption/GridCopy.jsx
Normal file
54
src/components/canvas/modal/gridoption/GridCopy.jsx
Normal file
@ -0,0 +1,54 @@
|
||||
import WithDraggable from "@/components/common/draggable/withDraggable";
|
||||
import { modalState } from "@/store/modalAtom";
|
||||
import { useState } from "react";
|
||||
import { useRecoilState } from "recoil";
|
||||
|
||||
export default function GridCopy() {
|
||||
const [modalOption, setModalOption] = useRecoilState(modalState); //modal 열림닫힘 state
|
||||
const [close, setClose] = useState(false)
|
||||
|
||||
const HandleClickClose = () => {
|
||||
setClose(true)
|
||||
setTimeout(() => {
|
||||
setModalOption({...modalOption, gridcopy: false})
|
||||
setClose(false);
|
||||
}, 180)
|
||||
}
|
||||
|
||||
|
||||
return(
|
||||
<WithDraggable isShow={true}>
|
||||
<div className={`modal-pop-wrap xm ${modalOption.gridcopy ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">グリッドのコピー </h1>
|
||||
<button className="modal-close" onClick={HandleClickClose}>닫기</button>
|
||||
</div>
|
||||
<div className="modal-body">
|
||||
<div className="grid-option-tit">
|
||||
間隔を設定し、コピー方向を選択します
|
||||
</div>
|
||||
<div className="grid-option-wrap">
|
||||
<div className="grid-option-box">
|
||||
<div className="grid-input-form">
|
||||
<span className="mr10">長さ</span>
|
||||
<div className="input-grid mr5">
|
||||
<input type="text" className="input-origin" defaultValue={910}/>
|
||||
</div>
|
||||
<span>mm</span>
|
||||
</div>
|
||||
<div className="grid-direction">
|
||||
<button className="direction up"></button>
|
||||
<button className="direction down act"></button>
|
||||
<button className="direction left"></button>
|
||||
<button className="direction right"></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid-btn-wrap">
|
||||
<button className="btn-frame modal act">保存</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</WithDraggable>
|
||||
)
|
||||
}
|
||||
66
src/components/canvas/modal/gridoption/GridMove.jsx
Normal file
66
src/components/canvas/modal/gridoption/GridMove.jsx
Normal file
@ -0,0 +1,66 @@
|
||||
import WithDraggable from "@/components/common/draggable/withDraggable";
|
||||
import { modalState } from "@/store/modalAtom";
|
||||
import { useState } from "react";
|
||||
import { useRecoilState } from "recoil";
|
||||
|
||||
export default function GridMove() {
|
||||
const [modalOption, setModalOption] = useRecoilState(modalState); //modal 열림닫힘 state
|
||||
const [close, setClose] = useState(false)
|
||||
|
||||
const HandleClickClose = () => {
|
||||
setClose(true)
|
||||
setTimeout(() => {
|
||||
setModalOption({...modalOption, gridmove: false})
|
||||
setClose(false);
|
||||
}, 180)
|
||||
}
|
||||
|
||||
|
||||
return(
|
||||
<WithDraggable isShow={true}>
|
||||
<div className={`modal-pop-wrap xm ${modalOption.gridmove ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">グリッドのコピー </h1>
|
||||
<button className="modal-close" onClick={HandleClickClose}>닫기</button>
|
||||
</div>
|
||||
<div className="modal-body">
|
||||
<div className="grid-option-tit">
|
||||
移動する方向を入力してください
|
||||
</div>
|
||||
<div className="grid-option-wrap">
|
||||
<div className="d-check-box pop mb10">
|
||||
<input type="checkbox" id="ch99" />
|
||||
<label htmlFor="ch99">グリッド全体移動</label>
|
||||
</div>
|
||||
<div className="grid-option-box">
|
||||
<div className="move-form">
|
||||
<p className="mb5">長さ</p>
|
||||
<div className="input-move-wrap mb5">
|
||||
<div className="input-move">
|
||||
<input type="text" className="input-origin" defaultValue={910}/>
|
||||
</div>
|
||||
<span>mm</span>
|
||||
</div>
|
||||
<div className="input-move-wrap">
|
||||
<div className="input-move">
|
||||
<input type="text" className="input-origin" defaultValue={910}/>
|
||||
</div>
|
||||
<span>mm</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="direction-move-wrap">
|
||||
<button className="direction up"></button>
|
||||
<button className="direction down act"></button>
|
||||
<button className="direction left"></button>
|
||||
<button className="direction right"></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid-btn-wrap">
|
||||
<button className="btn-frame modal act">保存</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</WithDraggable>
|
||||
)
|
||||
}
|
||||
88
src/components/canvas/modal/gridoption/GridOption.jsx
Normal file
88
src/components/canvas/modal/gridoption/GridOption.jsx
Normal file
@ -0,0 +1,88 @@
|
||||
import WithDraggable from "@/components/common/draggable/withDraggable";
|
||||
import Qselect from "@/components/common/select/Qselect";
|
||||
import { modalState } from "@/store/modalAtom";
|
||||
import { useState } from "react";
|
||||
import { useRecoilState } from "recoil";
|
||||
|
||||
export default function GridOption() {
|
||||
const [modalOption, setModalOption] = useRecoilState(modalState); //modal 열림닫힘 state
|
||||
const [close, setClose] = useState(false)
|
||||
|
||||
const SelectOption = [
|
||||
{name: 'オンライン保証シ',}, {name: 'ステム'}
|
||||
]
|
||||
|
||||
const HandleClickClose = () => {
|
||||
setClose(true)
|
||||
setTimeout(() => {
|
||||
setModalOption({...modalOption, gridoption: false})
|
||||
setClose(false);
|
||||
}, 180)
|
||||
}
|
||||
|
||||
|
||||
return(
|
||||
<WithDraggable isShow={true}>
|
||||
<div className={`modal-pop-wrap ssm ${modalOption.gridoption ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
|
||||
<div className="modal-head">
|
||||
<h1 className="title">ドット・ライングリッドの設定</h1>
|
||||
<button className="modal-close" onClick={HandleClickClose}>닫기</button>
|
||||
</div>
|
||||
<div className="modal-body">
|
||||
<div className="grid-check-form">
|
||||
<div className="d-check-box pop">
|
||||
<input type="checkbox" id="ch01" />
|
||||
<label htmlFor="ch01">点グリッド表示</label>
|
||||
</div>
|
||||
<div className="d-check-box pop">
|
||||
<input type="checkbox" id="ch02" />
|
||||
<label htmlFor="ch02">ライングリッドの表示</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid-option-wrap">
|
||||
<div className="grid-option-box">
|
||||
<div className="d-check-radio pop no-text">
|
||||
<input type="radio" name="radio01" id="ra01" />
|
||||
<label htmlFor="ra01"></label>
|
||||
</div>
|
||||
<div className="grid-input-form">
|
||||
<span className="mr10">横間隔</span>
|
||||
<div className="input-grid mr5">
|
||||
<input type="text" className="input-origin" defaultValue={910}/>
|
||||
</div>
|
||||
<span>mm</span>
|
||||
</div>
|
||||
<div className="grid-input-form">
|
||||
<span className="mr10">横間隔</span>
|
||||
<div className="input-grid mr5">
|
||||
<input type="text" className="input-origin" defaultValue={910}/>
|
||||
</div>
|
||||
<span>mm</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid-option-box">
|
||||
<div className="d-check-radio pop no-text">
|
||||
<input type="radio" name="radio01" id="ra02" />
|
||||
<label htmlFor="ra02"></label>
|
||||
</div>
|
||||
<div className="grid-input-form">
|
||||
<span className="mr10">横間隔</span>
|
||||
<div className="input-grid mr5">
|
||||
<input type="text" className="input-origin" defaultValue={910}/>
|
||||
</div>
|
||||
<span>mm</span>
|
||||
</div>
|
||||
<div className="grid-select">
|
||||
<Qselect title={'原寸'} option={SelectOption}/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid-btn-wrap">
|
||||
<button className="btn-frame modal mr5">初期化</button>
|
||||
<button className="btn-frame modal act">保存</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</WithDraggable>
|
||||
)
|
||||
}
|
||||
@ -42,8 +42,9 @@ export default function SecondOption (props){
|
||||
<button className="arr-btn">
|
||||
<span>図面サイズの設定</span>
|
||||
</button>
|
||||
<button className="arr-btn">
|
||||
<span>吸着点 ON</span>
|
||||
<button className="adsorption-point act">
|
||||
<span>吸着点</span>
|
||||
<i>ON</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -51,7 +51,7 @@ export default function SettingModal01 (){
|
||||
className={`btn-frame modal ${buttonAct === 2 ? 'act' : ''}`}
|
||||
onClick={() => setButtonAct(2)}
|
||||
>
|
||||
フォント/図面サイズ設定
|
||||
フォントと図面サイズの設定
|
||||
</button>
|
||||
<button
|
||||
className={`btn-frame modal ${buttonAct === 3 ? 'act' : ''}`}
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
const buttonList03 = [
|
||||
{id: 1, name: '任意グリッド'},
|
||||
{id: 2, name: '点·線グリッド'},
|
||||
{id: 3, name: '吸着点追加'},
|
||||
{id: 4, name: 'グリッドカラー設定'},
|
||||
{id: 1, name: 'ランダムグリッド'},
|
||||
{id: 2, name: 'ドット・ライングリッド'},
|
||||
{id: 3, name: '吸着点を追加'},
|
||||
{id: 4, name: 'グリッド色の設定'},
|
||||
]
|
||||
|
||||
export default function ThirdOption(props){
|
||||
@ -13,9 +13,8 @@ export default function ThirdOption(props){
|
||||
<h3 className="check-wrap-title">吸着範囲の設定</h3>
|
||||
<div className="flex-check-box for2">
|
||||
{buttonList03.map((item)=>(
|
||||
<button key={item.id} className="check-btn" onClick={(e) => onClick(e)}>
|
||||
<span className="check-area"></span>
|
||||
<span className="title-area">{item.name}</span>
|
||||
<button className="arr-btn">
|
||||
<span>{item.name}</span>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
|
||||
@ -90,6 +90,13 @@ export default function PublishPage() {
|
||||
<td className="coding_stat_web"></td>
|
||||
<td className="t-center">2024-09-11</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="t-center"><strong>LoginPage</strong></td>
|
||||
<td><strong className="title"></strong></td>
|
||||
<td><Link href="/login" target="_blank">LoginPage</Link></td>
|
||||
<td className="coding_stat_web"></td>
|
||||
<td className="t-center">2024-09-23</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="t-center" rowSpan={2}><strong>물품 및 도면 관리</strong></td>
|
||||
<td><strong className="title"></strong></td>
|
||||
|
||||
@ -5,6 +5,9 @@ export const modalState = atom({
|
||||
default: {
|
||||
option: true,
|
||||
outerwall: true,
|
||||
gridoption: true,
|
||||
gridcopy: true,
|
||||
gridmove: true,
|
||||
},
|
||||
})
|
||||
|
||||
|
||||
@ -40,6 +40,16 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
&.pop{
|
||||
.input-wrap{
|
||||
.form-input{
|
||||
background-color: #272727;
|
||||
span{
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.title{
|
||||
max-width: 1600px;
|
||||
|
||||
@ -358,4 +358,200 @@
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// loginpage
|
||||
.login-wrap{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background: url(../../public/static/images/main/login_bg.png) no-repeat center;
|
||||
background-size: cover;
|
||||
.login-inner{
|
||||
max-width: 500px;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
.login-logo{
|
||||
display: block;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
.login-input-frame{
|
||||
padding: 40px 50px;
|
||||
border-radius: 6px;
|
||||
background: rgba(255, 255, 255, 0.97);
|
||||
box-shadow: 0px 3px 30px 0px rgba(0, 0, 0, 0.02);
|
||||
.login-frame-tit{
|
||||
font-size: 18px;
|
||||
color: #364864;
|
||||
font-weight: 400;
|
||||
padding-bottom: 30px;
|
||||
border-bottom: 1px solid #E5E9EF;
|
||||
span{
|
||||
display: block;
|
||||
font-weight: 600;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
.login-input-wrap{
|
||||
margin-top: 30px;
|
||||
.login-area{
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border: 1px solid #E5E9EF;
|
||||
height: 45px;
|
||||
padding-left: 40px;
|
||||
padding-right: 15px;
|
||||
margin-bottom: 15px;
|
||||
.login-input{
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
color: #D1D7E0;
|
||||
&::placeholder{
|
||||
color: #D1D7E0;
|
||||
}
|
||||
}
|
||||
&::before{
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 15px;
|
||||
transform: translateY(-50%);
|
||||
width: 10px;
|
||||
height: 12px;
|
||||
background-size: cover;
|
||||
}
|
||||
button{
|
||||
width: 20px;
|
||||
height: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
&.id{
|
||||
&::before{
|
||||
background: url(../../public/static/images/main/login_id.svg)no-repeat center;
|
||||
}
|
||||
.id-delete{
|
||||
background-image: url(../../public/static/images/main/id_delete.svg);
|
||||
background-size: 17px 17px;
|
||||
}
|
||||
}
|
||||
&.password{
|
||||
margin-bottom: 20px;
|
||||
&::before{
|
||||
background: url(../../public/static/images/main/login_password.svg)no-repeat center;
|
||||
}
|
||||
.password-hidden{
|
||||
background-image: url(../../public/static/images/main/password_hidden.svg);
|
||||
background-size: 19px 13px;
|
||||
&.visible{
|
||||
background-image: url(../../public/static/images/main/password_visible.svg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.login-btn-box{
|
||||
margin-bottom: 20px;
|
||||
.login-btn{
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 45px;
|
||||
background-color: #5C6773;
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
border-radius: 4px;
|
||||
transition: background .15s ease-in-out;
|
||||
&:hover{
|
||||
background-color: #717e8d;
|
||||
}
|
||||
}
|
||||
}
|
||||
.reset-password{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
a{
|
||||
position: relative;
|
||||
font-size: 13px;
|
||||
color: #364864;
|
||||
font-weight: 400;
|
||||
padding-right: 16px;
|
||||
&::before{
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: calc(50% + 1px);
|
||||
right: 0;
|
||||
transform: translateY(-50%);
|
||||
width: 6px;
|
||||
height: 8px;
|
||||
background: url(../../public/static/images/main/login-arr.svg)no-repeat center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.login-guide-wrap{
|
||||
position: relative;
|
||||
margin-left: 10px;
|
||||
margin-top: 30px;
|
||||
padding-left: 15px;
|
||||
font-size: 13px;
|
||||
color: #fff;
|
||||
line-height: 24px;
|
||||
a{
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
text-decoration: underline;
|
||||
}
|
||||
span{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.login-copyright{
|
||||
position: absolute;
|
||||
bottom: 40px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 11px;
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.d-check-box{
|
||||
&.login{
|
||||
margin-bottom: 25px;
|
||||
label{
|
||||
padding-left: 20px;
|
||||
color: #364864;
|
||||
&:before{
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
top: -1px;
|
||||
border-color: #A8B6C7;
|
||||
border-radius: 3px;
|
||||
transition: background .05s ease-in-out;
|
||||
}
|
||||
}
|
||||
}
|
||||
input[type=checkbox]:checked + label::before{
|
||||
border-color: #A8B6C7;
|
||||
background-color: #A8B6C7;
|
||||
}
|
||||
input[type=checkbox]:checked + label::after{
|
||||
border-color: #fff;
|
||||
width: 7px;
|
||||
height: 11px;
|
||||
top: -2px;
|
||||
left: 1px;
|
||||
}
|
||||
}
|
||||
@ -12,7 +12,7 @@
|
||||
top: 200px;
|
||||
right: 100px;
|
||||
width: 100%;
|
||||
min-width: 380px;
|
||||
min-width: 300px;
|
||||
max-width: fit-content;
|
||||
height: -webkit-fit-content;
|
||||
height: -moz-fit-content;
|
||||
@ -22,11 +22,14 @@
|
||||
background-color: #272727;
|
||||
z-index: 9999999;
|
||||
&.sm{
|
||||
max-width: 550px;
|
||||
max-width: 580px;
|
||||
}
|
||||
&.ssm{
|
||||
max-width: 380px;
|
||||
}
|
||||
&.xm{
|
||||
max-width: 300px;
|
||||
}
|
||||
&.mount{
|
||||
animation: mountpop .17s ease-in-out forwards;
|
||||
}
|
||||
@ -109,4 +112,149 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.adsorption-point{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #3A3A3A;
|
||||
border-radius: 3px;
|
||||
padding-left: 11px;
|
||||
overflow: hidden;
|
||||
transition: all 0.17s ease-in-out;
|
||||
span{
|
||||
font-size: 12px;
|
||||
color: #898989;
|
||||
}
|
||||
i{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 7px;
|
||||
margin-left: auto;
|
||||
height: 100%;
|
||||
font-size: 13px;
|
||||
color: #898989;
|
||||
}
|
||||
&.act{
|
||||
i{
|
||||
color: #fff;
|
||||
background-color: #1083E3;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// grid-option
|
||||
.grid-check-form{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 15px;
|
||||
padding-bottom: 15px;
|
||||
border-bottom: 1px solid #3C3C3C;
|
||||
}
|
||||
.grid-option-wrap{
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #3C3C3C;
|
||||
.grid-option-box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #3D3D3D;
|
||||
border-radius: 2px;
|
||||
padding: 10px;
|
||||
gap: 20px;
|
||||
margin-bottom: 5px;
|
||||
.grid-input-form{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
span{
|
||||
font-size: 12px;
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
}
|
||||
.input-grid{
|
||||
width: 63px;
|
||||
input{
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:last-child{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.grid-select{
|
||||
flex: 1;
|
||||
.sort-select{
|
||||
width: 100%;
|
||||
background-color: #313131;
|
||||
}
|
||||
}
|
||||
.grid-btn-wrap{
|
||||
padding-top: 15px;
|
||||
text-align: right;
|
||||
button{
|
||||
padding: 0 20px;
|
||||
}
|
||||
}
|
||||
|
||||
// grid copy
|
||||
.grid-option-tit{
|
||||
font-size: 12px;
|
||||
color: #fff;
|
||||
font-weight: 400;
|
||||
padding-bottom: 15px;
|
||||
border-bottom: 1px solid #3C3C3C;
|
||||
}
|
||||
.grid-direction{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
}
|
||||
.direction{
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
background-color: #757575;
|
||||
background-image: url(../../public/static/images/canvas/grid_option_arr.svg);
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: 16px 15px;
|
||||
border-radius: 50%;
|
||||
transition: all .15s ease-in-out;
|
||||
&.down{transform: rotate(180deg);}
|
||||
&.left{transform: rotate(-90deg);}
|
||||
&.right{transform: rotate(90deg);}
|
||||
&:hover,
|
||||
&.act{
|
||||
background-color: #1083E3;
|
||||
}
|
||||
}
|
||||
|
||||
// grid-move
|
||||
.move-form{
|
||||
p{
|
||||
font-size: 12px;
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
.input-move-wrap{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
span{
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
}
|
||||
.input-move{
|
||||
width: 148px;
|
||||
input{
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.direction-move-wrap{
|
||||
flex: none;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 10px;
|
||||
}
|
||||
@ -338,6 +338,7 @@ button{
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
input[type=number],
|
||||
input[type=text]{
|
||||
&.input-origin{
|
||||
display: inline-block;
|
||||
@ -508,6 +509,11 @@ input[type=text]{
|
||||
color: #45576F;
|
||||
}
|
||||
}
|
||||
&.no-text{
|
||||
label{
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.d-check-radio {
|
||||
@ -565,6 +571,16 @@ input[type=text]{
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
&.pop{
|
||||
label{
|
||||
&:before{
|
||||
border-color: #fff;
|
||||
}
|
||||
&:after{
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// check-box
|
||||
@ -611,6 +627,11 @@ input[type=text]{
|
||||
transform: translate(7.75px,4.5px) rotate(45deg);
|
||||
-ms-transform: translate(7.75px,4.5px) rotate(45deg);
|
||||
}
|
||||
&.pop{
|
||||
input[type=checkbox]:checked + label::after{
|
||||
border-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// date-picker
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user