add task solution

mate-academy · Sep 19, 2024 · e78e692 · e78e692
1 parent 5ff9acc
commit e78e692
Showing 1 changed file with 4 additions and 201 deletions.
diff --git 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);
 }