V1

adithya.py

@@ -7,4 +7,4 @@ def make_shell_context():
 
 
 if __name__=='__main__':
-    app.run(debug=True)
+    app.run()

app/static/css/tailwind.css

@@ -543,6 +543,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   position: sticky;
 }
 
+.bottom-0 {
+  bottom: 0px;
+}
+
 .col-auto {
   grid-column: auto;
 }
@@ -576,10 +580,26 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-bottom: 0.5rem;
 }
 
+.mb-0 {
+  margin-bottom: 0px;
+}
+
+.mt-5 {
+  margin-top: 1.25rem;
+}
+
 .mt-32 {
   margin-top: 8rem;
 }
 
+.mt-48 {
+  margin-top: 12rem;
+}
+
+.mb-48 {
+  margin-bottom: 12rem;
+}
+
 .mt-16 {
   margin-top: 4rem;
 }
@@ -596,18 +616,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-left: 1rem;
 }
 
-.mt-48 {
-  margin-top: 12rem;
-}
-
 .mb-10 {
   margin-bottom: 2.5rem;
 }
 
-.mt-5 {
-  margin-top: 1.25rem;
-}
-
 .mt-24 {
   margin-top: 6rem;
 }
@@ -648,6 +660,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-left: 0.5rem;
 }
 
+.mb-auto {
+  margin-bottom: auto;
+}
+
 .block {
   display: block;
 }
@@ -684,6 +700,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   aspect-ratio: auto;
 }
 
+.h-screen {
+  height: 100vh;
+}
+
 .h-auto {
   height: auto;
 }
@@ -708,10 +728,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   width: 2.5rem;
 }
 
-.w-3\/4 {
-  width: 75%;
-}
-
 .w-96 {
   width: 24rem;
 }
@@ -724,6 +740,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   flex-shrink: 1;
 }
 
+.flex-grow {
+  flex-grow: 1;
+}
+
 .grow {
   flex-grow: 1;
 }
@@ -890,6 +910,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(88 28 135 / var(--tw-bg-opacity));
 }
 
+.bg-purple-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(168 85 247 / var(--tw-bg-opacity));
+}
+
 .bg-emerald-300 {
   --tw-bg-opacity: 1;
   background-color: rgb(110 231 183 / var(--tw-bg-opacity));
@@ -900,11 +925,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(5 150 105 / var(--tw-bg-opacity));
 }
 
-.bg-purple-500 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(168 85 247 / var(--tw-bg-opacity));
-}
-
 .bg-purple-300 {
   --tw-bg-opacity: 1;
   background-color: rgb(216 180 254 / var(--tw-bg-opacity));
@@ -931,6 +951,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding: 0.5rem;
 }
 
+.p-10 {
+  padding: 2.5rem;
+}
+
 .p-3 {
   padding: 0.75rem;
 }
@@ -939,14 +963,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding: 1.5rem;
 }
 
-.p-10 {
-  padding: 2.5rem;
-}
-
-.p-1 {
-  padding: 0.25rem;
-}
-
 .py-6 {
   padding-top: 1.5rem;
   padding-bottom: 1.5rem;
@@ -1001,6 +1017,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   vertical-align: middle;
 }
 
+.align-bottom {
+  vertical-align: bottom;
+}
+
 .font-\[\'Poppins\'\] {
   font-family: 'Poppins';
 }
@@ -1010,31 +1030,31 @@ Ensure the default browser behavior of the `hidden` attribute.
   line-height: 1.75rem;
 }
 
-.text-5xl {
-  font-size: 3rem;
-  line-height: 1;
-}
-
 .text-3xl {
   font-size: 1.875rem;
   line-height: 2.25rem;
 }
 
+.text-5xl {
+  font-size: 3rem;
+  line-height: 1;
+}
+
 .text-2xl {
   font-size: 1.5rem;
   line-height: 2rem;
 }
 
-.text-sm {
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-}
-
 .text-xs {
   font-size: 0.75rem;
   line-height: 1rem;
 }
 
+.text-sm {
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+}
+
 .font-semibold {
   font-weight: 600;
 }
@@ -1062,14 +1082,14 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(126 34 206 / var(--tw-text-opacity));
 }
 
-.text-slate-400 {
+.text-emerald-700 {
   --tw-text-opacity: 1;
-  color: rgb(148 163 184 / var(--tw-text-opacity));
+  color: rgb(4 120 87 / var(--tw-text-opacity));
 }
 
-.text-emerald-700 {
+.text-red-500 {
   --tw-text-opacity: 1;
-  color: rgb(4 120 87 / var(--tw-text-opacity));
+  color: rgb(239 68 68 / var(--tw-text-opacity));
 }
 
 .text-purple-800 {
@@ -1092,9 +1112,14 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(127 29 29 / var(--tw-text-opacity));
 }
 
-.underline {
-  -webkit-text-decoration-line: underline;
-          text-decoration-line: underline;
+.text-emerald-300 {
+  --tw-text-opacity: 1;
+  color: rgb(110 231 183 / var(--tw-text-opacity));
+}
+
+.text-purple-300 {
+  --tw-text-opacity: 1;
+  color: rgb(216 180 254 / var(--tw-text-opacity));
 }
 
 .shadow-md {
@@ -1200,6 +1225,10 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin: 0.5rem;
   }
 
+  .sm\:hidden {
+    display: none;
+  }
+
   .sm\:columns-2 {
     -moz-columns: 2;
          columns: 2;
@@ -1213,6 +1242,11 @@ Ensure the default browser behavior of the `hidden` attribute.
     font-size: 1.875rem;
     line-height: 2.25rem;
   }
+
+  .sm\:text-lg {
+    font-size: 1.125rem;
+    line-height: 1.75rem;
+  }
 }
 
 @media (min-width: 768px) {
@@ -1241,6 +1275,10 @@ Ensure the default browser behavior of the `hidden` attribute.
     width: 75%;
   }
 
+  .md\:flex-row {
+    flex-direction: row;
+  }
+
   .md\:flex-nowrap {
     flex-wrap: nowrap;
   }

app/templates/base.html

@@ -9,11 +9,17 @@
     <link rel="preconnect" href="https://fonts.googleapis.com"> 
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> 
     <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap" rel="stylesheet">
+
+    <style>
+        html { 
+        scroll-behavior: smooth; 
+    }
+    </style>
     {% block styles %}
     {% endblock %}
 </head>
 
-<body class="bg-zinc-900 font-['Poppins'] pb-12" >
+<body class="bg-zinc-900 font-['Poppins'] pb-12 flex flex-col h-screen" >
     {% if current_user.is_authenticated %}
     <div class="text-white bg-green-500 text-center p-5">
        <a href="{{url_for('auth.logout')}}">SuperAdmin Mode</a>
@@ -24,10 +30,10 @@
             <a href="{{url_for('home')}}"><div class=" md:text-4xl sm:text-3xl font-semibold text-white"> <span class="text-purple-700 hover:text-white" >adithya</span>.<span class="hover:text-purple-700" >narayan</span></div></a>
 
             <div class="hidden text-white md:flex space-x-12 items-center" >
-                <a href="#home" class="text-slate-400">Home</a>
-                <a href="#experience">Experience</a>
-                <a href="projects">Projects</a>
-                <a href="#"> <button class="rounded-full px-6 py-2 font-bold hover:bg-purple-400 bg-purple-900" >Resume</button></a>
+                <a href="#home" class="">Home</a>
+                <a href="#TechStack">TechStack</a>
+                <a href="#bot">Bot</a>
+                <a href="{{url_for('static',filename='files/adithya.pdf')}}" download> <button class="rounded-full px-6 py-2 font-bold hover:bg-purple-400 bg-purple-900" >Resume</button></a>
             </div>
             <div class="md:hidden hover:bg-fuchsia-600 p-2 rounded-full">
                 <svg width="26" height="18" viewBox="0 0 26 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13 17.5H0.25V14.6667H13V17.5ZM25.75 10.4167H0.25V7.58333H25.75V10.4167ZM25.75 3.33333H13V0.5H25.75V3.33333Z" fill="white"/></svg>
@@ -38,5 +44,14 @@
     {% block body %}
 
     {% endblock %}
+    <h1 class="text-center text-purple-300">Projects, Experiences, Bot Coming Soon....</h1>
+    <footer class="bg-purple-500 flex flex-col md:flex-row text-center text-emerald-300 bottom-0 mt-5 p-10 justify-between " >
+        <a href="https://github.com/NarayanAdithya"><h1 class="font-bold sm:text-lg text-md" >GitHub</h1></a>
+        <a href="https://www.linkedin.com/in/adithya-narayan-3747081a3/"><h1 class="font-bold sm:text-lg text-md" >LinkedIn</h1></a>
+        <a href="mailto:[email protected]"><h1 class="font-bold sm:text-lg text-md" >Mail</h1></a>
+        <!-- <h1 class="font-bold sm:text-lg text-md" >LeetCode</h1>
+        <h1 class="font-bold sm:text-lg text-md" >CodeChef</h1> -->
+    </footer>
+
 </body>
 </html>

app/templates/index.html

@@ -19,7 +19,10 @@
 {% endblock %}
 
 {% block body %}
-    <div class="container mt-16 flex justify-between items-center mx-auto w-full md:px-14 lg:px-24 px-8">
+    <div id="warning" class="visible sm:hidden container mt-48 mb-48 text-3xl font-bold text-red-500 text-center mx-auto w-full md:px-14 lg:px-24 px-8 hover:underline hover:text-purple-600 hover:decoration-wavy hover:decoration-purple-600">
+        <h3>Open the Website On Your Laptop For All Features</h3>
+    </div>
+    <div id="home" class="container mt-16 flex justify-between items-center mx-auto w-full md:px-14 lg:px-24 px-8">
         <div class="flex flex-wrap md:flex-nowrap">
             <div class="flex flex-wrap lg:ml-20 justify-center md:justify-start max-w-xl mt-0 md:my-36">
                 <h1 class="font-bold text-5xl md:text-6xl lg:text-7xl text-center text-white md:text-left"> <span class="text-purple-800" >D</span><span class="hover:text-purple-600" >eterminant</span>  <br> <span class="text-purple-800" >S</span><span class="hover:text-purple-600" >tressed</span> <br> <span class="text-purple-800" >M</span><span class="hover:text-purple-600" >eticulous</span><br><span class="text-purple-800" >W</span><span class="hover:text-purple-600" >illing</span></h1>
@@ -29,12 +32,10 @@ <h1 class="font-bold text-5xl md:text-6xl lg:text-7xl text-center text-white md:
         </div>
     </div>
 
-    <div  class="  container mt-48 mb-10 text-3xl font-bold text-white text-center mx-auto w-full md:px-14 lg:px-24 px-8 hover:underline hover:text-purple-600 hover:decoration-wavy hover:decoration-purple-600">
+    <div id="TechStack" class="  container mt-48 mb-10 text-3xl font-bold text-white text-center mx-auto w-full md:px-14 lg:px-24 px-8 hover:underline hover:text-purple-600 hover:decoration-wavy hover:decoration-purple-600">
         <h3>Tech Stack</h3>
     </div>
     <div class="container border-4 border-fuchsia-300 rounded-md  mx-auto w-full md:px-14 lg:px-24 px-8" >
-
-        <h4 class="container text-center mt-5 text-white font-bold underline text-2xl" >DSA</h4>
         <div class="mx-4 my-5 gap-8 h-auto  p-2 columns-1 sm:columns-2 lg:columns-3 space-y-8  ">
             {% if techstack %}
             {% for i in techstack %}
@@ -52,8 +53,8 @@ <h1 class="text-center text-2xl text-purple-100  font-bold">{{i.name}}</h1>
 
         </div>
 
-        <div class="container rounded-md mt-24 mb-24 p-10 mx-auto border-purple-400 border-4 bg-purple-300 bg-opacity-25  w-full md:w-3/4  " >
-            <h3 class="text-center text-2xl text-white" >Adi Bot</h3>
+        <div id="bot" class="container rounded-md mt-24 mb-24 p-10 mx-auto border-purple-400 border-4 bg-purple-300 bg-opacity-25  w-full md:w-3/4  " >
+            <h3 class="text-center text-2xl text-white" >Adi Bot - <span class="text-red-500" >Coming Soon</span></h3>
             <div id="user_message" class=" rounded-md grid grid-cols-1 bg-purple-700 p-2 sm:p-5 bg-opacity-75 overflow-auto max-h-96  ">
                 <div  class=" justify-self-start bot_message sm:m-2 bg-emerald-600 w-1/2 rounded-md p-2" >
                     <h6 class="text-md" ><u>Adi Bot</u></h6>
@@ -73,12 +74,17 @@ <h6 class="text-md" ><u>You</u></h6>
                 </div>
             </div>
             <div class="text-center mt-3" >
-                <input type="text" class="rounded-full m-2 p-2 text-center" id="message" placeholder="Enter Message" size="20" name="message" id=""> <button onclick="add_user_message()" class="rounded-full px-4 py-2 border-2 border-emerald-300 bg-emerald-600" >Send</button>
+                <input type="text" class="rounded-full m-2 p-2 text-center" id="message" placeholder="Enter Message" size="20" name="message" id=""> <button onclick="add_user_message()" class="rounded-full px-4 py-2 border-2 border-emerald-300 bg-emerald-600" disabled>Send</button>
             </div>
 
         </div>
+
         <script>
-
+            function remove_warning()
+            {
+                document.getElementById('warning').innerHTML='';
+            }
+            setTimeout(remove_warning,5000)
             function add_user_message()
             {
                 var message=document.getElementById('message').value;