start menu still in progres

src/app/shared/system-component/dialog/dialog.component.css

@@ -53,7 +53,7 @@ right: 0;
     height: 18px;
     width: 18px;
     margin: 0 6px 0 8px;
-    image-rendering: optimizeQuality;
+
 }
 
 .error-dialog-figure{
@@ -130,7 +130,7 @@ right: 0;
     height: 38px;
     width: 38px;
     margin: 0 8px;
-    image-rendering: optimizeQuality;
+
 }
 
 .error-dialog-figure1{
@@ -224,7 +224,7 @@ right: 0;
     height: 38px;
     width: 38px;
     margin: 0 14px;
-    image-rendering: optimizeQuality;
+
 }
 
 .info-dialog-figure1{
@@ -288,7 +288,7 @@ right: 0;
     height: 38px;
     width: 38px;
     margin: 0 14px;
-    image-rendering: optimizeQuality;
+
 }
 
 .warning-dialog-figure1{

src/app/shared/system-component/properties/properties.component.css

@@ -52,7 +52,7 @@
     position: relative;
     left: -5px;
     margin: 0 6px 0 8px;
-    image-rendering: optimizeQuality;
+
 }
 
 .properties-figure{

src/app/shared/system-component/window/window.component.css

@@ -74,7 +74,7 @@ img{
   height: 18px;
   width: 18px;
   margin: 0 6px 0 8px;
-  image-rendering: optimizeQuality;
+
 }
 
 figure{

src/app/system-apps/startmenu/startmenu.component.css

@@ -1,13 +1,69 @@
-.start-menu-main-container{
+.start-menu-main-container, .start-menu-main-overlay-container{
     position: absolute;
-    width: 100;
     z-index: 2;
     bottom: 3.7%;
+    left: 0;
 }
 
+.start-menu-main-overlay-container{
+    bottom: 0%;
+}
+
+.start-menu-main-overlay-content{
+    display: flex;
+    width: 48px;
+    height: 500px;
+}
+
+
+.start-menu-main-overlay-icon-content{
+    width: 100%;
+}
+
+.start-menu-overlay-icon{
+    width: 100%;
+    padding: 12px 12px;
+    border: 2px solid transparent;
+}
+
+.start-menu-overlay-icon:hover{
+    border-color: white;
+}
+
+.start-menu-overlay-figure{
+    display: flex;
+    align-items: center;
+    height: 16px;
+}
+
+.start-menu-overlay-img{
+    position: relative;
+    /* top: 25px; */
+    height: 16px;
+    width: 16px;
+    /* margin: 0 14px; */
+
+}
+
+.start-menu-main-overlay-text-content{
+    display: none;
+    position: absolute;
+    width: 15%;
+}
+
+
+
 .start-menu-main-content-container{
+    display:flex;
     width: 450px;
     height: 500px;
     background-color: rgba(0, 0, 0, 0.6);
     backdrop-filter: blur(5px);
-}
+}
+
+
+
+.start-menu-main-base-conatiner{
+    width: 85%;
+}
+

src/app/system-apps/startmenu/startmenu.component.html

@@ -1,5 +1,62 @@
 <div class="start-menu-main-container">
+
+    <div class="start-menu-main-overlay-container">
+        <div class="start-menu-main-overlay-content">
+
+
+            <div class="start-menu-main-overlay-icon-content">
+                <div class="start-menu-overlay-icon">
+                    <figure class="start-menu-overlay-figure">
+                        <img class="start-menu-overlay-img" [src]="'osdrive/Cheetah/System/Imageres/sm_hamburger_menu.png'"/>
+                    </figure>
+                </div>
+
+                <div style="height: 280px;"> </div>
+
+                <div class="start-menu-overlay-icon">
+                    <figure class="start-menu-overlay-figure">
+                        <img class="start-menu-overlay-img" [src]="'osdrive/Cheetah/System/Imageres/sm_file.png'"/>
+                    </figure>
+                </div>
+                <div class="start-menu-overlay-icon">
+                    <figure class="start-menu-overlay-figure">
+                        <img class="start-menu-overlay-img" [src]="'osdrive/Cheetah/System/Imageres/sm_picture.png'"/>
+                    </figure>
+                </div>
+                <div class="start-menu-overlay-icon">
+                    <figure class="start-menu-overlay-figure">
+                        <img class="start-menu-overlay-img" [src]="'osdrive/Cheetah/System/Imageres/sm_settings.png'"/>
+                    </figure>
+                </div>
+                <div class="start-menu-overlay-icon">
+                    <figure class="start-menu-overlay-figure">
+                        <img class="start-menu-overlay-img" [src]="'osdrive/Cheetah/System/Imageres/sm_power.png'"/>
+                    </figure>
+                </div>
+            </div>
+
+            <div class="start-menu-main-overlay-text-content">
+
+            </div>
+        </div>
+    </div>
+
     <div class="start-menu-main-content-container">
 
     </div>
-</div>
+</div>
+
+
+<!-- <div class="start-menu-main-container">
+    <div class="start-menu-main-content-container">
+        <div class="start-menu-main-content-section-a">
+            <div class="start-menu-sct-a-icon">
+                <figure class="start-menu-sct-a-figure">
+                    <img class="start-menu-sct-a-img" [src]="'osdrive/Cheetah/System/Imageres/sm_power.png'"/>
+                </figure>
+            </div>
+        </div>
+        <div class="start-menu-main-content-section-b">
+        </div>
+    </div>
+</div> -->

src/app/system-apps/taskmanager/taskmanager.component.css

@@ -541,7 +541,7 @@ span {
 .tskmgr-nav-img{
   height: 12px;
   width: 12px;
-  image-rendering:optimizeQuality;
+
   position: relative;
 }
 
@@ -567,7 +567,7 @@ span {
 .tskmgr-nav-sub-menu-img{
   height: 8px;
   width: 8px;
-  image-rendering:optimizeQuality;
+
   position: relative;
 }
 
@@ -630,7 +630,7 @@ span {
 .tskmgr-img{
   height: 16px;
   width: 16px;
-  image-rendering:optimizeQuality;
+
   position: relative;
 }