viveksantayana/wanderhome-quiz-client
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Built skeleton for the web site.

Browse Source 
Need to write the text and make the quiz console.
This commit is contained in:
Vivek Santayana
2022-08-28 07:07:52 +01:00
parent d15a4efbc8
commit fd1c4ee14d
27 changed files with 737 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
client/src/views/About.vue
View File

@@ -1,7 +0,0 @@
<template>
<div class="home">
<h1>About</h1>
</div>
</template>

50
client/src/views/Home.vue
View File

@@ -1,7 +1,47 @@
<script>
import Content from '@/components/Content.vue'
import AccountQuestion from '@/components/icons/AccountQuestion.vue'
export default {
components: {
AccountQuestion,
Content
}
}
</script>
<template>
<div class="home">
<h1>Home</h1>
</div>
<Content>
<template v-slot:header>
home
</template>
<template v-slot:content>
<article class="prose mx-auto">
<p class="text-leader">
The road ahead is long and meandering.
But the journey shapes us as much as we shape it.
</p>
<p>
<em class="uncial-antiqua">Wanderhome</em> by Jay Dragon, published by Possum Creek Games, is a pastoral fantasy table-top role-playing game about anthropomorphic animals journeying across a vast landscape, and what they discover about themselves and the world they inhabit along the way.
</p>
<p>
This quiz will help determine what playbook, or character archetype, you are.
You can take the quiz by clicking on the following link:
</p>
<div class="w-fit mx-auto">
<router-link active-class="active-link" class="navlink" to="/quiz">
<div class="inline-flex px-3 py-1 space-x-2 rounded-md bg-lime-800 text-white hover:bg-lime-600">
<span class="scale-75">
<AccountQuestion/>
</span>
<span>Take the Quiz</span>
</div>
</router-link>
</div>
<p class="text-sm">
This quiz is not affiliated with, endorsed by, or in any way connected to Possum Creek Games.
It is a fan project and a programming exercise by someone who loves Jay&rsquo;s game.
I would nevertheless implore you to play <em>Wanderhome</em> if you haven&rsquo;t already.
</p>
</article>
</template>
</Content>
</template>

21
client/src/views/Quiz.vue
View File

@@ -1,7 +1,20 @@
<script>
import Content from '@/components/Content.vue'
export default {
components: {
Content
}
}
</script>
<template>
<div class="quiz">
<h1>Quiz</h1>
<div>
<Content>
<template v-slot:header>
Take the Quiz
</template>
<template v-slot:content>
This is the Quiz Console
</template>
</Content>
</div>
</template>

46
client/src/views/about/About.vue Normal file
View File

@@ -0,0 +1,46 @@
<script>
import Content from '@/components/Content.vue'
export default {
components: {
Content
}
}
</script>
<template>
<div >
<Content>
<template v-slot:header>
Background
</template>
<template v-slot:content>
<article class="prose mx-auto">
<h2>Why I Made This</h2>
<p>
Teaching myself programming.
</p>
<h2>
Technical shite
</h2>
</article>
</template>
</Content>
</div>
</template>
<style scoped>
.navlink.active-link, .navlink.exact-active-link {
@apply bg-orange-500;
@apply text-white;
@apply hover:bg-orange-600;
@apply hover:text-white;
}
.navlink {
@apply hover:text-orange-300;
@apply active:text-orange-500;
@apply rounded-lg;
@apply h-fit;
@apply align-middle;
@apply transition-all;
@apply ease-in-out;
@apply duration-500;
}
</style>

30
client/src/views/about/Acknowledgements.vue Normal file
View File

@@ -0,0 +1,30 @@
<script>
import Content from '@/components/Content.vue'
export default {
components: {
Content
}
}
</script>
<template>
<div>
<Content>
<template v-slot:header>
Acknowledgements
</template>
<template v-slot:content>
<article class="prose mx-auto">
<p>
First and foremost, my thanks to Jay Dragon and Possum Creek Games for creating such a magnificent work of art.
</p>
<p>
I would also like to thank 8bit for his inspiring enthusiasm: I would have arrived at this game a whole lot later if it weren&rsquo; for his shilling for it.
</p>
<p>
And I am deeply grateful to my friends along the way: Claire Bath for being the first playtester of the quiz, and
</p>
</article>
</template>
</Content>
</div>
</template>

35
client/src/views/about/Index.vue Normal file
View File

@@ -0,0 +1,35 @@
<script>
import Content from '@/components/Content.vue'
import Sidebar from '@/components/sidebar/Index.vue'
export default {
components: {
Content,
Sidebar
}
}
</script>
<template>
<div>
<div class="flex flex-col md:flex-row space-x-6">
<div class="flex flex-col w-full md:w-1/3 h-fit">
<Sidebar :prefix="$router.options.routes[2].path" :routes="$router.options.routes[2].children">
<template v-slot:header>
About
</template>
</Sidebar>
</div>
<div class="flex w-full md:w-2/3">
<router-view v-slot="{ Component, route }" class="w-full" ref="panel" appear>
<Transition mode="out-in"
:enter-active-class="route.meta.panelEnterActiveClass"
:enter-from-class="route.meta.panelEnterFromClass"
:leave-active-class="route.meta.panelLeaveActiveClass"
:leave-to-class="route.meta.panelLeaveToClass"
>
<component :is="Component" />
</Transition>
</router-view>
</div>
</div>
</div>
</template>

24
client/src/views/about/Wanderhome.vue Normal file
View File

@@ -0,0 +1,24 @@
<script>
import Content from '@/components/Content.vue'
export default {
components: {
Content
}
}
</script>
<template>
<div>
<Content>
<template v-slot:header>
About <em>Wanderhome</em>
</template>
<template v-slot:content>
<article class="prose mx-auto">
<p>
<em class="uncial-antiqua">Wanderhome</em> is a pastoral fantasy table-top role-playing game by Jay Dragon, published by Possum Creek Games.
</p>
</article>
</template>
</Content>
</div>
</template>