React-Group/ai-virtual-assistant
Archived
3
2
Fork 2
Code Issues 24 Pull requests Projects Releases Packages Wiki Activity Actions

Added a header to the project #28

Merged
Patrick_Pluto merged 10 commits from sageTheDm/ai-virtual-assistant:main into main 2024-09-16 16:10:07 +02:00
Conversation 0 Commits 10 Files changed 5 +153 -89
5 changed files with 153 additions and 89 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
py/static/img/logo.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.6 KiB

40
py/static/styles.css
View file

@ -1,6 +1,6 @@
/* Color Variables */
:root {
--background-color: black;
--background-color: white;
--text-color: white;
--font-family: Arial, sans-serif;
--history-background-color: rgb(0, 0, 48);
@ -23,13 +23,14 @@
padding: 0;
box-sizing: border-box;
}
/* Disable Scrolling */
html, body {
height: 100vh;
overflow: hidden; /* Prevent scrolling */
}
/* Body Styling */
body {
margin-top: 1em;
display: flex;
justify-content: center;
align-items: center;
@ -37,6 +38,41 @@ body {
color: var(--text-color);
font-family: var(--font-family);
}
header {
background-color: var(--background-color); /* Use the background color variable */
color: black; /* Use the text color variable */
width: 100%;
text-decoration: none;
position: fixed;
top: 0;
left: 0;
padding: 10px 20px; /* Add some padding for spacing */
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Subtle shadow for depth */
z-index: 1000; /* Ensure the header is above other content */
font-family: var(--font-family); /* Use the font family variable */
}
header li {
display: inline-block;
margin: 0 15px; /* Add spacing between list items */
}
header img {
height: 2em;
vertical-align: middle; /* Align image with text */
}
header a {
color: black; /* Ensure links are white */
text-decoration: none; /* Remove underline from links */
transition: color 0.3s; /* Smooth transition for hover effect */
}
header a:hover {
color: var(--input-button-color); /* Change color on hover for better interaction */
}
/* Container Grid Layout */
.container {
display: grid;

13
py/templates/contact.html Normal file
View file

@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/static/styles.css">
<title>AI Assistant</title>
</head>
<body>
</body>
</html>

0
py/templates/faq.html Normal file
View file

29
py/templates/index.html
View file

@ -1,14 +1,29 @@
<!DOCTYPE html>
<html lang="en">
<!DOCTYPE html>
<html lang="en">
<head>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/static/styles.css">
<title>AI Assistant</title>
</head>
</head>
<body>
<body>
<header>
<ul>
<li>
<a href="/static/templates/index.html">
<img src="/static/img/logo.png" alt="logo.png">
</a>
</li>
<li>
<a href="/static/template/contact.html">Contact</a>
</li>
<li>
<a href="/static/template/faq.html">FAQ</a>
</li>
</ul>
</header>
<!-- Main container for the layout -->
<div class="container">
@ -88,6 +103,6 @@
<button type="submit" name="option" value="chat">Send</button>
</form>
</div>
</body>
</body>
</html>
</html>