mirror of
https://github.com/NovaOSS/nova-web.git
synced 2024-11-26 00:23:57 +01:00
73 lines
1.6 KiB
Sass
73 lines
1.6 KiB
Sass
@import '_vars'
|
|
|
|
header
|
|
max-width: $main-width
|
|
margin: 0 auto
|
|
font-size: 40px
|
|
|
|
h1
|
|
line-height: 4rem
|
|
|
|
div.user-quotes
|
|
display: grid
|
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))
|
|
grid-gap: 2rem
|
|
|
|
div.user-quote__field
|
|
padding-inline: 2rem
|
|
padding-block: 2rem
|
|
background: $primary-soft
|
|
border: 1px solid $primary-glow
|
|
border-radius: $edge
|
|
position: relative
|
|
transition: all 200ms
|
|
box-shadow: 0 0 30px transparent
|
|
min-height: 200px
|
|
|
|
&:hover
|
|
scale: 1.05
|
|
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
|
|
|
|
span.user-quote__username
|
|
font-size: 1rem
|
|
font-weight: 600
|
|
color: $primary
|
|
|
|
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
|