Skip to content

Instantly share code, notes, and snippets.

@matthieua
Created April 2, 2020 18:16
Show Gist options
  • Save matthieua/8675f2b44911bf431d95fbf90156f278 to your computer and use it in GitHub Desktop.
Save matthieua/8675f2b44911bf431d95fbf90156f278 to your computer and use it in GitHub Desktop.
<html>
<head>
<style>
h1 {
text-align: center;
color: blueviolet;
font-size: 30px;
}
h2 {
text-align: center;
border: 1px solid blueviolet;
padding: 15px;
font-size: 20px;
border-radius: 10px;
}
img {
display: block;
margin: 0 auto;
border-radius: 10px;
}
p {
font-size: 14px;
}
button {
display: block;
margin: 20px auto;
color: white;
background: blueviolet;
padding: 20px;
font-size: 15px;
border: none;
border-radius: 30px;
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}
button:hover {
opacity: 0.7;
cursor: pointer;
}
.container {
max-width: 600px;
margin: 0 auto;
padding: 20px;
}
</style>
</head>
<body>
<div class="container">
<h1>
Yoga
</h1>
<h2>
Exercise at home
</h2>
<img
src="https://cdn.doyou.com/articles/the-10-most-important-yoga-poses-for-beginners-25270-bbaRsJ6k.jpg=w1080"
alt=""
width="300"
/>
<p>
Yoga is a group of physical, mental, and spiritual practices or
disciplines which originated in ancient India.
</p>
<a href="https://en.wikipedia.org/wiki/Yoga" target="_blank">
Learn more on Wikipedia
</a>
<button>
Subscribe to our newsletter
</button>
</div>
<script>
function subscribe() {
let name = prompt("What is your name?");
let email = prompt("What is your email?");
alert(
`Thanks ${name}! We'll be in touch! Meanwhile, wash your hands🧼`
);
}
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