#212121
1.form { 2 display: flex; 3 flex-direction: column; 4 gap: 10px; 5 background-color: #ffffff; 6 padding: 30px; 7 width: 450px; 8 border-radius: 20px; 9 font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 10} 11 12::placeholder { 13 font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 14} 15 16.form button { 17 align-self: flex-end; 18} 19 20.flex-column > label { 21 color: #151717; 22 font-weight: 600; 23} 24 25.inputForm { 26 border: 1.5px solid #ecedec; 27 border-radius: 10px; 28 height: 50px; 29 display: flex; 30 align-items: center; 31 padding-left: 10px; 32 transition: 0.2s ease-in-out; 33} 34 35.input { 36 margin-left: 10px; 37 border-radius: 10px; 38 border: none; 39 width: 100%; 40 height: 100%; 41} 42 43.input:focus { 44 outline: none; 45} 46 47.inputForm:focus-within { 48 border: 1.5px solid #2d79f3; 49} 50 51.flex-row { 52 display: flex; 53 flex-direction: row; 54 align-items: center; 55 gap: 10px; 56 justify-content: space-between; 57} 58 59.flex-row > div > label { 60 font-size: 14px; 61 color: black; 62 font-weight: 400; 63} 64 65.span { 66 font-size: 14px; 67 margin-left: 5px; 68 color: #2d79f3; 69 font-weight: 500; 70 cursor: pointer; 71} 72 73.button-submit { 74 margin: 20px 0 10px 0; 75 background-color: #151717; 76 border: none; 77 color: white; 78 font-size: 15px; 79 font-weight: 500; 80 border-radius: 10px; 81 height: 50px; 82 width: 100%; 83 cursor: pointer; 84} 85 86.p { 87 text-align: center; 88 color: black; 89 font-size: 14px; 90 margin: 5px 0; 91} 92 93.btn { 94 margin-top: 10px; 95 width: 100%; 96 height: 50px; 97 border-radius: 10px; 98 display: flex; 99 justify-content: center; 100 align-items: center; 101 font-weight: 500; 102 gap: 10px; 103 border: 1px solid #ededef; 104 background-color: white; 105 cursor: pointer; 106 transition: 0.2s ease-in-out; 107} 108 109.btn:hover { 110 border: 1px solid #2d79f3; 111 ; 112} 113 114
Comments
Variations
1 MIT License