python-gallery/gallery/themes/default/components/banner.sass
Michał 4e7301b9de Switch to Manrope font
Fix inconsistent buttons
Removed default header background
Added info button with version and ❤️
Random fixes
2023-03-23 15:47:35 +00:00

89 lines
1.5 KiB
Sass

.banner
width: 100%
height: 50vh
position: relative
background-color: $black
color: $white
overflow: hidden
transition: opacity 0.3s ease-in-out
img
position: absolute
top: 0
left: 0
width: 100%
height: 100%
background-color: $black2
object-fit: cover
object-position: center center
.banner-filter
position: absolute
top: 0
left: 0
width: 100%
height: 100%
background: linear-gradient(to right, rgba($primary, 1), rgba($primary, 0))
z-index: +1
.banner-content
padding: 1rem
width: 100%
height: inherit
position: relative
display: flex
flex-direction: column
justify-content: flex-end
z-index: +2
h1
margin: 0
padding: 0
font-size: 6.9rem
font-weight: 800
text-align: left
color: $primary
p
margin: 0
padding: 0
font-size: 1rem
font-weight: 500
line-height: 1
text-align: left
@media (max-width: $breakpoint)
.banner
width: 100vw
height: 25vh
.banner-content
padding: 0.5rem
display: flex
justify-content: center
align-items: center
h1
font-size: 3.5rem
text-align: center
p
font-size: 1.1rem
text-align: center