mirror of
https://github.com/Derpy-Leggies/OnlyLegs.git
synced 2025-06-29 03:26:16 +00:00
Move colours to HSL, probably a mistake
This commit is contained in:
parent
9821db72c6
commit
1a59e413a9
29 changed files with 852 additions and 730 deletions
|
@ -5,7 +5,7 @@
|
|||
top: 0
|
||||
left: 0
|
||||
bottom: 0
|
||||
background-image: linear-gradient(90deg, $bg-transparent, transparent)
|
||||
background-image: linear-gradient(90deg, var(--background-shade), transparent)
|
||||
overflow-y: auto
|
||||
transition: left 0.3s cubic-bezier(0.76, 0, 0.17, 1)
|
||||
z-index: 2
|
||||
|
@ -18,7 +18,7 @@
|
|||
left: -27rem
|
||||
@media (max-width: 1100px)
|
||||
.info-container
|
||||
padding: 0 0.5rem 0 0.5rem
|
||||
padding: 0
|
||||
width: 100%
|
||||
position: relative
|
||||
background: none
|
||||
|
@ -32,9 +32,9 @@ details
|
|||
padding: 0.5rem
|
||||
display: flex
|
||||
flex-direction: column
|
||||
background-color: RGB($bg-300)
|
||||
color: RGB($fg-white)
|
||||
border-radius: $rad
|
||||
background-color: var(--background-300)
|
||||
color: var(--foreground-white)
|
||||
border-radius: var(--rad)
|
||||
overflow: hidden
|
||||
|
||||
summary
|
||||
|
@ -44,7 +44,7 @@ details
|
|||
justify-content: flex-start
|
||||
align-items: center
|
||||
position: relative
|
||||
color: RGB($primary)
|
||||
color: var(--primary)
|
||||
|
||||
> i
|
||||
margin-right: 0
|
||||
|
@ -79,7 +79,7 @@ details
|
|||
margin: 0
|
||||
padding: 0
|
||||
|
||||
color: RGB($primary)
|
||||
color: var(--primary)
|
||||
|
||||
cursor: pointer
|
||||
text-decoration: none
|
||||
|
@ -91,7 +91,7 @@ details
|
|||
width: 1.1rem
|
||||
height: 1.1rem
|
||||
|
||||
border-radius: $rad-inner
|
||||
border-radius: calc(var(--rad) / 2)
|
||||
|
||||
object-fit: cover
|
||||
|
||||
|
@ -154,7 +154,7 @@ details
|
|||
justify-content: center
|
||||
align-items: center
|
||||
|
||||
border-radius: $rad-inner
|
||||
border-radius: calc(var(--rad) / 2)
|
||||
border: none
|
||||
|
||||
i
|
||||
|
@ -197,7 +197,9 @@ details
|
|||
max-height: 100%
|
||||
object-fit: contain
|
||||
object-position: center
|
||||
border-radius: $rad
|
||||
border-radius: var(--rad)
|
||||
|
||||
transition: border-radius 0.3s cubic-bezier(0.76, 0, 0.17, 1)
|
||||
|
||||
&.collapsed
|
||||
padding: 0
|
||||
|
@ -207,6 +209,7 @@ details
|
|||
border-radius: 0
|
||||
@media (max-width: 1100px)
|
||||
.image-container
|
||||
padding: 0 0 0.5rem 0
|
||||
position: relative
|
||||
left: 0
|
||||
|
||||
|
@ -218,17 +221,17 @@ details
|
|||
max-height: 69vh
|
||||
|
||||
&.collapsed
|
||||
padding: 0.5rem
|
||||
padding: 0 0 0.5rem 0
|
||||
left: 0
|
||||
|
||||
picture img
|
||||
border-radius: $rad
|
||||
border-radius: var(--rad)
|
||||
|
||||
.background
|
||||
position: absolute
|
||||
inset: 0
|
||||
background-color: RGB($bg-300)
|
||||
background-image: linear-gradient(to right, RGB($bg-400) 15%, RGB($bg-200) 35%, RGB($bg-400) 50%)
|
||||
background-color: var(--background-300)
|
||||
background-image: linear-gradient(to right, var(--background-400) 15%, var(--background-200) 35%, var(--background-400) 50%)
|
||||
background-size: 1000px 640px
|
||||
animation: imgLoading 1.8s linear infinite forwards
|
||||
user-select: none
|
||||
|
@ -240,7 +243,7 @@ details
|
|||
inset: 0
|
||||
width: 100%
|
||||
height: 100%
|
||||
background-color: RGB($fg-white)
|
||||
background-color: var(--foreground-white)
|
||||
filter: blur(3rem) saturate(1.2) brightness(0.7)
|
||||
transform: scale(1.1)
|
||||
object-fit: cover
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue