From 20646730fcd839884d8afe5c03e346f48f6105da Mon Sep 17 00:00:00 2001 From: sageTheDm Date: Wed, 9 Oct 2024 13:02:48 +0200 Subject: [PATCH 1/2] Update styles.css --- styles.css | 233 +++++++++++++++++++++++++++++------------------------ 1 file changed, 129 insertions(+), 104 deletions(-) diff --git a/styles.css b/styles.css index 24f6012..4ffdd33 100644 --- a/styles.css +++ b/styles.css @@ -1,6 +1,6 @@ body { font-family: 'Arial', sans-serif; - background-color: #FCFCEB; + background-color: #FCFCEB; /* Light background */ color: #000000; margin: 0; padding: 0; @@ -8,37 +8,23 @@ body { } header { - background-color: #474D22; - color: #FCFCEB; + background-color: #474D22; /* Dark header for contrast */ + color: #FCFCEB; /* Light text */ padding: 40px 20px; text-align: center; - box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); + box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); } .hero h1 { font-size: 3rem; margin: 0; + font-weight: bold; /* Bolder text */ } .hero p { font-size: 1.2rem; margin: 10px 0; -} - -.cta-button { - background-color: #8B9635; - color: #FCFCEB; - padding: 10px 20px; - text-decoration: none; - border-radius: 5px; - font-weight: bold; - margin-top: 20px; - display: inline-block; - transition: background-color 0.3s ease; -} - -.cta-button:hover { - background-color: #6E7629; + font-style: italic; /* Italicized for a playful feel */ } .container { @@ -48,15 +34,22 @@ header { } h1, h2 { - color: #8B9635; + color: #8B9635; /* Primary color for headings */ + margin: 20px 0; + padding: 10px; } -.features { +.features, .how-it-works, .download { margin: 40px 0; - background-color: #f0f3da; + background-color: #f0f3da; /* Light feature background */ padding: 20px; - border-radius: 10px; - box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); + border-radius: 15px; /* More rounded corners */ + box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); + transition: transform 0.3s; /* Add hover effect */ +} + +.features:hover, .how-it-works:hover, .download:hover { + transform: translateY(-5px); /* Lift effect on hover */ } .feature-list { @@ -67,77 +60,25 @@ h1, h2 { .feature-item { flex: 1 1 calc(30% - 20px); - background-color: #FCFCEB; - border: 1px solid #8B9635; + background-color: #FCFCEB; /* Light background for feature items */ + border: 1px solid #8B9635; /* Consistent border */ padding: 20px; - border-radius: 5px; + border-radius: 10px; /* Rounded corners */ margin: 10px; text-align: center; + transition: transform 0.3s, box-shadow 0.3s; /* Hover effect */ } -.testimonial { - margin: 40px 0; -} - -.testimonial-item { - background-color: #474D22; - color: #FCFCEB; - padding: 20px; - border-radius: 5px; - margin: 10px 0; - font-style: italic; - box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); -} - -.author { - font-weight: bold; - margin-top: 10px; - text-align: right; -} - -.how-it-works { - margin: 40px 0; - background-color: #f7f9e8; - padding: 20px; - border-radius: 10px; -} - -.download { - margin: 40px 0; - padding: 30px; - text-align: center; -} - -.download-button { - background-color: #8B9635; - color: #FCFCEB; - padding: 15px 30px; - margin: 2em; - text-decoration: none; - border-radius: 5px; - font-size: 1.2rem; - transition: background-color 0.3s ease; -} - -.download-button:hover { - background-color: #6E7629; -} - -footer { - background-color: #474D22; - color: #FCFCEB; - padding: 20px; - text-align: center; - position: relative; - bottom: 0; - width: 100%; +.feature-item:hover { + transform: scale(1.05); /* Slight scaling on hover */ + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2); /* Shadow effect */ } .faq-container { display: flex; + flex-direction: column; justify-content: center; - align-items: center; - height: 100vh; + align-items: flex-start; padding: 0 10px; } @@ -145,41 +86,125 @@ footer { max-width: 800px; width: 90%; padding: 20px; - background-color: #FCFCEB; /* Set a static color instead of a variable */ - border-radius: 10px; - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3); - overflow-y: auto; /* Allow vertical scrolling if content overflows */ + background-color: #FCFCEB; /* Light background for FAQ */ + border-radius: 15px; /* Rounded corners */ + box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); margin: 2rem auto; - height: 80vh; -} - -#faq h2 { - text-align: center; - color: #8B9635; /* Use a static color instead of a variable */ - font-size: 2em; - margin-bottom: 20px; + height: auto; } .faq-item { margin-bottom: 20px; - padding: 10px; - border-radius: 5px; - background-color: #f0f3da; /* Use a specific background color */ + padding: 15px; /* Increased padding for better readability */ + border-radius: 10px; + background-color: #f0f3da; /* Light background for FAQ items */ transition: background-color 0.3s ease-in-out; } .faq-item h3 { - color: #8B9635; /* Static color */ + color: #8B9635; margin-bottom: 10px; font-size: 1.5em; } .faq-item p { - color: #000000; /* Static text color */ + color: #000000; font-size: 1.1em; line-height: 1.5; } .faq-item:hover { - background-color: #d1e0b6; /* Change to a lighter shade on hover */ + background-color: #d1e0b6; /* Lighter background on hover */ +} + +.download { + text-align: center; + padding-bottom: 1em; +} + +.download-button { + background-color: #8B9635; /* Primary button color */ + color: #FCFCEB; + padding: 15px 30px; + margin: 1em; + text-decoration: none; + border-radius: 5px; + font-size: 1.2rem; + transition: background-color 0.3s ease, transform 0.2s; /* Hover effects */ +} + +.download-button:hover { + background-color: #6E7629; /* Darker button color on hover */ + transform: translateY(-2px); /* Lift effect */ +} + +footer { + background-color: #474D22; /* Dark footer */ + color: #FCFCEB; /* Light footer text */ + padding: 20px; + text-align: center; + position: relative; + bottom: 0; + width: 100%; +} + +/* Responsive Styles */ +@media (max-width: 768px) { + .hero h1 { + font-size: 2.5rem; + } + + .hero p { + font-size: 1rem; + } + + .feature-list { + flex-direction: column; + align-items: center; + } + + .feature-item { + flex: 1 1 100%; + margin: 10px 0; + } + + .faq-item h3 { + font-size: 1.2em; + } + + .faq-item p { + font-size: 1em; + } + + .download-button { + font-size: 1rem; + padding: 10px 20px; + } +} + +@media (max-width: 480px) { + .hero h1 { + font-size: 2rem; + } + + .hero p { + font-size: 0.9rem; + } + + .faq-item h3 { + font-size: 1.1em; + } + + .faq-item p { + font-size: 0.9em; + } + + h1, h2 { + font-size: 1.5rem; + } + + .download-button { + padding: 10px 15px; + font-size: 0.9rem; + } } From 2bea7fb51793ea063ffb3e0e0ce48fa7bdb6c1db Mon Sep 17 00:00:00 2001 From: sageTheDm Date: Wed, 9 Oct 2024 13:03:25 +0200 Subject: [PATCH 2/2] Update index.html --- index.html | 93 ++++++++++++++++++++++++++++++------------------------ 1 file changed, 51 insertions(+), 42 deletions(-) diff --git a/index.html b/index.html index ab39a78..a865213 100644 --- a/index.html +++ b/index.html @@ -10,6 +10,7 @@

Interstellar AI

+

Your personal AI assistant to enhance productivity.

@@ -35,49 +36,50 @@

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.

-
-
-

How can I provide feedback about the AI assistant?

-

Feedback can be provided through our feedback form, available on our website. We appreciate your input and use it to improve the AI assistant's performance.

-
-
-

Can I customize the AI assistant's responses?

-

Customization options are limited in the current version, but we are working on features that will allow users to tailor responses to better suit their needs.

-
-
-

How frequently is the AI assistant updated?

-

The AI assistant is updated regularly to improve its functionality and incorporate new features. Stay tuned to our update logs for information on the latest improvements.

-
-
-

What should I do if the AI assistant is not working properly?

-

If you encounter any issues with the AI assistant, please contact our support team for assistance. Provide details about the problem to help us resolve it quickly.

-
-
-

Is there a mobile app available for the AI assistant?

-

Currently, there is no dedicated mobile app, but our web application is mobile-friendly and can be accessed on various devices.

+
+
+

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.

+
+
+

How can I provide feedback about the AI assistant?

+

Feedback can be provided through our feedback form, available on our website. We appreciate your input and use it to improve the AI assistant's performance.

+
+
+

Can I customize the AI assistant's responses?

+

Customization options are limited in the current version, but we are working on features that will allow users to tailor responses to better suit their needs.

+
+
+

How frequently is the AI assistant updated?

+

The AI assistant is updated regularly to improve its functionality and incorporate new features. Stay tuned to our update logs for information on the latest improvements.

+
+
+

What should I do if the AI assistant is not working properly?

+

If you encounter any issues with the AI assistant, please contact our support team for assistance. Provide details about the problem to help us resolve it quickly.

+
+
+

Is there a mobile app available for the AI assistant?

+

Currently, there is no dedicated mobile app, but our web application is mobile-friendly and can be accessed on various devices.

+
-

How It Works

Getting started is simple! Download the app, set up your preferred AI models, and start chatting with your assistant. Whether you're working offline or connected to online platforms, Interstellar AI adapts to your needs.

@@ -87,11 +89,18 @@

Download Interstellar AI

Ready to enhance your AI experience? Get started by downloading Interstellar AI today!


- - Download Now +

Windows

+ Download for Windows +
+
+

GNU/Linux

+ Download for GNU/Linux +
+
+