Skip to content

Instantly share code, notes, and snippets.

@paulohp
Created April 30, 2016 12:28
Show Gist options
  • Save paulohp/6533736c5c529e7a42af2c9941684658 to your computer and use it in GitHub Desktop.
Save paulohp/6533736c5c529e7a42af2c9941684658 to your computer and use it in GitHub Desktop.
body {
background-color: #000;
color: #fff;
font-family: 'Open Sans','Helvetica Neue',helvetica,sans-serif;
font-size: 16px;
font-weight: normal;
height: 100%;
letter-spacing: 0;
margin: 0 auto 100px auto;
min-height: 500px;
text-align: center;
width: 962px;
}
.image {
width: 100%;
height: 100%;
}
#header {
height: 80px;
padding: 10px 0 0 0;
position: relative;
z-index: 499;
}
.top-image {
float: left;
top: 10px;
position: relative;
}
.top-title {
display: block;
float: left;
}
.random-button {
background-color: #93f;
background-repeat: no-repeat;
border: none;
box-sizing: border-box;
color: #fff;
display: block;
font-size: 14px;
font-weight: bold;
height: 40px;
line-height: 40px;
margin-right: : 5px;
padding: 0 40px;
position: relative;
text-align: center;
text-transform: uppercase;
vertical-align: top;
}
<!DOCTYPE html>
<html>
<head>
<title>Giphy App</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.34/browser.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fetch/0.11.0/fetch.min.js"></script>
<link rel="stylesheet" href="giphy.css">
</head>
<body>
<div id="header">
<h2 class="top-title">RANDOM</h2>
<img class="top-image" width="180" src="https://cldup.com/fz7d5A7JHT.png" alt="">
</div>
<main id="root"></section>
<script type="text/babel" src="app.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment