Cookies_Github_mirror/AquaDX
4
0
Fork 1
mirror of https://github.com/MewoLab/AquaDX.git synced 2026-02-09 01:17:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

[O] Migrate sass import

Browse Source
This commit is contained in:
Azalea
2024-12-20 04:37:51 -05:00
parent d66eb239fa
commit 813ec7d294
18 changed files with 206 additions and 129 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
AquaNet/src/pages/Home.svelte
View File

@@ -77,7 +77,7 @@
<StatusOverlays {error} loading={!me}/>
<style lang="sass">
@import "../vars"
@use "../vars"
.tabs
display: flex
@@ -85,7 +85,7 @@
div
&.active
color: $c-main
color: vars.$c-main
h3
font-size: 1.3rem

8
AquaNet/src/pages/Home/ImportDataAction.svelte
View File

@@ -126,7 +126,7 @@
{/if}
<style lang="sass">
@import "../../vars"
@use "../../vars"
h3
font-size: 1.3rem
margin: 0
@@ -142,7 +142,7 @@
.old
background: #ff6b6b20
border: 1px solid $c-error
border: 1px solid vars.$c-error
color: #ffffff99
position: relative
@@ -151,13 +151,13 @@
position: absolute
bottom: 0.5rem
right: 0.5rem
color: $c-error
color: vars.$c-error
opacity: 0.6
font-size: 2rem
.new
background: #646cff20
border: 1px solid $c-darker
border: 1px solid vars.$c-darker
.buttons
display: grid

8
AquaNet/src/pages/Home/LinkCard.svelte
View File

@@ -317,7 +317,7 @@
</div>
<style lang="sass">
@import "../../vars"
@use "../../vars"
.link-card
input
@@ -343,7 +343,7 @@
white-space: nowrap
&.ghost
background: rgba($c-darker, 0.8)
background: rgba(vars.$c-darker, 0.8)
.register, .last
opacity: 0.7
@@ -361,10 +361,10 @@
.conflict-cards
.card
transition: $transition
transition: vars.$transition
.card:hover
background: $c-darker
background: vars.$c-darker
span:not(.type)
font-size: 0.8rem

10
AquaNet/src/pages/Ranking.svelte
View File

@@ -77,7 +77,7 @@
</main>
<style lang="sass">
@import "../vars"
@use "../vars"
.leaderboard-container
display: flex
@@ -89,7 +89,7 @@
justify-content: space-between
width: 100%
gap: 12px
border-radius: $border-radius
border-radius: vars.$border-radius
padding: 6px 12px
box-sizing: border-box
@@ -104,7 +104,7 @@
color: unset
.registered
background: $grad-special
background: vars.$grad-special
color: transparent
-webkit-background-clip: text
background-clip: text
@@ -121,14 +121,14 @@
width: 5%
min-width: 20px
@media (max-width: $w-mobile)
@media (max-width: vars.$w-mobile)
font-size: 0.9rem
.accuracy
display: none
&.alternate
background-color: $ov-light
background-color: vars.$ov-light
</style>

4
AquaNet/src/pages/User/Settings.svelte
View File

@@ -156,7 +156,7 @@
</main>
<style lang="sass">
@import "../../vars"
@use "../../vars"
.fields
display: flex
@@ -194,7 +194,7 @@
img
max-width: 100px
max-height: 100px
border-radius: $border-radius
border-radius: vars.$border-radius
object-fit: cover
</style>

38
AquaNet/src/pages/UserHome.svelte
View File

@@ -294,13 +294,13 @@
</main>
<style lang="sass">
@import "../vars"
@use "../vars"
#user-home
.user-pfp
display: flex
align-items: flex-end
gap: $gap
gap: vars.$gap
margin-top: -72px
position: relative
@@ -319,7 +319,7 @@
.setting-icon
font-size: 1.5rem
color: $c-main
color: vars.$c-main
cursor: pointer
display: flex
align-items: center
@@ -334,10 +334,10 @@
.pfp
width: 100px
height: 100px
border-radius: $border-radius
border-radius: vars.$border-radius
object-fit: cover
@media (max-width: $w-mobile)
@media (max-width: vars.$w-mobile)
.user-pfp
margin-top: -68px
h2
@@ -349,7 +349,7 @@
.info-bottom, .info-top, .other-info
display: flex
gap: $gap
gap: vars.$gap
> div
display: flex
@@ -361,7 +361,7 @@
// character spacing
letter-spacing: 0.1em
color: $c-main
color: vars.$c-main
.info-bottom
width: max-content
@@ -376,7 +376,7 @@
.scoring-info
display: flex
gap: $gap
gap: vars.$gap
max-height: 250px
.chart
@@ -408,7 +408,7 @@
opacity: 0.5
user-select: none
@media (max-width: $w-mobile)
@media (max-width: vars.$w-mobile)
flex-direction: column
max-height: unset
@@ -429,12 +429,12 @@
.activity-info
display: flex
flex-direction: column
gap: $gap
gap: vars.$gap
#cal-heatmap
overflow-x: auto
@media (max-width: $w-mobile)
@media (max-width: vars.$w-mobile)
#cal-heatmap
width: 100%
@@ -453,17 +453,17 @@
display: flex
flex-direction: column
flex-wrap: wrap
gap: $gap
gap: vars.$gap
> div.alt
background-color: rgba(white, 0.03)
border-radius: $border-radius
border-radius: vars.$border-radius
// Image and song info
> div
display: flex
align-items: center
gap: $gap
gap: vars.$gap
padding-right: 16px
max-width: 100%
box-sizing: border-box
@@ -471,7 +471,7 @@
img
width: 50px
height: 50px
border-radius: $border-radius
border-radius: vars.$border-radius
object-fit: cover
// Song info and score
@@ -493,7 +493,7 @@
> div:last-child
white-space: nowrap
@media (max-width: $w-mobile)
@media (max-width: vars.$w-mobile)
flex-direction: column
gap: 0
@@ -511,7 +511,7 @@
.rank-S
// Gold green gradient on text
background: $grad-special
background: vars.$grad-special
-webkit-background-clip: text
color: transparent
@@ -526,7 +526,7 @@
text-align: center
background: rgba(var(--lv-color), 0.6)
padding: 0 6px
border-radius: $border-radius
border-radius: vars.$border-radius
margin-right: 10px
span
@@ -544,5 +544,5 @@
span.increased
&:before
content: "+"
color: $c-good
color: vars.$c-good
</style>

10
AquaNet/src/pages/Welcome.svelte
View File

@@ -157,7 +157,7 @@
</main>
<style lang="sass">
@import "../vars"
@use "../vars"
.login-form
display: flex
@@ -171,7 +171,7 @@
align-items: center
#home
color: $c-main
color: vars.$c-main
position: relative
width: 100%
height: 100%
@@ -185,7 +185,7 @@
flex-direction: column
justify-content: center
margin-top: -$nav-height
margin-top: -(vars.$nav-height)
// Content container
> div
@@ -196,10 +196,10 @@
// Switching state container
> div
transition: $transition
transition: vars.$transition
#title
font-family: Quicksand, $font
font-family: Quicksand, vars.$font
user-select: none
// Gap between text characters