KIIT-DU-BHUBANESWAR · dangolprasanna · Feb 6, 2021 · Feb 6, 2021
diff --git a/prasanna/bars-solid.svg b/prasanna/bars-solid.svg
diff --git a/prasanna/design.css b/prasanna/design.css
@@ -0,0 +1,82 @@
+#navimg{
+    width: 1cm;
+    position: absolute;
+    right: 1cm;
+    top: 10px;
+}
+
+img:hover{
+    transform: scale(1.5);
+}
+
+.name{
+    text-align: center;
+    font-family: Georgia, 'Times New Roman', Times, serif;
+}
+
+#nmargins{
+    padding: 15%;
+    background: rgb(2,0,36);
+    background: linear-gradient(150deg, rgba(2,0,36,1) 0%, rgba(51,51,148,1) 24%, rgba(6,75,164,1) 49%, rgba(39,51,61,1) 75%, rgba(0,212,255,1) 100%);
+    border: 2cm;
+}
+
+.grey{
+    background: rgb(174,202,238);
+    background: radial-gradient(circle, rgba(174,202,238,1) 0%, rgba(115,130,148,1) 100%);
+}
+
+h2{
+    text-decoration-line: underline;
+}
+p{
+    text-align: center;
+}
+
+.nongrey{
+    background: ;
+    background: linear-gradient(90deg, rgba(174,202,238,1) 0%, rgba(124,156,192,1) 73%, rgba(24,111,214,1) 100%);
+}
+
+.border{
+    border: 1cm;
+    border-radius: 5%;
+}
+
+section{
+    text-align: center;
+}
+
+#foot{
+    background-color: rgb(17, 16, 27);
+}
+ .contact{
+     text-align: center;
+     color:darkgray;
+     padding: 20px;
+ }
+.contact a{
+    color: darkgray;
+    text-decoration: none;
+    padding: 20px;
+    text-align: center;
+}
+
+.contact h4{
+    line-height: 1.3;
+    padding: 10px;
+}
+
+.copy{
+    padding: 20px;
+    color: darkgray;
+    font-size: 1.1rem;
+    text-align: left;
+}
+.crafted{
+    padding: 20px;
+    color: darkgray;
+    font-size: 1.1rem;
+    text-align: right;
+}
+
diff --git a/prasanna/index.html b/prasanna/index.html
@@ -0,0 +1,140 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <link rel="stylesheet" href="design.css" type="text/css">  
+        <link rel="preconnect" href="https://fonts.gstatic.com">
+        <link href="https://fonts.googleapis.com/css2?family=Satisfy&display=swap" rel="stylesheet"> 
+        <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
+
+    </head>
+    <body>
+       <div style="color: blanchedalmond;"" class="name" id="nmargins">
+            <img id="navimg" src="bars-solid.svg" alt="nav">
+
+             <div class="spinner-grow" role="status">
+                <span class="visually-hidden">Loading...</span>
+            </div>
+            <h1>Hi! I'm Prasanna</h1>
+            <h5>just a coder.</h5>
+            <br>
+            <button type="button" class="btn btn-primary">Hire me →</button>
+       </div>
+
+       <div class="name grey">
+           <br>
+        <h2>Nice to have you here!</h2>
+        <br>
+        <p>
+            Are You looking for a fast-performing and user-friendly website to represent your product or business?<br>
+             perhaps you are looking for any kind of consultation?<br> 
+             or maybe you have an idea you'd like to express but need a professional with vision in order to actually create it?<br> 
+             maybe you'd like to collaborate? moreover, feel free to reach out to me with some advice, <br>
+             I'd love to hear some constructive criticism<br>
+        about any of my project.    <br>
+        </p>
+        <button type="button" class="btn btn-secondary">Say Hello →</button>
+        <br>
+        <br>
+       </div>
+       <div class="nongrey name">
+           <br>
+            <h2>
+                My Skillset
+            </h2>
+            <p>
+                I have a diverse set of skills from design to Semantic and well<br>
+                structured HTML + reasonable and efficient CSS along with Sass,
+                <br>
+                BEM and 7.1 pattern for scss organization JS (ES6 - ESX, ESLint
+                <br>
+                for linting J5, Babel for transpiling)+ React ( for building complex
+                <br>
+                Uls) Redux ( for state management) module bundlers like +] Webpack and Parcel <br>
+                I love things that are open source I use VS
+                <br>
+                Code as my editor and Ubuntu as My operating system.<br>
+            </p>
+            <button type="button" class="btn btn-secondary">My Work →</button>
+            <br>
+            <br>
+       </div>
+       <div class="grey name"> 
+           <br>
+           <h2>
+               About Me.
+           </h2>
+           <p>
+            I am a self-taught Frontend Web Developer from Kathmandu, Nepal. About a years ago is <br>
+            when I started my learning journey on how to make the web stunning and responsive. <br>
+            I have always been a curious individual, which is why i'd love to collaborate <br>
+            and do some real world projects in order to flourish my skills.I'm not perfect,<br>
+             however I'm very far from perfection, yet Im resilient, assertive and stubborn and <br>
+             I find learning fascinating process am currently learning about PWAs and my future<br>
+              plan is to learn about ML for Web Development.<br>
+           </p>
+           <br>
+           <br>
+
+       </div>
+       <section class="nongrey name">
+           <br>
+        <h2>My Craft in a Nutshell</h2>
+
+        <br>
+        <p>
+            I love simplicity so I try my best to make things as simple as possible <br>
+            I'm aslo very concerned about best practices and always sacrifice <br>
+            developer experience over user experience.
+        </p>
+
+        <div>
+            <img style="width:50px;" src="data:image/png;base64,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" alt="">
+            <br>
+            <h3>Front-End</h3>
+            <p>
+                I value simple content structure, clean design <br>
+                patterns and throughtful interactions filled with <br>
+                semantics and performance. I tend to code things <br>
+                from scratch and enjoy bringing ideas to life. 
+            </p>
+        </div>
+        <br>
+
+
+    </section>
+
+    <section class="name grey">
+        <br>
+        <h2>My Work</h2>
+
+        <br>
+        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sint dolorum id error ea <br>
+             dolores magni natus suscipit optio asperiores et nesciunt commodi vero velit pariatur eius, <br>
+              sequi rem nihil, veniam accusamus corporis numquam quis facere! Aperiam sint reprehenderit <br>
+               voluptates cum nobis id laborum corrupti est accusamus. Quo consequuntur fugiat cupiditate. <br>
+               (Work In Progress)
+        </p>
+
+        <img style="width:100px;" src="https://www.clipartmax.com/png/middle/265-2655834_work-in-progress-icon.png" alt="">
+
+        <br>
+     <button type="button" class="btn btn-secondary">Hire me →</button>
+    <hr>
+    </section>
+
+    <footer id="foot">
+         <div class="contact">
+         <a href="https://www.facebook.com/dangolprasanna">Facebook</a>
+         <a href="https://www.instagram.com/dangolprasanna/">Instagram</a>
+         <h4>9840807275 <br>
+        [email protected]</h4>
+         </div>
+       <div>
+           <p class="copy">&copy;2021 All rights reserved</p>
+       <p class="crafted">
+        Crafted within Kathmandu by Prasanna
+       </p>   
+    </div>
+    </footer>
+    </body>
+</html>