Merge pull request #4 from BekhUriy/footer

add footer markup and styles

src/css/footer.css

@@ -0,0 +1,117 @@
+.footer_section {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+.footer_container {
+  border: 1.5px solid #111111;
+  border-radius: 8px;
+  border-radius: 8px;
+  padding-top: 13px;
+  padding-bottom: 14px;
+  height: 72px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.footer_container_shop {
+  background-color: white;
+}
+
+@media screen and (min-width: 768px) {
+  .footer_container_shop {
+    background-color: white;
+  }
+}
+
+.shop {
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 100%;
+}
+
+.footer_wrapper {
+  text-align: center;
+  color: #202024;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 1.125;
+}
+@media screen and (min-width: 768px) {
+  .footer_wrapper {
+    font-size: 16px;
+    line-height: 1.2;
+  }
+}
+
+/* .footer_icon {
+  fill: var(--color-blue-component);
+}
+.footer_icon:hover,
+.footer_icon:focus {
+  fill: var(--color-yellow-componemt);
+} */
+
+.footer_text_left {
+  margin-bottom: 10px;
+}
+
+@media screen and (min-width: 768px) {
+  .footer_text_left {
+    display: inline-block;
+    margin-bottom: 0px;
+  }
+}
+
+.footer_text_right {
+  justify-content: center;
+  align-items: center;
+  display: inline-flex;
+  gap: 10px;
+}
+
+/* .heart_beats {
+  -webkit-animation: heart-beats 3s infinite;
+  animation: heart-beats 2s infinite;
+}
+
+@keyframes heart-beats {
+  7% {
+    transform: scale(1.2);
+  }
+  12% {
+    transform: scale(1.1);
+  }
+  20% {
+    transform: scale(1.3);
+  }
+  60% {
+    transform: scale(1);
+  }
+  100% {
+    transform: scale(0.99);
+  }
+}
+
+@-webkit-keyframes heart-beats {
+  0% {
+    -webkit-transform: scale(1);
+  }
+  7% {
+    -webkit-transform: scale(1.2);
+  }
+  12% {
+    -webkit-transform: scale(1.1);
+  }
+  20% {
+    -webkit-transform: scale(1.3);
+  }
+  60% {
+    -webkit-transform: scale(1);
+  }
+  100% {
+    -webkit-transform: scale(0.99);
+  }
+} */

src/partials/footer.html

@@ -0,0 +1,12 @@
+<section class="section footer_section">
+  <div
+    class="container footer_container footer_container_shop footer_container_group"
+  >
+    <div class="footer_wrapper">
+      <p class="footer_text_left">© 2023 | All Rights Reserved |</p>
+      <p class="footer_text_right">
+        Developed by GoIt DreamTeam</a>
+      </p>
+    </div>
+  </div>
+</section>