wancat/linux-odyssey
1
0 Fork 0
mirror of https://github.com/linux-odyssey/linux-odyssey.git synced 2026-11-06 03:20:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: update tailwind configure contant

Browse Source
This commit is contained in:
Chen, Tai-Lin authored and Annie Huang committed 2023-11-12 21:24:01 +08:00
1 parent ea88837fde
commit 5022e2ee05
9 files changed
+41 -53
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

app/src/App.vue
+1 -1
View File
@@ -1,5 +1,5 @@
<template>
<div class="bg-background-primary h-screen">
<div class="bg-bg-primary h-screen">
<!-- route outlet -->
<!-- component matched by the route will render here -->
<router-view></router-view>
app/src/components/AuthForm.vue
+7 -7
View File
@@ -86,14 +86,14 @@ const handleChange = () => {
<template>
<!-- login page -->
<div
class="bg-background border-8 border-background-primary flex flex-1 flex-col items-center justify-center rounded-3xl p-10"
class="bg-bg border-8 border-bg-primary flex flex-1 flex-col items-center justify-center rounded-3xl p-10"
>
<h1 class="text-text-primary text-3xl font-black mb-2">{{ title }}</h1>
<form @submit.prevent="handleSubmit()" class="w-full">
<div v-if="socialLogin && hasSocialLogins">
<a
v-if="availableMethods.google"
class="inline-flex justify-center items-center rounded-lg py-2 mt-3 bg-background-primary text-text-secondary w-full border-text-secondary border-2"
class="inline-flex justify-center items-center rounded-lg py-2 mt-3 bg-bg-primary text-text-secondary w-full border-text-secondary border-2"
href="/api/v1/auth/google"
>
<font-awesome-icon
@@ -104,7 +104,7 @@ const handleChange = () => {
</a>
<a
v-if="availableMethods.github"
class="inline-flex justify-center items-center rounded-lg py-2 mt-3 bg-background-primary text-text-secondary w-full border-text-secondary border-2"
class="inline-flex justify-center items-center rounded-lg py-2 mt-3 bg-bg-primary text-text-secondary w-full border-text-secondary border-2"
href="/api/v1/auth/github"
>
<font-awesome-icon
@@ -125,7 +125,7 @@ const handleChange = () => {
type="text"
id="username"
ref="usernameInput"
class="my-4 bg-background-primary text-text-primary bg- rounded-md block w-full px-3 h-10 shadow-sm focus:outline-none placeholder:text-text-line focus:ring-2 focus:ring-text-primary ring-1 ring-background-secondary"
class="my-4 bg-bg-primary text-text-primary bg- rounded-md block w-full px-3 h-10 shadow-sm focus:outline-none placeholder:text-text-line focus:ring-2 focus:ring-text-primary ring-1 ring-bg-secondary"
:placeholder="type === 'login' ? 'Email / Username' : 'Username'"
v-model="username"
required
@@ -145,7 +145,7 @@ const handleChange = () => {
type="email"
id="email"
ref="emailInput"
class="my-4 bg-background-primary text-text-primary bg- rounded-md block w-full px-3 h-10 shadow-sm focus:outline-none placeholder:text-text-line focus:ring-2 focus:ring-text-primary ring-1 ring-background-secondary"
class="my-4 bg-bg-primary text-text-primary bg- rounded-md block w-full px-3 h-10 shadow-sm focus:outline-none placeholder:text-text-line focus:ring-2 focus:ring-text-primary ring-1 ring-bg-secondary"
placeholder="Email"
v-model="email"
required
@@ -157,7 +157,7 @@ const handleChange = () => {
<input
type="password"
id="password"
class="my-4 bg-background-primary text-text-primary bg- rounded-md block w-full px-3 h-10 shadow-sm focus:outline-none placeholder:text-text-line focus:ring-2 focus:ring-text-primary ring-1 ring-background-secondary"
class="my-4 bg-bg-primary text-text-primary bg- rounded-md block w-full px-3 h-10 shadow-sm focus:outline-none placeholder:text-text-line focus:ring-2 focus:ring-text-primary ring-1 ring-bg-secondary"
placeholder="Password"
v-model="password"
required
@@ -168,7 +168,7 @@ const handleChange = () => {
{{ errorMessage }}
</p>
<button
class="inline-flex justify-center rounded-lg font-black py-2 bg-text-primary text-background w-full"
class="inline-flex justify-center rounded-lg font-black py-2 bg-text-primary text-bg w-full"
type="submit"
>
<span v-if="type === 'login'">Log In</span>
app/src/components/CompleteModal.vue
+1 -1
View File
@@ -17,7 +17,7 @@ setTimeout(() => {
<template>
<div v-if="showModal" class="modal">
<div class="modal-content bg-background-secondary rounded-lg">
<div class="modal-content bg-bg-secondary rounded-lg">
<span class="close text-text" @click="closeModal">&times;</span>
<h2 class="text-2xl text-text mb-5 w-full inline-flex justify-center">
Quest Completed!
app/src/components/ControlPalette.vue
+7 -11
View File
@@ -1,29 +1,25 @@
<template>
<section class="h-[10%] p-3 grid grid-cols-3 gap-4 place-content-between">
<button id="solution" class="bg-disabled-background rounded-lg p-2">
<button id="solution" class="bg-bg-disabled rounded-lg p-2">
<font-awesome-icon
:icon="['far', 'circle-question']"
class="text-disabled-text"
class="text-text-disabled"
/>
<p class="text-disabled-text inline">Solution</p>
<p class="text-text-disabled inline">Solution</p>
</button>
<button
id="reset"
class="bg-background-secondary rounded-lg p-2"
@click="reset"
>
<button id="reset" class="bg-bg-secondary rounded-lg p-2" @click="reset">
<font-awesome-icon
:icon="['fas', 'arrow-rotate-left']"
class="text-text-primary"
/>
<p class="text-text-primary inline">Reset</p>
</button>
<button id="continue" class="bg-disabled-background rounded-lg p-2">
<button id="continue" class="bg-bg-disabled rounded-lg p-2">
<font-awesome-icon
:icon="['far', 'circle-right']"
class="text-disabled-text"
class="text-text-disabled"
/>
<p class="text-disabled-text inline">Continue</p>
<p class="text-text-disabled inline">Continue</p>
</button>
</section>
</template>
app/src/components/GameHeaderPart.vue
+13 -16
View File
@@ -25,22 +25,19 @@ onMounted(async () => {
</script>
<template>
<div
id="header"
class="bg-background-secondary content-center h-full w-full p-1"
>
<div id="header" class="bg-bg-secondary content-center h-full w-full p-1">
<div class="h-full flex items-center justify-center mx-3">
<div class="flex items-center gap-3">
<!-- <button id="stream" class="flex items-center">
<!-- <button id="stream" class="flex items-center h-5 w-5">
<font-awesome-icon
:icon="['fas', 'bars']"
class="text-text-primary h-5 w-5"
class="text-text-primary h-full w-full"
/>
</button>
<button id="backward" class="flex items-center">
<button id="backward" class="flex items-center h-5 w-5">
<font-awesome-icon
:icon="['fas', 'arrow-left']"
class="text-text-tertiary h-5 w-5"
class="text-text-tertiary h-full w-full"
/>
</button> -->
<button>
@@ -53,28 +50,28 @@ onMounted(async () => {
</button>
</div>
<div class="h-full w-full flex gap-3 items-center justify-end">
<!-- <button id="warning" class="flex items-center">
<!-- <button id="warning" class="flex items-center h-5 w-5">
<font-awesome-icon
:icon="['fas', 'triangle-exclamation']"
class="text-text-primary h-5 w-5"
class="text-text-primary h-full w-full"
/>
</button>
<button id="setting" class="flex items-center">
<button id="setting" class="flex items-center h-5 w-5">
<font-awesome-icon
:icon="['fas', 'gear']"
class="text-text-primary h-5 w-5"
class="text-text-primary h-full w-full"
/>
</button>
<button id="fullscreen" class="flex items-center">
<button id="fullscreen" class="flex items-center h-5 w-5">
<font-awesome-icon
:icon="['fas', 'expand']"
class="text-text-primary h-5 w-5"
class="text-text-primary h-full w-full"
/>
</button> -->
<button @click="handleLogout">
<button class="h-5 w-5" @click="handleLogout">
<font-awesome-icon
:icon="['fas', 'arrow-right-from-bracket']"
class="text-text-primary h-5 w-5"
class="text-text-primary h-full w-full"
/>
</button>
</div>
app/src/components/HintPart.vue
+2 -2
View File
@@ -55,8 +55,8 @@ const right = () => {
</button>
</div>
</div>
<div id="hint" class="bg-background flex flex-wrap">
<div class="bg-background h-full rounded-lg p-8 m-1">
<div id="hint" class="bg-bg flex flex-wrap">
<div class="bg-bg h-full rounded-lg p-8 m-1">
<p class="inline text-text font-xl font-xl">
{{ sessionManager.hints.value[current] }}
</p>
app/src/components/TerminalPart.vue
+1 -1
View File
@@ -4,7 +4,7 @@
<div
id="terminal"
ref="terminal"
class="bg-background-secondary h-[calc(100%-5%)] p-0.5"
class="bg-bg-secondary h-[calc(100%-5%)] p-0.5"
></div>
</template>
app/src/views/GamePage.vue
+6 -9
View File
@@ -21,7 +21,7 @@ onMounted(async () => {
<template>
<!-- game header -->
<div class="h-[5vh] w-full">
<div class="h-[6vh] w-full">
<GameHeaderPart />
</div>
<!-- current status indicator -->
@@ -31,9 +31,9 @@ onMounted(async () => {
:value="sessionManager.status.value"
/>
<!-- main -->
<div id="main" class="h-[95vh] w-full flex p-3 space-x-3">
<div id="main" class="h-[94vh] w-full flex p-3 space-x-3">
<!-- Topic and Command List -->
<div class="bg-background-secondary h-full w-1/3 rounded-lg">
<div class="bg-bg-secondary h-full w-1/3 rounded-lg">
<section id="quest" class="h-2/3 p-3">
<QuestPart />
</section>
@@ -43,7 +43,7 @@ onMounted(async () => {
</section>
</div>
<!-- Terminal and Hint -->
<div class="bg-background h-full w-1/3 rounded-lg">
<div class="bg-bg h-full w-1/3 rounded-lg">
<section id="terminal" class="h-3/5">
<TerminalPart />
</section>
@@ -54,11 +54,8 @@ onMounted(async () => {
<!-- Visualization -->
<div class="h-full w-1/3">
<div class="bg-border rounded-xl h-[90%] p-2">
<div class="bg-background rounded-lg h-full p-2">
<section
id="visualization"
class="bg-background-primary h-full rounded-md"
>
<div class="bg-bg rounded-lg h-full p-2">
<section id="visualization" class="bg-bg-primary h-full rounded-md">
<VisualizationPart />
</section>
</div>
app/tailwind.config.js
+3 -5
View File
@@ -4,21 +4,19 @@ export default {
theme: {
extend: {
colors: {
background: {
bg: {
primary: '#282A33',
secondary: '#131313',
disabled: '#454552',
DEFAULT: '#000000',
},
text: {
primary: '#00FF00',
secondary: '#ADADB5',
tertiary: '#4A4B63',
disabled: '#6A6B8C',
DEFAULT: '#FFFFFF',
},
disabled: {
background: '#454552',
text: '#6A6B8C',
},
border: {
DEFAULT: '#526B4E',
},