Skip to content

Instantly share code, notes, and snippets.

Created March 21, 2020 14:35
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
What would you like to do?
WIP code for first lesson of Learn Something About Programming In 30 Minutes
<link href="" rel="stylesheet">
body {
background-color: black;
h1 {
color: #EEE;
font-family: 'Squada One', cursive;
font-size: 60px;
.clock {
border: 3px #EEE solid;
width: 200px;
height: 200px;
border-radius: 100px;
position: relative;
.hand {
background-color: #EEE;
width: 3px;
height: 80px;
left: 100px;
top: 20px;
position: absolute;
animation: 60s rotate linear infinite;
transform-origin: bottom;
.number-0, .number-6 {
color: white;
font-family: 'Squada One', cursive;
font-size: 24px;
left: 97px;
.number-0 {
position: absolute;
top: 5px;
.number-6 {
position: absolute;
bottom: 5px;
@keyframes rotate {
0% {
transform: rotate(0deg);
50% {
transform: rotate(180deg);
100% {
transform: rotate(360deg);
<h1>Learn something about programming in 30 minutes</h1>
<div class="clock">
<div class="hand"></div>
<div class="number-0">0</div>
<div class="number-6">6</div>
Copy link

dlefcoe commented Mar 21, 2020

might be worth leaving comments. show users how to comment HTML

Copy link

dlefcoe commented Mar 21, 2020

<!-- this is a comment -->

Copy link

That's a good idea, maybe I'll cover that tomorrow :-)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment