Created
August 23, 2018 11:22
-
-
Save joel-extremo/4b7ac2360c5c7efc996734ece49c8a20 to your computer and use it in GitHub Desktop.
1.9: Responsive Web Design
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<title>Portfolio</title> | |
<link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico"/> | |
<!-- Bootstrap core CSS --> | |
<link rel="stylesheet" href="css/bootstrap.min.css"> | |
<link rel="stylesheet" href="css/animate.css"> | |
<link rel="stylesheet" href="css/styles.css"> | |
<link rel="stylesheet" type="text/css" href="css/nav.css"> | |
</head> | |
<body> | |
<nav class="navbar-expand-lg fixed-top"> | |
<section id="logo" class="left"> | |
<a href="index.html">CareerFoundry</a> | |
</section><!-- end left nav --> | |
<section id="links" class="right"> | |
<a href="about.html">About</a> | |
<a href="contact.html">Contact</a> | |
<a href="faq.html">FAQ</a> | |
</section><!-- end right nav --> | |
</nav><!-- end nav --> | |
<section id="heroCarousel" class="carousel slide" data-ride="carousel"> | |
<ol class="carousel-indicators"> | |
<li data-target="#heroCarousel" data-slide-to="0" class="active"></li> | |
<li data-target="#heroCarousel" data-slide-to="1"></li> | |
<li data-target="#heroCarousel" data-slide-to="2"></li> | |
</ol> | |
<div class="carousel-inner"> | |
<div class="carousel-item active"> | |
<img class="d-block w-100" src="img/carousel/carousel1.jpg" alt="First slide"> | |
<div class="carousel-caption d-none d-md-block"> | |
<h5>Here is an example 1 headline</h5> | |
<p>Here is an example description</p> | |
</div> | |
</div> | |
<div class="carousel-item"> | |
<img class="d-block w-100" src="img/carousel/carousel2.jpg" alt="Second slide"> | |
<div class="carousel-caption d-none d-md-block"> | |
<h5>Here is an example 2 headline</h5> | |
<p>Here is an example description</p> | |
</div> | |
</div> | |
<div class="carousel-item"> | |
<img class="d-block w-100" src="img/carousel/carousel3.jpg" alt="Third slide"> | |
<div class="carousel-caption d-none d-md-block"> | |
<h5>Here is an example 3 headline</h5> | |
<p>Here is an example description</p> | |
</div> | |
</div> | |
</div> | |
<a class="carousel-control-prev" href="#heroCarousel" 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="#heroCarousel" role="button" data-slide="next"> | |
<span class="carousel-control-next-icon" aria-hidden="true"></span> | |
<span class="sr-only">Next</span> | |
</a> | |
</section><!-- end carousel --> | |
<!-- Three Column Grid --> | |
<section class="container"> | |
<div class="row"> | |
<div class="col-sm animated fadeInDown"> | |
<h2>Portfolio Concept</h2> | |
<p>I've worked in some interesting proyect in my carrer. I stared in a IT consulting called <a href="http://www.emcomputersolutions.com/" target="_blank" >E&M Computer Solutions</a> when I was at college. Then I moved to the company <a href="https://www.facebook.com/ViralRich/" target="_blank" >Viral Rich</a>, there we developed <a href="https://cpa.cash/" target="_blank" >CPA Cash</a> a platform that monitize social network traffic. While I was in Viral Rich, me and a group of friends develop a project called <a href="http://parkngo.com.do/" target="_blank" >Park'nGo</a>, consist in software and harware focused of parking lot using Internet Of Things. Finally i'm actually working in <a href="https://www.linkedin.com/company/pitech-srl-do" target="_blank" >Pitech S.R.L.</a>, we are developing an education software focused in Dominican Republic called <a href="http://okus.com.do/" target="_blank" >Okus</a>.</p> | |
</div> | |
<div class="col-sm animated fadeInDown"> | |
<h2>Project Goals</h2> | |
<p>I want to improve my frontend skills, learn the best practice of software development<b>(team work, deploy and the best way to add new features to a finished project)</b>. I will try to invest at leat 20 hour per week and I'll do my best.</p> | |
</div> | |
<div class="col-sm animated fadeInDown"> | |
<h2>Course Goals.</h2> | |
<p>I want to get advanced skill in software development and get hired in a company that challenge me in a way to improve my skills in solve problems and software development.</p> | |
</div> | |
</div> | |
</section> | |
<div class="container"> | |
<section id="work" > | |
<h1 class="text-center">Work</h1> | |
<div class="row" > | |
<div class="col-md-3 col-sm-6 col-xm-12"><img src="img/portfolio1.png" class="img-fluid"></div> | |
<div class="col-md-3 col-sm-6 col-xm-12"><img src="img/portfolio1.png" class="img-fluid"></div> | |
<div class="col-md-3 col-sm-6 col-xm-12"><img src="img/portfolio1.png" class="img-fluid"></div> | |
<div class="col-md-3 col-sm-6 col-xm-12"><img src="img/portfolio1.png" class="img-fluid"></div> | |
<div class="col-md-3 col-sm-6 col-xm-12"><img src="img/portfolio1.png" class="img-fluid"></div> | |
<div class="col-md-3 col-sm-6 col-xm-12"><img src="img/portfolio1.png" class="img-fluid"></div> | |
<div class="col-md-3 col-sm-6 col-xm-12"><img src="img/portfolio1.png" class="img-fluid"></div> | |
<div class="col-md-3 col-sm-6 col-xm-12"><img src="img/portfolio1.png" class="img-fluid"></div> | |
</div> | |
</section><!-- end work --> | |
</div><!-- end container --> | |
<!-- Javascript --> | |
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" crossorigin="anonymous"></script> | |
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous"></script> | |
<script type="text/javascript" src="js/main.js"></script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment