From a38a7948833cde120f6f56323e10ff7b3096b995 Mon Sep 17 00:00:00 2001
From: Asanda65 <93676091+Asanda65@users.noreply.github.com>
Date: Fri, 5 Jan 2024 19:22:58 +0530
Subject: [PATCH] log out button update

---
 admin/src/components/Header.js | 19 ++++++++++++++++---
 admin/src/css/AllMovies.css    | 13 ++++++++++++-
 admin/src/pages/AllMovies.js   |  1 +
 3 files changed, 29 insertions(+), 4 deletions(-)

diff --git a/admin/src/components/Header.js b/admin/src/components/Header.js
index 5bf6088..4bd120b 100644
--- a/admin/src/components/Header.js
+++ b/admin/src/components/Header.js
@@ -1,4 +1,3 @@
-// Header.js
 import React from 'react';
 
 const Header = () => {
@@ -9,9 +8,23 @@ const Header = () => {
             height: '65px',
             display: 'flex',
             alignItems: 'center',
-            paddingLeft: '20px'
+            justifyContent: 'space-between',
+            paddingLeft: '20px',
+            paddingRight: '20px',
         }}>
-            CINEMAGIC
+            <span>CINEMAGIC</span>
+            <button style={{
+                backgroundColor: '#f0f0f0',
+                color: 'black',
+                padding: '10px 20px',
+                border: 'none',
+                borderRadius: '5px',
+                cursor: 'pointer',
+                fontSize: '1rem',
+                fontWeight: 'bold'
+            }}>
+                Log Out
+            </button>
         </div>
     );
 };
diff --git a/admin/src/css/AllMovies.css b/admin/src/css/AllMovies.css
index 0dd4ede..d0ef38b 100644
--- a/admin/src/css/AllMovies.css
+++ b/admin/src/css/AllMovies.css
@@ -7,7 +7,7 @@
 }
 
 .movie-card {
-    width: calc(25% - 20px);
+    width: calc(26% - 20px);
     /* Adjust width for 4 cards in a row, accounting for the gap */
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
     border-radius: 8px;
@@ -89,6 +89,17 @@
     margin-right: 5px;
 }
 
+.chat-btn {
+    padding: 6px 14px;
+    border: none;
+    border-radius: 4px;
+    cursor: pointer;
+    transition: background-color 0.2s;
+    margin-bottom: 8px;
+    color: white;
+    margin-right: 5px;
+}
+
 
 .show-btn {
     padding: 6px 14px;
diff --git a/admin/src/pages/AllMovies.js b/admin/src/pages/AllMovies.js
index 15794e1..a92f107 100644
--- a/admin/src/pages/AllMovies.js
+++ b/admin/src/pages/AllMovies.js
@@ -101,6 +101,7 @@ const MovieGrid = () => {
             <button className="btn add-btn">Add Movie</button>
           </Link>
         </Link>
+        <Link to="/chat" className="btn-link"><button className="btn add-btn">Chat</button></Link>
       </div>
       <div className="movie-grid">
         {currentMovies.map((movie, index) => (