From 38516501fb02773cd7f749db196ad900f6129119 Mon Sep 17 00:00:00 2001
From: "Mohamed.Kh Elhwary" <MohamedKhamisMostafa@gmail.com>
Date: Wed, 24 Jan 2024 13:49:24 +0200
Subject: [PATCH] Create Menu For Small Screens

---
 css/master.css | 31 +++++++++++++++++++++++++++++++
 1 file changed, 31 insertions(+)

diff --git a/css/master.css b/css/master.css
index 0d941ed..45666fb 100644
--- a/css/master.css
+++ b/css/master.css
@@ -254,6 +254,17 @@ text-align: right;
   cursor: pointer;
   margin-top: 15px;
   display: none;
+  position: relative;
+}
+
+.header-area .toggle-menu::before{
+  content: '';
+  border-width: 10px ;
+  border-style: solid;
+  border-color: transparent transparent #fff transparent;
+  position: absolute;
+  top: 22px;
+  left: 10px;
 }
 
 .header-area .toggle-menu:focus{
@@ -267,6 +278,7 @@ text-align: right;
   margin-bottom: 4px;
 }
 
+
 .introdaction-text {
   position: absolute;
   top: 50%;
@@ -298,6 +310,25 @@ text-align: right;
   .header-area .links{
     display: none;
   }
+  .header-area .links.open{
+    background-color: white;
+    display: block;
+    position: absolute;
+    top: 50px;
+    left: 0;
+    width: 100%;
+    border-radius: 4px;
+    padding: 10px;
+    text-align: left;
+  }
+  .header-area .links.open li:not(:last-of-type) {
+    display: block;
+    margin-bottom: 10px;
+  }
+  .header-area .links.open li a{
+    color: var(--main-color);
+    font-weight: bold;
+  }
   .header-area .toggle-menu{
     display: inline-block;
   }