From 74ab9c9da6243cae1cea8b9381c9e98b178b98b7 Mon Sep 17 00:00:00 2001 From: Raven Scott Date: Wed, 2 Oct 2024 05:51:00 -0400 Subject: [PATCH] update AI page --- public/css/chat.css | 84 ++++++++++++++++++++++++++++++++++++++++++++- views/chat.ejs | 63 ++++++++++++++++++---------------- 2 files changed, 116 insertions(+), 31 deletions(-) diff --git a/public/css/chat.css b/public/css/chat.css index 198c5fa..943544a 100644 --- a/public/css/chat.css +++ b/public/css/chat.css @@ -244,4 +244,86 @@ pre code { /* Add class for fading out when alert is being removed */ .alert.fade-out { animation: fadeSlideOut 0.5s forwards; -} \ No newline at end of file +} + + +/* Dropdown menu styling */ +.navbar .dropdown-menu { + background-color: #1e1e1e; + /* Match the chat box background */ + border: none; + /* Remove border */ + box-shadow: none; + /* Remove shadow */ + padding: 0; + /* Remove padding */ +} + +.navbar .dropdown-item { + background-color: #1e1e1e; + /* Match the chat box background */ + color: white; + /* White text */ + padding: 10px 20px; + /* Add padding for spacing */ + border-bottom: 1px solid #444; + /* Add a subtle separator */ +} + +.navbar .dropdown-item:last-child { + border-bottom: none; + /* Remove border for the last item */ +} + +.navbar .dropdown-item:hover { + background-color: #282828; + /* Slightly lighter background on hover */ + color: #f1f1f1; + /* Lighter text on hover */ +} + +.navbar .dropdown-item:focus { + background-color: #282828; + /* Match hover style for focused items */ + outline: none; + /* Remove default outline */ +} + +.navbar .dropdown-toggle { + color: white; + /* White text */ +} + +.navbar .dropdown-toggle::after { + border-top: 0.3em solid white; + /* White arrow for dropdown */ +} + +.navbar .dropdown-menu.show { + opacity: 1; + /* Fully opaque when shown */ + transform: translateY(0); + /* Reset transform */ + transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; + /* Smooth fade and slide transition */ +} + +.navbar .dropdown-menu { + opacity: 0; + transform: translateY(-10px); + /* Start hidden and slightly raised */ + transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; + /* Smooth fade and slide transition */ +} + +/* Styling the dropdown toggle button */ +.navbar .dropdown-toggle:hover { + color: #f1f1f1; + /* Lighter text on hover */ +} + +/* Separator between regular menu items and dropdown */ +.navbar .separator { + color: #555; + /* Subtle separator color */ +} diff --git a/views/chat.ejs b/views/chat.ejs index 0fdb8b2..9963f3b 100644 --- a/views/chat.ejs +++ b/views/chat.ejs @@ -24,14 +24,14 @@ - + @@ -51,35 +51,38 @@ + @@ -95,7 +98,7 @@
- +