Merge pull request #42 from Ayush-kr-giga/main

Fixed missing messages section at bottom right place
abhrajit2004 · Oct 19, 2024 · f4b396a · f4b396a
2 parents 5d11961 + 30aff42
commit f4b396a
Show file tree

Hide file tree

Showing 4 changed files with 64 additions and 0 deletions.
diff --git a/css/messages.css b/css/messages.css
@@ -0,0 +1,50 @@
+#messages{
+    z-index: 5;
+    position: fixed;
+    height: 60px;
+    width: 400px;
+    /* background-color: yellow; */
+    display: flex;
+    align-items: center;
+    /* justify-content: center; */
+
+    background-color: black;
+    border-top: 0.6px solid rgb(25, 25, 25);
+    border-left: 0.6px solid rgb(25, 25, 25);
+    border-right: 0.6px solid rgb(25, 25, 25);
+
+    border-radius: 10px;
+    border-style: outset;
+    left:72%;
+    top:93%;
+
+
+}
+
+#messages span{
+    margin-left: 10px;
+    font-size: 20px;
+    font-style: bold;
+    font-weight: 900;
+}
+
+
+#img_messages1{
+    filter: invert(1);
+    height: auto; 
+    max-width: 6%;
+
+    margin-left: 210px;
+
+}
+
+
+
+#img_messages2{
+    filter: invert(1);
+    height: auto; 
+    max-width: 5%;
+    margin-left: 13px;
+    transform: rotate(270deg);
+
+}
diff --git a/expand.png b/expand.png
diff --git a/index.html b/index.html
@@ -10,8 +10,22 @@
       href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0"
     />
     <link rel="stylesheet" href="css/output.css" />
+    <link rel="stylesheet" href="css/messages.css">
   </head>
   <body class="bg-black min-h-screen text-white">
+
+
+    <!-- messgaes start -->
+    <div id="messages">
+      <span>Messages</span>
+      <img src="messages.png" alt="" id="img_messages1">
+      <img src="expand.png" alt="" id="img_messages2">
+
+    </div> 
+
+    <!-- messages end -->
+
+
     <div class="flex flex-row container mx-auto">
       <div class="left-sidebar h-full">
         <div class="flex justify-between flex-col h-full">

diff --git a/messages.png b/messages.png