mirror of
https://github.com/NovaOSS/nova-web.git
synced 2024-11-26 00:23:57 +01:00
102 lines
2.2 KiB
Sass
102 lines
2.2 KiB
Sass
@import '_vars'
|
|
|
|
header
|
|
max-width: $main-width
|
|
margin: 0 auto
|
|
font-size: 40px
|
|
margin-bottom: 15rem
|
|
|
|
h1
|
|
line-height: 4rem
|
|
|
|
div.featured__facts
|
|
padding: 1.5rem
|
|
margin-block: 2rem
|
|
display: flex
|
|
vertical-align: middle
|
|
transition: all 200ms
|
|
|
|
&:hover
|
|
scale: 1.025
|
|
filter: brightness(1.1) saturate(1.1)
|
|
box-shadow: 0 0 30px $primary-glow
|
|
|
|
img, svg
|
|
width: 50px
|
|
height: 50px
|
|
object-fit: cover
|
|
|
|
h2
|
|
vertical-align: middle
|
|
margin-block: auto
|
|
margin-left: 1rem
|
|
font-size: 1.5rem
|
|
|
|
span
|
|
color: $primary-light
|
|
|
|
div.user-quotes
|
|
// display: grid
|
|
// grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))
|
|
// grid-gap: 2rem
|
|
|
|
div.user-quote__field
|
|
padding: 1.5rem
|
|
cursor: pointer
|
|
margin-block: 2rem
|
|
background: $primary-soft
|
|
border: 2px solid $primary-glow
|
|
border-radius: $edge
|
|
position: relative
|
|
transition: all 200ms
|
|
box-shadow: 0 0 30px transparent
|
|
min-height: 200px
|
|
|
|
&:hover
|
|
scale: 1.025
|
|
filter: brightness(1.1) saturate(1.1)
|
|
box-shadow: 0 0 30px $primary-glow
|
|
|
|
&::before
|
|
font-family: 'Times New Roman', Times, serif
|
|
content: '\201c'
|
|
font-size: 150px
|
|
color: $primary-soft
|
|
position: absolute
|
|
bottom: -1rem
|
|
left: 1rem
|
|
|
|
// show at the bottom left
|
|
transform: rotate(180deg)
|
|
|
|
img
|
|
cursor: pointer
|
|
width: 100px
|
|
height: 100px
|
|
border-radius: 50%
|
|
border: 3px solid $primary-glow
|
|
position: absolute
|
|
top: 1rem
|
|
right: 1rem
|
|
object-fit: scale-down
|
|
|
|
span.user-quote__username
|
|
font-size: 1rem
|
|
font-weight: 600
|
|
color: $primary-light
|
|
|
|
p
|
|
margin-block: 0
|
|
font-size: 1.5rem
|
|
padding-right: 7rem
|
|
|
|
@media (max-width: 800px)
|
|
header
|
|
font-size: 26px
|
|
|
|
h1
|
|
line-height: 3rem
|
|
|
|
h3
|
|
font-size: 28px
|