1
0
mirror of https://github.com/kremalicious/blog.git synced 2024-11-16 01:55:18 +01:00
blog/_src/_assets/styl/_page-404.styl

69 lines
1.4 KiB
Stylus

//
// kremalicious3
// --------------
// Page - 404
//
.page-404
@extend .textcenter
.entry-title
@extend .hide
.srverror-title
font-size: 2em
margin-bottom: ($spacer/4)
color: $text-color-light
.srverror-text
@extend .text-dimmed
font-size: 1.2em
letter-spacing: .01em
// HAL needs a size
$hal-size = 72px
.hal-9000
@extend .textcenter, .aligncenter
width: $hal-size
height: $hal-size
border-radius: $hal-size
background: #444
padding: 1.5em
margin-top: $spacer
margin-bottom: $spacer
position: relative
border: 4px solid #ccc
box-shadow: inset 0 0 10px #000
// eye
&:before
content: ""
width: 100%
height: 100%
border-radius: 100%
display: block
background: red
box-shadow: 0 0 5px red, 0 0 10px red, 0 0 15px red, 0 0 20px red, 0 0 25px red, 0 0 30px red, 0 0 40px red
animation: halpulse 7s infinite
// gloss
&:after
content: ""
position: absolute
width: $hal-size
height: $hal-size
border-radius: $hal-size
position: absolute
left: 0
top: 0
background-image: linear-gradient(135deg, rgba(255,255,255,0.07) 0%,rgba(255,255,255,0.07) 40%,rgba(255,255,255,0) 41%)
@keyframes halpulse
0%
opacity: 1
50%
opacity: .6
100%
opacity: 1