hexo-theme-ayer/source/css/_partial/ayer.styl
2019-12-03 19:37:44 +08:00

72 lines
1.1 KiB
Stylus

@keyframes down
0%
margin-bottom 0
opacity 1
100%
margin-bottom -15px
opacity .1
//
.cover-frame
position relative
min-width 100%
height 100vh
.bg-box
width 100%
height 100%
&>img
display block
width 100vw
height 100vh
object-fit cover
object-position center center
.cover-inner
position absolute
top 50%
left 50%
transform translate(-50%, -100%)
h1
font-size 8rem
margin 0
h2
font-size 3rem
margin .5rem 0 1.5rem
a, &
color white
text-decoration none
video, img
position relative
.cover-logo
width cover-logo-size
.cover-learn-more
position absolute
z-index 1
bottom 10px
left 0
width 100%
a > i
font-size 3rem
color white
animation down 1s linear infinite
&:hover
color sea
.to_top
position fixed
bottom 10rem
right 50px
z-index 9
text-align center
// Media Query
@media (max-width: 768px)
.cover-inner
transform: translate(-50%, -70%);
h1
font-size 6rem
h2
font-size 2.3rem
.to_top
right 10px