diff --git a/07-lection5/04-input/index.html b/07-lection5/04-input/index.html index 1168659..822740e 100644 --- a/07-lection5/04-input/index.html +++ b/07-lection5/04-input/index.html @@ -1,18 +1,28 @@ - - - - Input - + + + - -
- -
- - + Input + + + +
+ +
+ + +
+ +
+ + +
+ +
+ + + \ No newline at end of file diff --git a/07-lection5/04-input/input.css b/07-lection5/04-input/input.css index e69de29..433e0fa 100644 --- a/07-lection5/04-input/input.css +++ b/07-lection5/04-input/input.css @@ -0,0 +1,39 @@ +.input { + display: flex; + flex-direction: column; + width: 350px; + gap: 5px; +} + +.input__label { + color: var(--grey-3, #ACB5BD); + font-family: Inter; + font-size: 12px; + font-style: normal; + font-weight: 500; + line-height: 1.5; + letter-spacing: 0.48px; + text-transform: uppercase; +} + +.input__field { + height: 56px; + border-radius: 8px; + border: 1px solid var(--grey-2, #DDE2E5); + padding-left: 24px; + font-family: Inter; + font-size: 20px; + font-style: normal; + font-weight: 400; + line-height: 1.3; +} + +.input__field::placeholder { + color: var(--grey-2, #DDE2E5); +} + +.input__field:focus { + border-color: var(--blue, #374FC7); + outline: none; + color: var(--grey-4, #495057); +}