Skip to content

My Portfolio added #7

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
257 changes: 257 additions & 0 deletions PORTFOLIO/Vignesh_G/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,257 @@
<!DOCTYPE html>
<html>

<head>
<meta name="description" content="Portfolio website of Vignesh G, Front End Web Developer &amp; Graphic designer.">
<meta name="keywords" content="Vignesh, Vignesh G, LeanBeast, Lean Beast, Web Developer, vg, Front End developer, Front End, vgbhai">

<title>Vignesh G</title>
<link rel="icon" type="image/png" href="https://i.ibb.co/ZXrVsCr/Leanbeast-favicon.png">
<link rel="apple-touch-icon" href="https://i.ibb.co/ZXrVsCr/Leanbeast-favicon.png">
<link rel="apple-touch-icon" sizes="72x72" href="https://i.ibb.co/ZXrVsCr/Leanbeast-favicon.png">
<link rel="apple-touch-icon" sizes="114x114" href="https://i.ibb.co/ZXrVsCr/Leanbeast-favicon.png">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css2?family=Courgette&family=Domine&family=Inter:wght@300;400&family=Mulish&family=Roboto&family=Rowdies:wght@300&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./style.css" type="text/css">

</head>


<body>
<!--Navbar-->

<nav class="navbar navbar-expand-lg navbar-light font-weight-bolder text-white d-flex justify-content-end fixed-top navbarcolor">

<!-- Navbar Button on Right, for it to work change below div class "navbar-expand" to "collapse navbar-collapse" -->
<!-- <button class="navbar-toggler " type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button> -->


<div class="navbar-expand" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto ">
<li class="nav-item active ">
<a class="nav-link border-right border-white-50 px-4 text-light " href="#">Home<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link border-right border-white-50 px-4 text-light" href="#about">About</a>
</li>

<li class="nav-item">
<a class="nav-link border-right border-white-50 px-4 text-light" href="#guide">Guides</a>
</li>

<li class="nav-item">

<a class="nav-link border-right border-white-50 px-4 text-light" href="#projects">Projects</a>
</li>

<li class="nav-item">
<a class="nav-link border-right border-white-50 px-4 text-light " href="#contact">Contact</a>
</li>

</ul>

</div>
</nav>
<div class="container-fluid my-5">&nbsp;</div>

<!--Photo Content-->

<div class="jumbotron jumbotron-fluid shadow p-3 mb-5 bg-white mt-5 jumbotronmod d-flex bd-highlight flex-row user-select-none">
<div class=" p-2 bd-highlight my-0">
<img class="mypic" src="https://i.ibb.co/gvtqM6b/20200125-202640-Edited.jpg" alt="20200125-202640-Edited"> </div>

<div class=" p-2 flex-column d-flex align-items-start bd-highlight ">
<div class="mb-auto p-2 bd-highlight ml-3">
<h1 class="fit_quote">&ldquo; Fitness is not a destination, Its a way of life . . &#33; &rdquo; </h1>
</div>
<!-- <div class="sep">&nbsp;</div> -->
<div class="d-flex flex-column p-2 bd-highlight ">
<h1 class="display-4 ml-3 mb-n2 bd-highlight myname">Vignesh G </h1>
<hr class="mb-2 ml-4 nameline shadow bg-white rounded ">
<div class="d-flex flex-row">
<p class="ml-4 myskills ">Front-End Web Developer &#124;&nbsp; Efficient Learner &#124;&nbsp; Graduate in Aeronautical Engineering &#124;</p>
</div>
</div>
<div id="about"></div>
</div>

</div>

<!--About Me-->

<h1 class="display-4 px-5 text-justify content_text user-select-none"><span class="doublequotes">&ldquo;</span>Hello, I am a self-taught web developer with proficiency in HTML, CSS and JavaScript with knowledge in front-end frameworks like Bootstrap, jQuery and continuing to learn Full Stack Web Development. Stepping out from graduation field and learning to code is really interesting and challenging. Besides of coding, I am a fitness lover and encourage home fitness. Here goes some of my interests: Photography notably macro clicks, Photo editing, Logo design, Creating fitness and health awarness.<span class="doublequotes">&rdquo;</span> </h1>

<div class="m-5" id="guide">&nbsp;</div>

<!-- Instructors-->

<div class="jumbotron jumbotron_instructors m-auto shadow rounded pt-2 user-select-none">
<h2 class="display-5 pb-1 text-center heading_text">Top three instructors for learning to code (in my view):</h2>

<div class="d-flex align-items-start">
<div class="card mb-n5 mx-3 d-flex flex-column bd-highlight " style="width: 18rem;">
<img src="https://i.ibb.co/H7hWCCL/Andrie-instructor.jpg" class="card-img-top p-2 bd-highlight cardimg" alt="Andrie-instructor">
<div class="card-body p-2 bd-highlight">
<h5 class="card-title text-center">Andrei Neagoie</h5>
<p class="card-text text-center">Senior Software Developer turned Instructor.</p>
<a href="https://www.udemy.com/user/andrei-neagoie/" target="_blank" class="btn btn-block btn-info mt-n1">Visit</a>
</div>
</div>

<div class="card mb-n5 mx-3 d-flex flex-column bd-highlight " style="width: 18rem;">
<img src="https://i.ibb.co/qnCvxKD/Rob-instructor.jpg" class="card-img-top p-2 bd-highlight cardimg" alt="Rob-instructor">
<div class="card-body p-2 bd-highlight">
<h5 class="card-title text-center">Rob Percival</h5>
<p class="card-text text-center">Web Developer And Teacher.<br>&nbsp;</p>
<a href="https://www.udemy.com/user/robpercival/" target="_blank" class="btn btn-block btn-info mt-n1">Visit</a>
</div>
</div>

<div class="card mb-n5 mx-3 d-flex flex-column bd-highlight " style="width: 18rem;">
<img src="https://i.ibb.co/QDQJ0d8/Andy-instructor.jpg" class="card-img-top p-2 bd-highlight cardimg" alt="Andy-instructor">
<div class="card-body p-2 bd-highlight">
<h5 class="card-title text-center">Andy Sterkowitz</h5>
<p class="card-text text-center">Self-Taught Software Developer, YouTuber.</p>
<a href="https://www.youtube.com/c/AndySterkowitz/featured" target="_blank" class="btn btn-block btn-info mt-n1">Visit</a>
</div>
</div>
</div>

</div>

<div class=" m-5">&nbsp;</div>

<!-- Helping hands-->

<div class="jumbotron jumbotron_helpinghands flex-column bg-white user-select-none ">

<div class="helping_hands shadow bg-white">
<div class="helping_tint">
<h1 class="display-4 text-center flex-column heading_text">Helping Hands</h1>
<p class="lead text-center flex-column content_text">Thank you helpers. There is no greater beauty than that of the mind that runs to help.</p>
</div>
<div class="flex-row d-flex justify-content-around">

<a href="https://praveen.science/" target="_blank"><img class="helping_handsimg1 mt-4" src="https://i.ibb.co/1XvX3nL/Helping-hand1.jpg" alt="Helping-hand1" border="0"></a>



<a href="https://www.linkedin.com/company/devscripts/" target="_blank"><img class="helping_handsimg2 mt-4 ml-3" src="https://i.ibb.co/MCDhyYk/Helping-hand2.png" alt="Helping-hand2" border="0"></a>

<a href="https://letsupgrade.in/" target="_blank"><img class="helping_handsimg3 mt-5" src="https://i.ibb.co/qsQ3W7P/Helping-hand3.png" alt="Helping-hand3" border="0"></a>
</div>

</div>


</div>

<div class=" mt-5" id="projects">&nbsp;</div>

<!-- Projects-->

<div class="mt-5 bg-none d-flex flex-row bd-highlight mb-3 user-select-none">
<img class="project_img p-2 bd-highlight mb-5" src="https://i.ibb.co/zPhQCy5/projector.png" alt="projector">
<h1 class="display-4 bd-highlight heading_text ml-2">Projects</h1>
</div>
<div class="project_bar user-select-none">
<div id="carouselExampleFade" class="carousel slide carousel-fade shadow-lg" data-ride="carousel">
<div class="carousel-inner">

<!-- Project 1 -->

<div class="carousel-item active" data-interval="8000">
<img src="https://i.ibb.co/ys1444b/Quote-gen-project.png" class="d-block w-100 " alt="black">
<div class="carousel-caption d-none d-md-block ">
<a href="https://vigneshg1616.github.io/Quote_Generator_Modified/" target="_blank" class="text-light">
<h5>Click Here</h5>
<p>Get inspirational quotes said by great personalities.</p></a>
</div>
</div>

<!-- Project 2 -->

<div class="carousel-item" data-interval="3000">
<img src="https://img.icons8.com/bubbles/500/000000/github.png" class="d-block w-100" alt="black1">
<div class="carousel-caption d-none d-md-block alert alert-success">
<a href="https://github.com/VigneshG1616?tab=repositories" target="_blank">
<h5>Github</h5>
<h5>Repositories</h5>
</a>
</div>
</div>

</div>
<a class="carousel-control-prev" href="#carouselExampleFade" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleFade" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>

<div class="m-5">&nbsp;</div>

<!--Get in touch-->

<div class="jumbotron jumbotron-fluid jumbotron_bottom d-flex justify-content-between" id="contact">

<div class="">

<ul class="list-unstyled ml-5 allow_selection">
<li>
<h1 class="display-4 ml-3 contact_text user-select-none">Get in touch</h1>
</li>
<li class="mt-3 ml-5 pl-5">
<img class="phone" src="https://img.icons8.com/ios-filled/50/000000/phone-message.png" alt="phone">
<span class="ml-2 pl-1">+91 9738434916 / 7760267416</span>
</li>
<li>&nbsp;</li>
<li class="ml-5 pl-5">
<img class="mail" src="https://img.icons8.com/metro/26/000000/email.png" alt="mail">
<span class="ml-3">vigneshg1616&#64;gmail.com</span>
</li>

<li>&nbsp;</li>
<li class="ml-5 pl-5">
<img class="location " src="https://img.icons8.com/ios-glyphs/30/000000/map.png" alt="location">
<span class="mt-3 ml-2 pl-1 user-select-none">Malleshwaram, Bangalore, India.</span>
</li>
</ul>
</div>


<div class="d-flex align-items-end">
<p class="text-secondary text-right mr-3 mb-1 user-select-none ">website by Vignesh.G</p>

</div>
<div class="icons d-flex align-items-end flex-column bd-highlight ">
<div class=" bd-highlight mr-5"> <a href="https://github.com/VigneshG1616" target="_blank"><img src="https://img.icons8.com/ios-glyphs/60/000000/github.png" alt="github-icon" border="0"></a>
<a href="https://www.linkedin.com/in/vignesh-g-0023aa116/" target="_blank"><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAABmJLR0QA/wD/AP+gvaeTAAADMUlEQVRoge2ay2sTQRyAv4qpIAFbo9VQwQfVinqv4KUK6kGQloLnHsSKNXoQsRfBkyc19W8QCt4FHwfFk6laH7eK+L5oi9g2CSrVxMMkJVl3JrO7M5M97Ae/S2Z29vftTnZnZwYSEhISEuJLh+X2NwOHgAFgN7ADyADpWnkJ+A68B2aBAvAI+Go5L6NkgHPAM6AaMp4CuVpbsWULMAmUCS/qjRKQB3oderQkBZwHipgT9UYZuAKscaMkpx94hT1Rb7wEdjkx82EEu3dVFkvAsAO/JkaB5QhJR40/wGnbknXGHAjpRs6yKyOIq9tu0cY7PWRLtg9YjIGkN4qIQY1ROtF7GleAj8AXx9IvEK9HY0xonPQ1zVf6ADDvUPqiKdlexIin1QkHfI4ddyhcBLImhCc1T5j2OfagQ+EqcD2qbAb9sfERn+MvOxYuEfGDIxfgZJ+Bo4gHXDdwBvjpWLgKnI0iHOYT728bJBtjOqxsFvGaaWfyYaICbJJJrVIIDxJsRqRDEjr19tbK7gEngK3AWmAdcAzR04LkMRig/go3CXZlZejU2wNcULSRAu4EyCXfSs6P+wFOEFVYZ5TUAyxo5nJX1oiqS/dpJGGKZY06c8CUZnvS3FXCXZqNm6ILuIqQ2iepI71zHrrDJPAbd10a4EFDnU+Ih5aXbZq5/Gqt9z8uhTf61DvsUy+tmYtUWNWlS4oy02zQ/K2s2V5RVqAS/qHZuAlk72svqp7UyIKsQCX8TrPxOPJWVqASnrWQiCveyApUwgULibjiiaxAJfwQ/f9MnKgCj2WFKuFvwHPj6dhnGpG7LyphgFtmc3GCMudWwlPov/viQBm4HbWRPPY+1k3HtaiyoD9N2+5YQmyxMMKlGAi1CtUEQmBSiOWMdkvJYgbDSy0Q78W0ftOydYaJ33LpcVuydU7FQLSKmI49adl1hVHav+VhzLaklyHEq8C17CIOurGMnbh9es/gdjbVl9WIjWk273Z9Y1qnGyU9ssANzI7KSog1X2MjKBtkEEuWBcItxlUQH/DjwHrTydnePtyD2AWwH7H/YztiSrZx+/A88IHm7cNzlvNKSEhISIgl/wC/xJHnCMHwKwAAAABJRU5ErkJggg=="></a>
<a href="https://www.facebook.com/vignesh.gopal.73/about" target="_blank"><img src="https://img.icons8.com/ios-glyphs/60/000000/facebook-new.png" alt="facebook-icon" border="0"></a>
<a href="https://twitter.com/VigneshGopal16" target="_blank"><img src="https://img.icons8.com/ios-glyphs/60/000000/twitter-circled.png" alt="twitter-icon" border="0"></a></div>
<div class=" mt-auto bd-highlight"> <a class="alert-light" href="https://icons8.com/icons" target="_blank">
<p class="alert-link mr-3 mb-1 user-select-none">Icons by&#58; Icons8</p>
</a></div>
</div>

</div>

<!--Scripts-->

<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>

<script>
window.scrollTo(0, 0);

</script>
</body>

</html>
Loading