diff --git a/py/static/styles.css b/py/static/styles.css index be1f9aa..a4347f3 100644 --- a/py/static/styles.css +++ b/py/static/styles.css @@ -252,7 +252,7 @@ header a:hover { } /* Form styling */ -form { +#contactForm { max-width: 600px; margin: 0 auto; background: var(--input-background-color); /* Use the input background color variable */ @@ -261,14 +261,14 @@ form { box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Subtle shadow for depth */ } -form label { +#contactForm label { color: var(--text-color); /* Use the text color variable */ display: block; /* Ensure labels are block elements */ margin-bottom: 5px; /* Add some space below labels */ } -form input, -form textarea { +#contactForm input, +#contactForm textarea { color: var(--text-color); /* Use the text color variable */ background-color: var(--history-background-color); /* Use a contrasting background */ border: 1px solid var(--input-button-color); /* Use the input button color for borders */ @@ -278,7 +278,7 @@ form textarea { margin-bottom: 15px; } -form button { +#contactForm button { background-color: var(--input-button-color); /* Use the input button color */ color: var(--background-color); /* Use the background color for text */ border: none; @@ -288,6 +288,49 @@ form button { transition: background-color 0.3s; /* Smooth transition for hover effect */ } -form button:hover { +#contactForm button:hover { background-color: var(--input-button-hover-color); /* Use the hover color variable */ } + +/* FAQ Section */ +#faq { + max-width: 800px; + width: 90%; + margin-top: 50px; + padding: 20px; + background-color: #222; + border-radius: 10px; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3); +} + +#faq h2 { + text-align: center; + color: #00ccff; + font-size: 2em; + margin-bottom: 20px; +} + +.faq-item { + margin-bottom: 20px; + padding: 10px; + border-radius: 5px; + background-color: #333; +} + +.faq-item h3 { + color: #00ccff; + margin-bottom: 10px; + font-size: 1.5em; +} + +.faq-item p { + color: #ddd; + font-size: 1.1em; + line-height: 1.5; +} + +/* Add some hover effects for the FAQ items */ +.faq-item:hover { + background-color: #444; + transition: background-color 0.3s; +} \ No newline at end of file diff --git a/py/templates/faq.html b/py/templates/faq.html index ee87cc0..dac364f 100644 --- a/py/templates/faq.html +++ b/py/templates/faq.html @@ -1,30 +1,58 @@ - - + + - - - - - AI Assistant - + + + + + AI Assistant - FAQ + - -
- -
+ +
+ +
- +
+

Frequently Asked Questions

- +
+

What is this AI assistant for?

+

This AI assistant helps you with various tasks such as answering questions, generating text, and even helping with code or writing tasks.

+
+ +
+

How does the AI assistant work?

+

The assistant uses machine learning algorithms to understand your input and provide contextually relevant answers or generate content based on the task you've described.

+
+ +
+

Can I trust the answers given by the AI assistant?

+

While the AI strives to give accurate and helpful answers, it is important to verify critical information, especially for complex or sensitive queries.

+
+ +
+

What kind of questions can I ask?

+

You can ask a wide range of questions from simple factual queries to more complex requests like generating creative writing or code snippets.

+
+ +
+

Is my data secure when using the AI assistant?

+

We take privacy seriously. Your data is handled according to our privacy policy, ensuring that any personal information shared is securely processed and not misused.

+
+
+ + + diff --git a/py/templates/index.html b/py/templates/index.html index 05ac801..4ef9be4 100644 --- a/py/templates/index.html +++ b/py/templates/index.html @@ -20,7 +20,7 @@ Contact
  • - FAQ + FAQ