Skip to content

Instantly share code, notes, and snippets.

@matthieua
Created December 2, 2019 19:36
Show Gist options
  • Save matthieua/467324e3256d669de5df6f9447d02ba0 to your computer and use it in GitHub Desktop.
Save matthieua/467324e3256d669de5df6f9447d02ba0 to your computer and use it in GitHub Desktop.
<html>
<head>
<style>
section {
padding: 20px;
max-width: 500px;
margin: 0 auto;
border-radius: 20px;
background-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
h1 {
text-align: center;
color: white;
}
h2 {
text-align: center;
color: white;
}
p {
color: white;
}
a {
color: white;
font-size: 10px;
}
img {
display: block;
margin: 20px auto;
border-radius: 20px;
}
button {
display: block;
margin: 20px auto;
background: white;
color: blueviolet;
padding: 15px 30px;
border-radius: 20px;
}
button:hover {
background: blueviolet;
color: white;
cursor: pointer;
}
</style>
</head>
<body>
<section>
<h1>
Swing
</h1>
<h2>
The best dance in the world
</h2>
<img
src="https://thehomeofhappyfeet.com/wp-content/uploads/2017/11/DSC_0815-2.jpg"
alt="Dancers"
width="300"
/>
<p>
<strong>
Swing dance
</strong>
is a group of dances that developed with the swing style of jazz music
in the 1920s–1940s, with the origins of each dance predating the popular
"swing era".
</p>
<a href="https://en.wikipedia.org/wiki/Swing_(dance)" target="_blank">
Learn more on Wikipedia
</a>
<br />
<button>
Learn Swing
</button>
</section>
<script>
function subscribe() {
let firstName = prompt("What is your first name?");
let email = prompt("What is your email address?");
alert(`Thank you ${firstName}, we'll be in touch`);
}
let button = document.querySelector("button");
button.addEventListener("click", subscribe);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment