PythonGallery/onlylegs/static/sass/style.sass

113 lines
2.3 KiB
Sass

// Default theme for OnlyLegs by FluffyBean
// Mockup link: https://www.figma.com/file/IMZT5kZr3sAngrSHSGu5di/OnlyLegs?node-id=0%3A1
@import "variables"
@import "animations"
@import "components/notification"
@import "components/pop-up"
@import "components/context-menu"
@import "components/upload-panel"
@import "components/tags"
@import "components/navigation"
@import "components/banner"
@import "components/gallery"
@import "components/buttons/top-of-page"
@import "components/buttons/pill"
@import "components/buttons/block"
@import "components/image-view"
@import "components/settings"
*
box-sizing: border-box
scrollbar-color: var(--primary) transparent
font-family: var(--font-family)
::-webkit-scrollbar
width: 0.5rem
::-webkit-scrollbar-track
background: var(--background-200)
::-webkit-scrollbar-thumb
background: var(--primary)
::-webkit-scrollbar-thumb:hover
background: var(--foreground-white)
html
margin: 0
padding: 0
scroll-behavior: smooth
body
margin: 0
padding: 0 0 0 3.5rem
max-width: 100%
min-height: 100vh
display: grid
grid-template-rows: auto 1fr auto
font-family: var(--font-family)
background-color: var(--background-100)
color: var(--foreground-white)
overflow-x: hidden
@media (max-width: 800px)
body
padding: 0 0 3.5rem 0
main
margin: 0 0.5rem 0.5rem 0
padding: 0.5rem
display: flex
flex-direction: column
position: relative
background: var(--background-800)
color: var(--foreground-black)
border-radius: var(--rad)
overflow: hidden
@media (max-width: 800px)
main
margin: 0 0.5rem
header
position: sticky
top: 0
.error-page
min-height: 100%
display: flex
flex-direction: column
justify-content: center
align-items: center
h1
margin: 0 2rem
font-size: 6.9rem
font-weight: 900
text-align: center
color: var(--primary)
p
margin: 0 2rem
max-width: 40rem
font-size: 1.25rem
font-weight: 400
text-align: center
@media (max-width: 800px)
.error-page
h1
font-size: 4.5rem
p
max-width: 100%
font-size: 1rem