From 66b72ba7f64fffd0e6f3c473c4a978fa015b24cc Mon Sep 17 00:00:00 2001
From: Nezumi <loiphan2711@gmail.com>
Date: Sat, 22 Jul 2023 10:05:21 +0700
Subject: [PATCH] Fix duplicate code and acc icon for website

---
 .../src/assets/images/favicon-16x16.png       | Bin 0 -> 633 bytes
 practice/practice-02/src/index.pug            |   5 +++
 .../src/styles/abstracts/_mixins.scss         |   5 ++-
 .../src/styles/layouts/_header.scss           |   7 +++-
 .../src/styles/layouts/_welcome.scss          |  30 ++++++++++++------
 5 files changed, 36 insertions(+), 11 deletions(-)
 create mode 100644 practice/practice-02/src/assets/images/favicon-16x16.png

diff --git a/practice/practice-02/src/assets/images/favicon-16x16.png b/practice/practice-02/src/assets/images/favicon-16x16.png
new file mode 100644
index 0000000000000000000000000000000000000000..9ee99974cbad2cec0b4ad4146c089cbfb9b8445a
GIT binary patch
literal 633
zcmV-<0*3vGP)<h;3K|Lk000e1NJLTq000mG000mO1^@s6AM^iV00001b5ch_0Itp)
z=>Px%Gf6~2R5(wSlFv(2Q546&=lI^dH!2k`<xXN`8Wag3NQ;oj5W$EUD5FIYF&jZ>
zkr1>ATJ#S{P>b5Ms5WkjAaWxu`XNLutRSL57tXwSLq?O#_+Ib66L(OEsm3~+bGi3>
zKIh9hm#|65^RowO=-#Wp$*5VqyvcVawd4|${){lZPe*4~8}-cr^XCV3tgjJUW759o
zfpy@@$^QcA7w0Y}E6Id@8J6(HE+-#LQ>}Az%fCYY=s<>tt<Z6L;xu2NHOWKJP9mBK
z``y{uPfY=<qoV_09wCvZM0{6(ed`6!T4$deAt2e*!G@qZdTdBoZi--u<7l$czR@)u
zq7ewdCQ<$Pd(;7*=XIx2sY4>tmrkdr7Z(@T%zY-4>GXZS+|||9K}1rk)qYr()gJ`G
zyi#g+sZ?4f&-1o8j&oH+9#yN=g-WHevfhU>narf``?r)*$BF2hh^Qn<3Pe-^&>IB7
zLj%}p+x9p!cL2B@hT+#FNjQ~C^)vI<D2f(r+qQ`)FCsetTqmN#%zUR%C{#_C9<6n^
zWm(3>0szy=bQz4I=(6j&+u}Gr#mplBmPF(OGjp+6oURX1DK!P4$jn)-^$Zb>5z%)5
zZ2$~3M?||s#0IbzKtM!qec!)P2bcl6uG=2Rv9VrlX=&*+**uoZWnU@PtF^A#ww=>j
zm!l|p?KsW=GxrhE<4xDNu{fnvo0$WE_W<6V_Pp^k+dEGDGobMYNH*KL8iu)_E|&0P
Tr}3Sw00000NkvXXu0mjfE-xi+

literal 0
HcmV?d00001

diff --git a/practice/practice-02/src/index.pug b/practice/practice-02/src/index.pug
index e5f0787..a9bf8ef 100644
--- a/practice/practice-02/src/index.pug
+++ b/practice/practice-02/src/index.pug
@@ -4,6 +4,11 @@ html(lang="en")
     meta(charset="UTF-8")
     meta(name="viewport", content="width=device-width, initial-scale=1.0")
     link(rel="stylesheet", href="./styles/main.scss")
+    link(
+      rel="icon",
+      type="image/x-icon",
+      href="./assets/images/favicon-16x16.png"
+    )
     title Food Hut
   body
     header.header
diff --git a/practice/practice-02/src/styles/abstracts/_mixins.scss b/practice/practice-02/src/styles/abstracts/_mixins.scss
index 52ff198..d5f760d 100644
--- a/practice/practice-02/src/styles/abstracts/_mixins.scss
+++ b/practice/practice-02/src/styles/abstracts/_mixins.scss
@@ -49,12 +49,15 @@
 }
 
 @mixin setAbsoluteAndLocation(
+  $absolute: false,
   $top: null,
   $left: null,
   $right: null,
   $bottom: null
 ) {
-  position: absolute;
+  @if $absolute {
+    position: absolute;
+  }
 
   @if $top != null {
     top: $top;
diff --git a/practice/practice-02/src/styles/layouts/_header.scss b/practice/practice-02/src/styles/layouts/_header.scss
index d795f72..388638b 100644
--- a/practice/practice-02/src/styles/layouts/_header.scss
+++ b/practice/practice-02/src/styles/layouts/_header.scss
@@ -1,5 +1,10 @@
 .header {
-  @include setAbsoluteAndLocation($top: 0, $right: 0, $left: 0);
+  @include setAbsoluteAndLocation(
+    $absolute: true,
+    $top: 0,
+    $right: 0,
+    $left: 0
+  );
 
   max-width: 428px;
   margin: auto;
diff --git a/practice/practice-02/src/styles/layouts/_welcome.scss b/practice/practice-02/src/styles/layouts/_welcome.scss
index f7f1e49..e4d8b1d 100644
--- a/practice/practice-02/src/styles/layouts/_welcome.scss
+++ b/practice/practice-02/src/styles/layouts/_welcome.scss
@@ -27,18 +27,18 @@
   }
 
   &__lines-background {
-    @include setAbsoluteAndLocation($top: -76px, $right: 0);
+    @include setAbsoluteAndLocation($absolute: true, $top: -76px, $right: 0);
     @include size(187px, 430px);
   }
 
   &__arrow-img-up {
-    @include setAbsoluteAndLocation($top: -15px, $right: 50px);
+    @include setAbsoluteAndLocation($absolute: true, $top: -15px, $right: 50px);
 
     @include size(43px, 215px);
   }
 
   &__mint-img {
-    @include setAbsoluteAndLocation($bottom: 100px, $right: 0);
+    @include setAbsoluteAndLocation($absolute: true, $bottom: 100px, $right: 0);
   }
   // End banner
 
@@ -57,7 +57,7 @@
   }
 
   &__orange-img-wrapper {
-    @include setAbsoluteAndLocation($top: 0, $right: 35px);
+    @include setAbsoluteAndLocation($absolute: true, $top: 0, $right: 35px);
   }
 
   &__text-box {
@@ -84,7 +84,7 @@
 
   &__head-arrow-container {
     @include size(13px, 7.3px);
-    @include setAbsoluteAndLocation($right: 107px);
+    @include setAbsoluteAndLocation($absolute: true, $right: 107px);
   }
 
   &__heading {
@@ -96,7 +96,11 @@
   }
 
   &__underline-img-container {
-    @include setAbsoluteAndLocation($bottom: -20px, $left: 0px);
+    @include setAbsoluteAndLocation(
+      $absolute: true,
+      $bottom: -20px,
+      $left: 0px
+    );
   }
 
   &__description {
@@ -293,7 +297,11 @@
     }
 
     &__arrow-down-img-wrapper {
-      @include setAbsoluteAndLocation($top: -50px, $left: 220px);
+      @include setAbsoluteAndLocation(
+        $absolute: true,
+        $top: -50px,
+        $left: 220px
+      );
 
       display: block;
       transition: 0.2s;
@@ -305,7 +313,11 @@
 
     &__slider-container {
       display: block;
-      @include setAbsoluteAndLocation($bottom: -135px, $left: 65px);
+      @include setAbsoluteAndLocation(
+        $absolute: true,
+        $bottom: -135px,
+        $left: 65px
+      );
     }
 
     // End content
@@ -327,7 +339,7 @@
     }
 
     &__arrow-down-img-wrapper {
-      @include setAbsoluteAndLocation($top: -95px, $left: 230px);
+      @include setAbsoluteAndLocation($top: -75px, $left: 230px);
     }
   }
 }