Changed Css And SOmething

app.py

@@ -6,6 +6,7 @@ import requests
 
 app = Flask(__name__)
 
+
 @app.route('/', methods=['GET', 'POST'])
 def home():
     if request.method == 'POST':
@@ -32,12 +33,18 @@ def home():
         webDevJs = "JavaScript Web Development" if web_javascript == 'True' else ""
         # print(f"Selected Web Development: {webDevPy}, {webDevJs}")
 
+        pyrogram = request.form.get('pyrogram', 'False')
+        ptb = request.form.get('python-telegram-bot', 'False')
+
+        pyGm = "Telegram Bot Using Pyrogram" if pyrogram == 'True' else ""
+        pyTgBot = "Telegram Bot Using Python-Telegram-bot" if ptb == 'True' else ""
+
       
         url = "https://api.forefront.ai/v1/chat/completions"
         apiKey = Config.API_KEY
 
 
-        Prompt = f"""From Now You Are A Tech Compnay Named 'AccioINTERN' Who Wanna Hire A Intern For {auto_Py, auto_Js, webDevPy, webDevJs} To Give InternShip With Proficiency Leval {proficiency}.
+        Prompt = f"""From Now You Are A Tech Compnay Named 'AccioINTERN' Who Wanna Hire A Intern For {auto_Py, auto_Js, webDevPy, webDevJs, pyGm, pyTgBot} To Give InternShip With Proficiency Leval {proficiency}.
         I'm {name},I Want Do That Internship.So Give Me A Project To Be Approved In Your Company.
         Company:GetInternt, Owner:TraxDinosaur, Contact:traxdinosaur.github.io and 
         How To Submit Project: First Goto https://s.id/AccioINTERN And Submit Your Github Username,
@@ -51,8 +58,8 @@ def home():
                     "content": Prompt
                 }
             ],
-            "max_tokens": 500,
-            "temperature": 0.5,
+            "max_tokens": 1000,
+            "temperature": 1,
         }
 
         headers = {

static/index.css

@@ -1,107 +1,152 @@
 * {
-    box-sizing: border-box;
     margin: 0;
     padding: 0;
-    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    box-sizing: border-box;
+    font-family: 'Helvetica Neue', Arial, sans-serif;
 }
 
 body {
-    background-color: #f3f4f6;
+    background-color: #f4f4f4;
+    color: #333;
+    line-height: 1.6;
+}
+
+header {
+    background-color: #333;
+    color: #fff;
+    padding: 1rem 0;
+    text-align: center;
+    font-size: 1.5rem;
+}
+
+nav {
     display: flex;
     justify-content: center;
-    align-items: center;
-    height: 100vh;
+    gap: 1rem;
+}
+
+main {
+    padding: 2rem;
+    max-width: 800px;
+    margin: 2rem auto;
+    background-color: #fff;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    border-radius: 8px;
 }
 
 .inter-form {
-    background-color: #ffffff;
-    border-radius: 10px;
-    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
-    padding: 30px;
-    width: 100%;
-    max-width: 500px;
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
 }
 
 .inter-form label {
     font-weight: bold;
-    margin-bottom: 10px;
-    display: block;
-    color: #333333;
+    margin-bottom: 0.5rem;
 }
 
 .inter-form input[type="text"] {
     width: 100%;
-    padding: 12px;
-    margin-bottom: 20px;
-    border: 1px solid #dddddd;
-    border-radius: 6px;
-    font-size: 16px;
+    padding: 0.75rem;
+    border: 1px solid #ccc;
+    border-radius: 5px;
     transition: border-color 0.3s ease;
 }
 
 .inter-form input[type="text"]:focus {
-    border-color: #007bff;
+    border-color: #333;
 }
 
 section {
-    margin-bottom: 20px;
+    margin-top: 1rem;
 }
 
-section h4 {
-    margin-bottom: 15px;
-    color: #333333;
-    border-bottom: 2px solid #dddddd;
-    padding-bottom: 5px;
+h4 {
+    margin-bottom: 1rem;
+    color: #333;
+    border-bottom: 1px solid #ccc;
+    padding-bottom: 0.5rem;
 }
 
 .checkbox-group {
     display: flex;
     flex-wrap: wrap;
-    gap: 10px;
+    gap: 1rem;
 }
 
-.checkbox-group input[type="checkbox"] {
-    margin-right: 10px;
+.checkbox-group input[type="checkbox"],
+.checkbox-group input[type="radio"] {
+    display: none;
 }
 
 .checkbox-group label {
     display: flex;
     align-items: center;
-    color: #555555;
+    color: #555;
     cursor: pointer;
+    justify-content: center;
+    flex-direction: column;
+    background-color: #f9f9f9;
+    padding: 1rem;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    transition: background-color 0.3s ease, border-color 0.3s ease;
+    width: 120px;
+    text-align: center;
 }
 
-button {
-    width: 100%;
-    padding: 15px;
-    background-color: #007bff;
+.checkbox-group input[type="checkbox"]:checked + label,
+.checkbox-group input[type="radio"]:checked + label {
+    background-color: #e0e0e0;
+    border-color: #333;
+}
+
+.checkbox-group label:hover {
+    background-color: #e9e9e9;
+    border-color: #bbb;
+}
+
+button[type="submit"] {
+    padding: 0.75rem 1.5rem;
     border: none;
-    border-radius: 6px;
-    color: white;
-    font-size: 18px;
+    border-radius: 5px;
+    background-color: #333;
+    color: #fff;
+    font-size: 1rem;
     cursor: pointer;
-    transition: background-color 0.3s ease;
+    transition: background-color 0.3s ease, transform 0.3s ease;
+    align-self: flex-start;
+}
+
+button[type="submit"]:hover {
+    background-color: #555;
+    transform: scale(1.05);
 }
 
-button:hover {
-    background-color: #0056b3;
+button[type="submit"]:active {
+    background-color: #222;
+    transform: scale(1);
 }
 
 .internship {
-    margin-top: 20px;
+    margin-top: 1rem;
+}
+
+.internship pre {
     background-color: #f9f9f9;
-    border: 1px solid #dddddd;
-    border-radius: 6px;
-    padding: 15px;
-    max-height: 300px;
-    overflow-y: auto;
+    padding: 1rem;
+    border: 1px solid #ccc;
+    border-radius: 5px;
     white-space: pre-wrap;
     word-wrap: break-word;
-    color: #333333;
+    max-height: 300px;
+    overflow-y: auto;
 }
 
-@media (max-width: 768px) {
-    .inter-form {
-        padding: 20px;
-    }
+footer {
+    background-color: #333;
+    color: #fff;
+    text-align: center;
+    padding: 1rem 0;
+    margin-top: 2rem;
 }

templates/index.html

@@ -1,56 +1,80 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="shortcut icon" href="AccioINTERN.png" type="image/x-icon">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
     <link rel="stylesheet" href="static/index.css">
     <title>AccioINTERN</title>
 </head>
+
 <body>
-    <form class="inter-form" action="/" method="post">
-
-        <label for="name">Name:</label>
-        <input type="text" id="name" name="name" required>
-
-        <section class="automation">
-            <h4>Automation</h4>
-            <div class="checkbox-group">
-                <input type="checkbox" name="auto-python" id="auto-python" value="True">
-                <label for="auto-python">Python</label>
-
-                <input type="checkbox" name="auto-javascript" id="auto-javascript" value="True">
-                <label for="auto-javascript">Javascript</label>
-            </div>
-        </section>
-        <section class="web-dev">
-            <h4>Web Development</h4>
-            <div class="checkbox-group">
-                <input type="checkbox" name="web-python" id="web-python" value="True">
-                <label for="web-python">Python</label>
-
-                <input type="checkbox" name="web-javascript" id="web-javascript" value="True">
-                <label for="web-javascript">Javascript</label>
-            </div>
-        </section>
-        <section class="proficiency">
-            <h4>Proficiency</h4>
-            <div class="checkbox-group">
-                <input type="radio" name="level" id="beginner" value="Beginner">
-                <label for="beginner">Beginner</label>
-
-                <input type="radio" name="level" id="intermediate" value="Intermediate">
-                <label for="intermediate">Intermediate</label>
-                
-                <input type="radio" name="level" id="expert" value="Expert">
-                <label for="expert">Expert</label>
-            </div>
-        </section>
-        <button type="submit">Get Internship</button>
-
-        <section class="internship">
-            <pre>{{ Result }}</pre>
-        </section>
-
-    </form>
+    <header>
+        <nav>
+
+        </nav>
+    </header>
+    <main>
+        <form class="inter-form" action="/" method="post">
+
+            <label for="name">Name:</label>
+            <input type="text" id="name" name="name" required>
+
+            <section class="automation">
+                <h4>Automation</h4>
+                <div class="checkbox-group">
+                    <input type="checkbox" name="auto-python" id="auto-python" value="True">
+                    <label for="auto-python"><i class="fa-brands fa-python" style="color: #74C0FC;"></i>Python</label>
+
+                    <input type="checkbox" name="auto-javascript" id="auto-javascript" value="True">
+                    <label for="auto-javascript"><i class="fa-brands fa-js" style="color: #FFD43B;"></i>Javascript</label>
+                </div>
+            </section>
+            <section class="web-dev">
+                <h4>Web Development</h4>
+                <div class="checkbox-group">
+                    <input type="checkbox" name="web-python" id="web-python" value="True">
+                    <label for="web-python"><i class="fa-brands fa-python" style="color: #FFD43B;"></i>Python</label>
+
+                    <input type="checkbox" name="web-javascript" id="web-javascript" value="True">
+                    <label for="web-javascript"><i class="fa-brands fa-js" style="color: #74C0FC"></i>Javascript</label>
+                </div>
+            </section>
+            <section class="bot-dev">
+                <h4>Telegram Bot Development</h4>
+                <div class="checkbox-group">
+                    <input type="checkbox" name="pyrogram" id="pyrogram" value="True">
+                    <label for="pyrogram"><i class="fa-solid fa-fire" style="color: #ff8040;"></i>Pyrogram</label>
+
+                    <input type="checkbox" name="python-telegram-bot" id="python-telegram-bot" value="True">
+                    <label for="python-telegram-bot"><i class="fa-brands fa-telegram" style="color: #74C0FC;"></i>PyTgBot</label>
+                </div>
+            </section>
+            <section class="proficiency">
+                <h4>Proficiency</h4>
+                <div class="checkbox-group">
+                    <input type="radio" name="level" id="beginner" value="Beginner">
+                    <label for="beginner">Beginner</label>
+
+                    <input type="radio" name="level" id="intermediate" value="Intermediate">
+                    <label for="intermediate">Intermediate</label>
+
+                    <input type="radio" name="level" id="expert" value="Expert">
+                    <label for="expert">Expert</label>
+                </div>
+            </section>
+            <button type="submit">Get Internship</button>
+
+            <section class="internship">
+                <pre>{{ Result }}</pre>
+            </section>
+        </form>
+    </main>
+    <footer>
+    <!-- <p>&copy; 2024 TraxDinosaur. All rights reserved.</p> -->
+    </footer>
 </body>
-</html>
+
+</html>