adding tailwind css

This commit is contained in:
2026-02-04 12:04:08 +00:00
parent 6469cb4ad7
commit 9167946ecc
41 changed files with 796 additions and 368 deletions

View File

@@ -1,7 +1,7 @@
<template>
<main class="flex-col center-content">
<main class="flex flex-col items-center">
<div
class="a4page-portrait center-content bdr-1 flex-col relative scroll-y"
class="a4page-portrait items-center bdr-1 flex flex-col relative overflow-scroll"
>
<h1>404</h1>
<RouterLink to="/" class="bdr-2">

View File

@@ -5,14 +5,14 @@ import CreatePost from "@/components/admin/CreatePost.vue";
</script>
<template>
<main class="center-content flex-col">
<main class="items-center flex flex-col">
<div class="background halftone" />
<div class="a5page-portrait bdr-1 flex-col">
<Login class="bdr-2 bg-secondary" />
<div class="a5page-portrait bdr-1 flex flex-col">
<Login class="bdr-2 bg-bg_primary" />
<!--
<CreateUser class="bdr-2 bg-secondary" />
<CreateUser class="bdr-2 bg-bg_primary" />
-->
<CreatePost class="bdr-2 bg-secondary" />
<CreatePost class="bdr-2 bg-bg_primary" />
</div>
</main>
</template>

View File

@@ -240,9 +240,11 @@ const links = [
</script>
<template>
<main class="center-content flex-col">
<main class="items-center flex flex-col">
<div class="background halftone" />
<div class="a4page-portrait bdr-1 flex-col relative scroll-y gap">
<div
class="a4page-portrait bdr-1 flex flex-col relative overflow-scroll gap-1"
>
<ToggleLinkTable
v-for="link in links"
:title="link[0]"

View File

@@ -2,6 +2,7 @@
import Timer from "@/components/quick/Timer.vue";
import Time from "@/components/quick/Time.vue";
import Chat from "@/components/quick/Chat.vue";
import MusicPlayer from "@/components/quick/MusicPlayer.vue";
import Intro from "@/components/home/Intro.vue";
import Stamps from "@/components/home/Stamps.vue";
@@ -15,18 +16,19 @@ import Watching from "@/components/home/Watching.vue";
</script>
<template>
<div class="overlay">
<img src="/img/memes/fire-woman.gif" class="br w-10vw" />
<div class="flex-col tr">
<Time class="bdr-2 bg-primary" />
<Timer class="bdr-2 bg-primary" />
<!-- <Chat class="bdr-2 bg-primary" /> -->
<div class="background halftone">
<img src="/img/memes/fire-woman.gif" class="br w-80" />
<div class="flex flex-col tr sidebar">
<Time />
<Timer />
<!-- <Chat class="bdr-2 bg-bg_primary" /> -->
<MusicPlayer />
</div>
</div>
<div class="background halftone" />
<div class="-z-10 halftone" />
<main class="center-content flex-col">
<div class="page a4page-portrait bdr-1 grid relative">
<main class="items-center flex flex-col">
<div class="page a4page-portrait bdr-1 homeGrid relative">
<Intro class="intro" />
<Listening class="listening" />
<Stamps class="stamps" />
@@ -46,7 +48,13 @@ import Watching from "@/components/home/Watching.vue";
background-color: var(--bg_primary);
}
.grid {
.sidebar > * {
background-color: var(--bg_primary);
border: 7px solid;
border-image: url("/img/borders/border4.gif") 7 round;
}
.homeGrid {
display: grid;
grid-gap: 5px;
grid-template-columns: repeat(10, 1fr);

View File

@@ -59,15 +59,15 @@ onMounted(fetchFile);
</script>
<template>
<main class="center-content flex-col">
<main class="items-center flex flex-col">
<div class="background halftone" />
<div
v-if="file"
class="a4page-portrait bdr-primary flex-col relative scroll-y gap bg-primary"
class="a4page-portrait border-primary-1 flex flex-col relative overflow-scroll gap-1 bg-bg_primary"
>
<h1>{{ filename }}</h1>
<small>{{ last_edited }}</small>
<Markdown class="fill wrap" :source="file" />
<Markdown class="flex-1 border-box text-wrap" :source="file" />
</div>
<div v-else>Loading</div>

View File

@@ -9,9 +9,11 @@ const shrine_links = [
</script>
<template>
<main class="center-content flex-col">
<main class="items-center flex flex-col">
<div class="background halftone" />
<div class="a4page-portrait bdr-1 flex-col relative scroll-y gap">
<div
class="a4page-portrait bdr-1 flex flex-col relative overflow-scroll gap-1"
>
<RouterTable :linkArr="shrine_links" />
</div>
</main>

View File

@@ -11,9 +11,9 @@ const videoSources = [
</script>
<template>
<main class="center-content flex-col">
<main class="items-center flex flex-col">
<div
class="a4page-portrait bdr-1 flex-row relative scroll-y center-content"
class="a4page-portrait bdr-1 flex flex-row relative overflow-scroll items-center"
>
<p>
<a href="https://wiki.teamfortress.com/wiki/Demoman"

View File

@@ -3,9 +3,9 @@ import Wip from "@/components/quick/Wip.vue";
</script>
<template>
<main class="center-content flex-col">
<main class="items-center flex flex-col">
<div
class="a4page-portrait center-content bdr-1 flex-col relative scroll-y"
class="a4page-portrait items-center bdr-1 flex flex-col relative overflow-scroll"
>
<Wip />
</div>

View File

@@ -3,9 +3,9 @@ import Wip from "@/components/quick/Wip.vue";
</script>
<template>
<main class="center-content flex-col">
<main class="items-center flex flex-col">
<div
class="a4page-portrait center-content bdr-1 flex-col relative scroll-y"
class="a4page-portrait items-center bdr-1 flex flex-col relative overflow-scroll"
>
<Wip />
</div>

View File

@@ -3,9 +3,9 @@ import Wip from "@/components/quick/Wip.vue";
</script>
<template>
<main class="center-content flex-col">
<main class="items-center flex flex-col">
<div
class="a4page-portrait center-content bdr-1 flex-col relative scroll-y"
class="a4page-portrait items-center bdr-1 flex flex-col relative overflow-scroll"
>
<Wip />
</div>

View File

@@ -15,10 +15,7 @@
</tbody>
</table>
<div
class="no-print"
style="width: 100%; text-align: center; margin: 20px 0"
></div>
<div class="no-print m-1 w-full text-center"></div>
<div id="LloydsBank" class="a5page">
<div class="contact">
<h1>Adam French</h1>