john
/
timekeeper
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

feat: custom fonts

This commit is contained in:
pskfyi 2022-01-13 13:02:43 -08:00 committed by pskfyi
parent 6bac096ca8
commit 1c0cc228f6
5 changed files with 21 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
components/KeyArtStage.vue
View File

@ -9,10 +9,11 @@
class="spare-time flex flex-row items-center font-bold rounded-2xl select-none"
:class="`text-${$store.getters.activeTab.darkColor}`"
>
<span class="text-3xl md:text-5xl" v-text="currencyText" />
<span
class="fas fa-hourglass-half text-xl pt-1 pl-2 md:text-3xl md:pt-2"
class="spare-time-value text-3xl md:text-5xl"
v-text="currencyText"
/>
<span class="fas fa-hourglass-half text-xl pl-2 md:text-3xl md:pt-1" />
</span>
</div>
</div>

1
components/TimeHeader.vue
View File

@ -42,6 +42,7 @@ export default {
header {
min-width: 18rem;
transition: background-color 2000ms, color 2000ms;
font-family: 'Roboto Slab', serif;
}
@media (min-width: 768px) {
header {

9
layouts/default.vue
View File

@ -21,7 +21,7 @@
:class="activeTabColorClasses"
>
<div
class="w-full text-2xl text-center pt-1 pb-2"
class="tab-title w-full text-2xl text-center pt-1 pb-2"
v-text="activeTab.title"
/>
@ -80,6 +80,8 @@ export default {
</script>
<style>
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;600&family=Roboto+Slab:wght@600&display=swap');
html,
body,
#__nuxt,
@ -91,6 +93,7 @@ body,
html {
background: #e5e7eb;
overflow-y: hidden;
font-family: 'Manrope', sans-serif;
}
</style>
@ -99,4 +102,8 @@ main {
grid-template-rows: auto minmax(0, 2fr) auto minmax(0, 3fr);
transition: background-color 2000ms;
}
.tab-title {
font-family: 'Roboto Slab', serif;
}
</style>

20
pages/Missions.vue
View File

@ -1,12 +1,6 @@
<template>
<div class="missions grid">
<responsive-grid
v-if="incomplete.length"
:class="
completed.length &&
`pb-6 border-b-2 border-${$store.getters.activeTab.darkColor}`
"
>
<responsive-grid v-if="incomplete.length">
<mission-button
v-for="(mission, index) in incomplete"
:key="index"
@ -15,18 +9,14 @@
/>
</responsive-grid>
<div
v-else
:class="
completed.length &&
`pt-6 pb-10 border-b-2 border-${$store.getters.activeTab.darkColor}`
"
>
<div v-else>
<h3 class="text-center">No Missions Currently Available</h3>
</div>
<template v-if="completed.length">
<h2 class="pt-2 pb-2 text-center text-xl">Completed Missions</h2>
<h2 class="pt-4 pb-2 md:pt-8 md:pb-4 font-semibold text-center text-xl">
Completed Missions
</h2>
<responsive-grid min="1" mid="3" max="6">
<completed-mission
v-for="(mission, index) in completed"

8
pages/TimeMachine.vue
View File

@ -20,15 +20,15 @@
</span>
</div>
<h2 class="text-lg font-semibold text-center pt-4 md:pt-8">Upgrades</h2>
<h2 class="text-xl font-semibold text-center pt-4 md:pt-8">Upgrades</h2>
<responsive-grid class="pt-4 md:pt-8">
<responsive-grid class="pt-2 md:pt-4">
<max-energy-upgrade-button />
</responsive-grid>
<h2 class="text-lg font-semibold text-center pt-4 md:pt-8">Time Travel</h2>
<h2 class="text-xl font-semibold text-center pt-4 md:pt-8">Time Travel</h2>
<responsive-grid class="pt-4 md:pt-8">
<responsive-grid class="pt-2 md:pt-4">
<progress-button
v-for="process in $store.state.processes"
:key="process.instrument"