You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
126 lines
6.6 KiB
HTML
126 lines
6.6 KiB
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<head>
|
|
|
|
<!-- Mobile Responsive Meta Tag -->
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
|
|
<!-- Bootstrap Link -->
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous"/>
|
|
|
|
<title>Developer Portfolio: Other Projects and Tools</title>
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<!-- Navbar Section Start -->
|
|
<div id="navbar" class="d-flex flex-row bg-primary text-white">
|
|
<div id="brand" class="mr-auto p-2">Ada Lovelace</div>
|
|
<div id="navlinks" class="d-flex flex-row p-2">
|
|
<div class="px-2">About Me</div>
|
|
<div class="px-2">Projects</div>
|
|
<div class="px-2">Tools</div>
|
|
</div>
|
|
</div>
|
|
<!-- Navbar Section End -->
|
|
|
|
<!-- Main Content Section Start -->
|
|
<div id="main" class="container-fluid p-4">
|
|
|
|
<h3>Other Projects</h3>
|
|
|
|
<!-- Other Projects Start -->
|
|
<div id="other-projects" class="row p-1 text-center d-flex flex-md-row-reverse">
|
|
|
|
<!-- HTML Card Start -->
|
|
<div class="col-12 col-md-4 p-4" id="html">
|
|
<img class="img-fluid" src="https://3.bp.blogspot.com/-7x5c_f1yzsQ/XHv9FZKHrEI/AAAAAAAADrE/4iGl9Lm6K2odX4SdWbU_RN6gZesx4IaGACEwYBhgL/s1600/html.jpg">
|
|
<h5>HTML</h5>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
|
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
|
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
|
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
|
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
|
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
|
</div>
|
|
<!-- HTML Card End -->
|
|
|
|
<!-- Bootstrap Card Start -->
|
|
<div class="col-12 col-md-4 p-4" id="bootstrap">
|
|
<img class="img-fluid" src="https://www.10bestdesign.com/blog/content/images/2018/03/14.png">
|
|
<h5>Bootstrap</h5>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
|
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
|
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
|
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
|
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
|
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
|
</div>
|
|
<!-- Bootstrap Card End -->
|
|
|
|
<!-- Node JS Server Card Start -->
|
|
<div class="col-12 col-md-4 p-4" id="nodejs">
|
|
<img class="img-fluid" src="https://clever-solution.com/wp-content/uploads/2020/04/5625%D0%9C%D0%BE%D0%BD%D1%82%D0%B0%D0%B6%D0%BD%D0%B0%D1%8F-%D0%BE%D0%B1%D0%BB%D0%B0%D1%81%D1%82%D1%8C-1-1280x720.png">
|
|
<h5>Node JS Server</h5>
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
|
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
|
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
|
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
|
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
|
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
|
|
</div>
|
|
<!-- Node JS Server Card End -->
|
|
|
|
</div>
|
|
<!-- Other Projects End -->
|
|
|
|
<!-- Tools Section Start -->
|
|
<div>
|
|
|
|
<!-- Core Tools Section Start -->
|
|
<h3 class="text-center mt-3">Core Tools</h3>
|
|
|
|
<div id="core-tools" class="d-flex flex-column">
|
|
<div id="html" class="d-flex justify-content-center align-items-center">
|
|
<img width="150" src="images/logo-html5.png"/>
|
|
</div>
|
|
<div id="css-js" class="d-flex justify-content-center align-items-center">
|
|
<img width="150" src="images/logo-css3.png"/>
|
|
<img width="150" src="images/logo-javascript.png"/>
|
|
</div>
|
|
</div>
|
|
<!-- Core Tools Section End -->
|
|
|
|
<!-- Other Tools Section Start -->
|
|
<h3 class="text-center mt-3">Other Tools</h3>
|
|
|
|
<div id="other-tools" class="d-md-flex flex-column">
|
|
<div id="tools-1" class="d-md-flex justify-content-center align-items-center">
|
|
<img width="150" src="images/logo-mongodb.png"/>
|
|
<img width="150" src="images/logo-nodejs.png"/>
|
|
<img width="150" src="images/logo-expressjs.png"/>
|
|
<img width="150" src="images/logo-react.png"/>
|
|
<img width="150" src="images/logo-heroku.png"/>
|
|
</div>
|
|
<div id="tools-2" class="d-md-flex justify-content-center align-items-center">
|
|
<img width="150" src="images/logo-git.png"/>
|
|
<img width="150" src="images/logo-sublime-text-3.png"/>
|
|
<img width="150" src="images/logo-postman.png"/>
|
|
<img width="150" src="images/logo-gitlab-ci-cd.png"/>
|
|
</div>
|
|
</div>
|
|
<!-- Other Tools Section End -->
|
|
|
|
</div>
|
|
<!-- Tools Section End -->
|
|
|
|
</div>
|
|
<!-- Main Content Section End -->
|
|
|
|
<!-- Bootstrap Script -->
|
|
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF" crossorigin="anonymous"></script>
|
|
<!-- End of Bootstrap Script -->
|
|
|
|
</body>
|
|
</html> |