Skip to content

Instantly share code, notes, and snippets.

@krazy-glue
Created March 4, 2022 18:44
Show Gist options
  • Select an option

  • Save krazy-glue/ef552ace5b079799ff13a0030d6614e5 to your computer and use it in GitHub Desktop.

Select an option

Save krazy-glue/ef552ace5b079799ff13a0030d6614e5 to your computer and use it in GitHub Desktop.
403
<div id="app">
<div>403</div>
<div class="txt">
Forbidden<span class="blink">_</span>
</div>
</div>
@import url('https://fonts.googleapis.com/css?family=Press+Start+2P');
$color: #54FE55;
$color2: #1a4f1a;
$glowSize: 10px;
html,body{
width: 100%;
height: 100%;
margin: 0;
}
*{
font-family: 'Press Start 2P', cursive;
box-sizing: border-box;
}
#app{
padding: 1rem;
background: black;
display: flex;
height: 100%;
justify-content: center;
align-items: center;
color: $color;
text-shadow: 0px 0px $glowSize ;
font-size: 6rem;
flex-direction: column;
.txt {
font-size: 1.8rem;
}
}
@keyframes blink {
0% {opacity: 0}
49% {opacity: 0}
50% {opacity: 1}
100% {opacity: 1}
}
.blink {
animation-name: blink;
animation-duration: 1s;
animation-iteration-count: infinite;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment