From e78e6922570cb7732d3693b77af991057b2771cc Mon Sep 17 00:00:00 2001
From: Yura <yuradziavoruk5@gmail.com>
Date: Thu, 19 Sep 2024 13:31:32 +0300
Subject: [PATCH] add task solution

---
 src/style.css | 205 +-------------------------------------------------
 1 file changed, 4 insertions(+), 201 deletions(-)

diff --git a/src/style.css b/src/style.css
index 763e9c3bea..1df87b0d41 100644
--- a/src/style.css
+++ b/src/style.css
@@ -19,205 +19,8 @@
   font-style: normal;
 }
 
-/*
 body {
-  display: flex;
-  flex-direction: column;
-  font-weight: 300;
-  margin: 0;
-  padding: 0;
-}
-
-.form {
-  font-family: Avenir, sans-serif;
-  font-size: 16px;
-  outline: none;
-  color: #3d4e61;
-  background-image: url('./images/loop.svg');
-  background-repeat: no-repeat;
-  background-position: 26px center;
-  display: flex;
-  border: 1px solid #e1e7ed;
-  border-radius: 4px;
-  box-shadow: 0 1px 8px 0 #3d4e611a;
-  box-sizing: border-box;
-  width: 100%;
-}
-
-.big::placeholder {
-  color: #3d4e61;
-}
-
-.small::placeholder {
-  color: #3d4e61;
-}
-
-.form:focus {
-  background: linear-gradient(180deg, #fff 0%, #f6f6f7 100%);
-  background-image: url('./images/loop.svg');
-  background-repeat: no-repeat;
-  font-weight: bold;
-  background-size: 19px;
-
-  line-height: 22px;
-  text-align: left;
-  text-shadow: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
-}
-
-.form:hover {
-  box-shadow: 0 3px 8px 0 #3d4e6133;
-  background-image: url('./images/loop.svg');
-  background-repeat: no-repeat;
-  background-position: 26px center;
-}
-
-.big {
-  background-size: 19px;
-  background-position: 26px center;
-  height: 70px;
-  margin-top: 20px;
-  margin-bottom: 20px;
-  padding-left: 62px;
-}
-
-.small {
-  font-size: 14px;
-  font-weight: 400;
-  background-image: url('./images/loop.svg');
-  background-size: 11px;
-  background-position: 13px center;
-  height: 42px;
-  width: 100%;
-
-  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
-  padding-left: 33px;
-  box-sizing: border-box;
-}
-
-.big:focus {
-  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
-}
-
-.big:hover {
-  background-size: 19px;
-}
-
-.small:focus {
-  font-weight: bold;
-  background-size: 11px;
-  background-position: 13px center;
-  line-height: 22px;
-  text-align: left;
-  text-shadow: none;
-}
-
-.small:hover {
-  text-shadow: none;
-  background-size: 11px;
-  background-position: 13px center;
-}
-
-body {
-  display: flex;
-  flex-direction: column;
-  font-weight: 300;
-  margin: 0;
-  padding: 0;
-}
-
-.form {
-  font-family: Avenir, sans-serif;
-  font-size: 16px;
-  outline: none;
-  color: #3d4e61;
-  background-image: url('./images/loop.svg');
-  background-repeat: no-repeat;
-  background-position: 26px center;
-  display: flex;
-  border: 1px solid #e1e7ed;
-  border-radius: 4px;
-  box-shadow: 0 1px 8px 0 #3d4e611a;
-}
-
-.big::placeholder {
-  color: #3d4e61;
-}
-
-.small::placeholder {
-  color: #3d4e61;
-}
-
-.form:hover {
-  box-shadow: 0 3px 8px 0 #3d4e6133;
-  background-image: url('./images/loop.svg');
-  background-repeat: no-repeat;
-  background-position: 26px center;
-}
-
-.form:focus {
-  background-repeat: no-repeat;
-  background-size: contain;
-  background-position: 26px center;
-  font-weight: bold;
-  line-height: 22px;
-  text-align: left;
-  text-shadow: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
-}
-
-.big {
-  background-size: 19px;
-  background-position: 26px center;
-  height: 70px;
-  margin-top: 20px;
-  width: 100%;
-  top: 20px;
-  margin-bottom: 20px;
-  padding-left: 62px;
-}
-
-.small {
-  font-size: 14px;
-  font-weight: 400;
-  background-image: url('./images/loop.svg');
-  background-size: 11px;
-  background-position: 13px center;
-  height: 42px;
-  width: 100%;
-  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
-  padding-left: 33px;
-}
-
-.big:focus {
-  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
-  background-image: url('./images/loop.svg');
-  background-repeat: no-repeat;
-  background-position: 26px center;
-}
-
-.big:hover {
-  background-size: 19px;
-}
-
-.small:focus {
-  background-image: url('./images/loop.svg');
-  background-repeat: no-repeat;
-  font-weight: bold;
-  background-size: 11px;
-  background-position: 13px center;
-  line-height: 22px;
-  text-align: left;
-  text-shadow: none;
-}
-
-.small:hover {
-  text-shadow: none;
-  background-size: 11px;
-  background-position: 13px center;
-}
-*/
-
-body {
-  font-family: Avenir, sans-serif;
+  font-family: Avenir, Arial, sans-serif;
 }
 
 .form {
@@ -235,7 +38,7 @@ body {
 
 .big {
   font-size: 16px;
-  background: url('/src/images/loop.svg') no-repeat;
+  background: url('./images/loop.svg') no-repeat;
   background-size: 19px;
   box-sizing: border-box;
   background-position: 26px center;
@@ -247,7 +50,7 @@ body {
 .small {
   font-size: 14px;
   box-shadow: 0 1px 8px 0 #3d4e611a;
-  background: url('/src/images/loop.svg') no-repeat 13px center/11px 11px;
+  background: url('./images/loop.svg') no-repeat 13px center/11px 11px;
   height: 42px;
   padding-left: 33px;
 
@@ -291,7 +94,7 @@ body {
   border: 1px solid #e1e7ed;
   text-shadow: none;
   background:
-    url('/src/images/loop.svg') no-repeat 13px center/11px 11px,
+    url('./images/loop.svg') no-repeat 13px center/11px 11px,
     linear-gradient(180deg, transparent, #f6f6f7);
 }