Fix styles

man90es · May 8, 2024 · e1c5374 · e1c5374
1 parent 5ebd72c
commit e1c5374
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 14 deletions.
diff --git a/src/pages/leaderboard/components/LeaderboardHeaderLine.vue b/src/pages/leaderboard/components/LeaderboardHeaderLine.vue
@@ -1,5 +1,7 @@
-<template>
-	<div v-for="header of headers" :key="header ?? ''">{{ header }}</div>
+<template module>
+	<div :class="$style.root" v-for="header of headers" :key="header ?? ''">
+		{{ header }}
+	</div>
 </template>
 
 <script setup lang="ts">
@@ -24,17 +26,14 @@
 	})
 </script>
 
-<style scoped>
-	#leaderboard > * {
+<style module>
+	.root {
 		padding: 0.5rem;
-	}
-
-	div {
 		font-weight: bold;
 	}
 
-	div:first-child,
-	div:nth-child(4) {
+	.root:first-child,
+	.root:nth-child(4) {
 		text-align: right;
 	}
 </style>
diff --git a/src/pages/leaderboard/components/LeaderboardLine.vue b/src/pages/leaderboard/components/LeaderboardLine.vue
@@ -119,7 +119,11 @@
 </script>
 
 <style scoped>
-	#leaderboard > * {
+
+	.position,
+	.family-name,
+	.character-name,
+	.score {
 		align-items: center;
 		background-color: v-bind(backgroundColour);
 		color: v-bind(colour);
@@ -165,8 +169,4 @@
 		opacity: 0.8;
 		width: 1.5rem;
 	}
-
-	.mobile-layout .character-name::before {
-		zoom: 0.7;
-	}
 </style>