Skip to content

Instantly share code, notes, and snippets.

@hat

hat/index.html

Created January 31, 2017 04:14
Show Gist options
  • Save hat/c8fc0a6803665444ea87f1625b7cbf8c to your computer and use it in GitHub Desktop.
Save hat/c8fc0a6803665444ea87f1625b7cbf8c to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<head>
<!-- nav bar -->
<title>Portfolio</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="index.css">
<link rel="stylesheet" type="text/css" href="foundation.min.css">
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="foundation.min.js"></script>
<script type="text/javascript" src="portfolio.js"></script>
</head>
<body>
<!-- nav bar -->
<div id="header">
<div id="logo"><img src="http://res.cloudinary.com/mers/image/upload/c_scale,w_212/v1481725567/WEBSITE_LOGO_CODING_FINAL_uyme0h.jpg"/></div>
<div id="res_btn" onclick="show_hide_nav('navbar')" ><img src="http://res.cloudinary.com/mers/image/upload/v1484313990/Menu_website2_ixda7l.jpg"/></div>
<ul id="navbar">
<li><a href="#about">About</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div>
<!-- grid -->
<div class="parallax-container">
<div class="parallax"></div></div>
<br>
<div class="section-white">
<div class="row container">
<!-- content --> <!-- font -->
<div id="showgrid">
<!--desktop image -->
<a name="about"></a>
<center><img class="img-responsive" src=http://res.cloudinary.com/mers/image/upload/v1484306986/banner_website_gr9zsu.jpg alt="development. " > </h2></center> </div>
</div></div></div></div></div>
<div class="parallax-container">
<div class="parallax2"></div></div>
</div>
</div>
<!-- portfolio -->
<a name="portfolio"></a>
<section class="portfolio section" id="portfolio">
<div class="container content">
<div class="row">
<div class="small-12 columns">
<h1 style="font-family:cursive; color:#92999f; font-size: 30px;">Portfolio</h1>
<p></p>
</div>
<div class="small-12 medium-4 columns thumb">
<div class="card center-block">
<div class="front face"><img alt="..." src="http://res.cloudinary.com/mers/image/upload/c_scale,w_275/v1484657233/tech%20portfolio/noyce_website.jpg"></div>
<div class="back face center">
<h3>Portfolio Item 1 <p> HTML Tribute Website </p> </h3>
<p><button onclick="myFunction('http://codepen.io/mers89/full/vyEPZo/')">View</button>
</p>
</div>
</div>
</div>
<div class="small-12 medium-4 columns thumb">
<div class="card center-block">
<div class="front face"><img alt="..." src="http://res.cloudinary.com/mers/image/upload/c_scale,w_275/v1484657721/tech%20portfolio/fashion_portfolio.jpg"></div>
<div class="back face center">
<h3>Portfolio Item 2 <p> Website <p></h3>
<p><button onclick="myFunction('http://mercymanrique.wixsite.com/portfolio')">View</button>
</p>
</div>
</div>
</div>
<div class="small-12 medium-4 columns thumb">
<div class="card center-block">
<div class="front face"><img alt="..." src="http://res.cloudinary.com/mers/image/upload/c_scale,w_275/v1484657918/tech%20portfolio/fashion_blog.jpg"></div>
<div class="back face center">
<h3>Portfolio Item 3 <p> Blog <p></h3>
<p><button onclick="myFunction('https://stylenetwork.wordpress.com/')">View</button>
</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="small-12 medium-4 columns thumb">
<div class="card center-block">
<div class="front face"><img alt="..." src="http://res.cloudinary.com/mers/image/upload/c_scale,w_275/v1484658424/tech%20portfolio/game.jpg"></div>
<div class="back face center">
<h3>Portfolio Item 4<p> Brick Breaker Game </p></h3>
<p><button onclick="myFunction('https://www.tynker.com/play?p=58284eec65e4f241778b45b6&src=email&parentEmail=mercymanrique%40yahoo.com&childId=58284a8451684f96708b4567&childToken=93c29b027c0b2b48b76dee0d9d97ddbe#/')">View</button>
</p>
</div>
</div>
</div>
<div class="small-12 medium-4 columns thumb">
<div class="card center-block">
<div class="front face"><img alt="..." src="http://res.cloudinary.com/mers/image/upload/c_scale,w_275/v1484657722/tech%20portfolio/free_code_camp.jpg"></div>
<div class="back face center">
<h3>Portfolio Item 5 <p> School Work </p></h3>
<p><button onclick="myFunction('https://www.freecodecamp.com/mers89')">View</button>
</p>
</div>
</div>
</div>
<div class="small-12 medium-4 columns thumb">
<div class="card center-block">
<div class="front face"><img alt="..." src="http://res.cloudinary.com/mers/image/upload/c_scale,w_275/v1484658423/tech%20portfolio/cat_app.jpg"></div>
<div class="back face center">
<h3>Portfolio Item 6 <p> CatPhotoApp </p></h3>
<p><button onclick="myFunction('https://www.freecodecamp.com/challenges/line-up-form-elements-responsively-with-bootstrap')">View</button>
</p>
</div>
</div>
</div>
</div>
</div>
</section>
<div class="reveal-modal" data-reveal="" id="modal-1"></div>
<div class="row">
<div class="small-12 medium-4 columns thumb">
<div class="card center-block">
<div class="front face"></div>
<div class="back face center">
</p>
</div>
</div>
</div>
<div class="small-12 medium-4 columns thumb">
<div class="card center-block">
<div class="front face"><img alt="..." src="http://res.cloudinary.com/mers/image/upload/c_scale,w_275/v1484658428/tech%20portfolio/flappy_bird_game.jpg"></div>
<div class="back face center">
<h3>Portfolio Item 7<p> Flappy Bird Cell Phone Game </p></h3>
<p><button onclick="myFunction('https://studio.code.org/c/285311286/edit')">View</button>
</p>
</div>
</div>
</div>
<div class="small-12 medium-4 columns thumb">
<div class="card center-block">
<div class="front face">
</div>
</div>
</div>
</div>
</div>
</section>
<div class="reveal-modal" data-reveal="" id="modal-1"></div>
<a name="contact"></a>
<link href="css/custom.css" rel="stylesheet">
<footer class="footer-distributed">
<hr style="border-top: dotted 1px #848485;" />
<div class="footer-left">
<img src="http://res.cloudinary.com/mers/image/upload/c_scale,w_200/v1484327164/WEBSITE_LOGO_footer_CODING_FINAL_eqfg29.jpg"/>
<div class="footer-icons">
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
<a href="https://www.facebook.com/mercy.manrique" target="_blank"><i class="fa fa-facebook"></i></a>
<a href="https://www.linkedin.com/in/mercy-manrique-52173833" target="_blank"><i class="fa fa-linkedin"></i></a>
<a href="https://github.com/mers89" target="_blank"><i class="fa fa-github"></i></a>
</div>
</div>
<div class="footer-center">
<div>
<i class="fa fa-map-marker"></i>
<p> Los Angeles, CA</p>
</div>
<div>
<i class="fa fa-phone"></i>
<p>424.279.3897</p>
</div>
<div>
<i class="fa fa-envelope"></i>
<p><a href="mailto:[email protected]">[email protected]</a></p>
</div>
</div>
<div class="footer-right">
<p></p>
<p class="footer-company-about">
<span > About </span>
Providing aesthetically beautiful web design and software development.
</p>
</div>
</footer>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment