Created
January 15, 2019 00:50
-
-
Save sorie/746ece7fedd2fa05f17671e227a17112 to your computer and use it in GitHub Desktop.
JS Bin // source https://jsbin.com/wotumud
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> | |
<head> | |
<meta charset="utf-8"> | |
<meta name="viewport" content="width=device-width"> | |
<title>JS Bin</title> | |
<style id="jsbin-css"> | |
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300); | |
body { | |
height: 100vh; | |
display: flex; | |
flex-flow: row wrap; | |
justify-content: center; | |
align-items: center; | |
line-height: 1.8; | |
margin: 0; | |
padding: 0 40px; | |
background-image: linear-gradient(135deg,#eee 0%,rgba(0,0,0,0.2) 100%); | |
} | |
.text { | |
color: rgba(35,35,35,0.8); | |
font-size: 3em; | |
font-family: "Open Sans", sans-serif; | |
font-style: normal; | |
} | |
a { | |
text-decoration: none; | |
border-bottom: 2px solid #ef8b80; | |
box-shadow: inset 0 -4px 0 #ef8b80; | |
color: inherit; | |
transition: background 0.1s cubic-bezier(.33,.66,.66,1); | |
} | |
a:hover { | |
background: #ef8b80; | |
} | |
</style> | |
</head> | |
<body> | |
<div class="text">Chew on cable. <a href="#">Attack feet</a> flop over, so if it fits, i sits or all of a sudden <a href="#">cat goes crazy.</a> Sleep in the bathroom sink if it fits, i sits <a href="#">give attitude</a>, stick butt in face all of a sudden cat goes crazy.</div> | |
<script id="jsbin-source-css" type="text/css">@import url(https://fonts.googleapis.com/css?family=Open+Sans:300); | |
body { | |
height: 100vh; | |
display: flex; | |
flex-flow: row wrap; | |
justify-content: center; | |
align-items: center; | |
line-height: 1.8; | |
margin: 0; | |
padding: 0 40px; | |
background-image: linear-gradient(135deg,#eee 0%,rgba(0,0,0,0.2) 100%); | |
} | |
.text { | |
color: rgba(35,35,35,0.8); | |
font-size: 3em; | |
font-family: "Open Sans", sans-serif; | |
font-style: normal; | |
} | |
a { | |
text-decoration: none; | |
border-bottom: 2px solid #ef8b80; | |
box-shadow: inset 0 -4px 0 #ef8b80; | |
color: inherit; | |
transition: background 0.1s cubic-bezier(.33,.66,.66,1); | |
} | |
a:hover { | |
background: #ef8b80; | |
}</script> | |
</body> | |
</html> |
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
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300); | |
body { | |
height: 100vh; | |
display: flex; | |
flex-flow: row wrap; | |
justify-content: center; | |
align-items: center; | |
line-height: 1.8; | |
margin: 0; | |
padding: 0 40px; | |
background-image: linear-gradient(135deg,#eee 0%,rgba(0,0,0,0.2) 100%); | |
} | |
.text { | |
color: rgba(35,35,35,0.8); | |
font-size: 3em; | |
font-family: "Open Sans", sans-serif; | |
font-style: normal; | |
} | |
a { | |
text-decoration: none; | |
border-bottom: 2px solid #ef8b80; | |
box-shadow: inset 0 -4px 0 #ef8b80; | |
color: inherit; | |
transition: background 0.1s cubic-bezier(.33,.66,.66,1); | |
} | |
a:hover { | |
background: #ef8b80; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment