Compare commits
4 commits
feat/auth-
...
main
Author | SHA1 | Date | |
---|---|---|---|
Louis Hollingworth | f439090fa2 | ||
Louis Hollingworth | dd67fc967a | ||
Louis Hollingworth | 5a115374b4 | ||
Louis Hollingworth | 7ba84dd020 |
35
.github/workflows/deploy.yml
vendored
Normal file
35
.github/workflows/deploy.yml
vendored
Normal file
|
@ -0,0 +1,35 @@
|
||||||
|
name: Github Pages Astro CI
|
||||||
|
|
||||||
|
on:
|
||||||
|
# Trigger the workflow every time you push to the `main` branch
|
||||||
|
# Using a different branch name? Replace `main` with your branch’s name
|
||||||
|
push:
|
||||||
|
branches: [ main ]
|
||||||
|
# Allows you to run this workflow manually from the Actions tab on GitHub.
|
||||||
|
workflow_dispatch:
|
||||||
|
|
||||||
|
# Allow this job to clone the repo and create a page deployment
|
||||||
|
permissions:
|
||||||
|
contents: read
|
||||||
|
pages: write
|
||||||
|
id-token: write
|
||||||
|
|
||||||
|
jobs:
|
||||||
|
build:
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
steps:
|
||||||
|
- name: Checkout your repository using git
|
||||||
|
uses: actions/checkout@v2
|
||||||
|
- name: Install, build, and upload your site
|
||||||
|
uses: withastro/action@v0
|
||||||
|
|
||||||
|
deploy:
|
||||||
|
needs: build
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
environment:
|
||||||
|
name: github-pages
|
||||||
|
url: ${{ steps.deployment.outputs.page_url }}
|
||||||
|
steps:
|
||||||
|
- name: Deploy to GitHub Pages
|
||||||
|
id: deployment
|
||||||
|
uses: actions/deploy-pages@v1
|
27
.gitignore
vendored
27
.gitignore
vendored
|
@ -1,8 +1,23 @@
|
||||||
node_modules
|
# build output
|
||||||
*.log*
|
dist/
|
||||||
.nuxt
|
.output/
|
||||||
.nitro
|
|
||||||
.cache
|
# dependencies
|
||||||
.output
|
node_modules/
|
||||||
|
|
||||||
|
# logs
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
pnpm-debug.log*
|
||||||
|
|
||||||
|
|
||||||
|
# environment variables
|
||||||
.env
|
.env
|
||||||
|
.env.production
|
||||||
|
|
||||||
|
# macOS-specific files
|
||||||
|
.DS_Store
|
||||||
dist
|
dist
|
||||||
|
|
||||||
|
./friends-best
|
||||||
|
|
4
.vscode/extensions.json
vendored
4
.vscode/extensions.json
vendored
|
@ -1,6 +1,4 @@
|
||||||
{
|
{
|
||||||
"recommendations": [
|
"recommendations": ["astro-build.astro-vscode"],
|
||||||
"vue.vscode-typescript-vue-plugin"
|
|
||||||
],
|
|
||||||
"unwantedRecommendations": []
|
"unwantedRecommendations": []
|
||||||
}
|
}
|
||||||
|
|
36
README.md
36
README.md
|
@ -1,3 +1,35 @@
|
||||||
# Friends Best / Vänner Bästa
|
# Friends Best
|
||||||
|
A fan website for the Netflix series "Young Royals".
|
||||||
|
|
||||||
A young royals fan website made for the [Young Royals](https://discord.gg/youngroyals) Discord guild.
|
## Contributing
|
||||||
|
I suggest using [Just](https://github.com/casey/just) to help with building
|
||||||
|
local changes. [PNPM](https://pnpm.io) is used for the package manager for the
|
||||||
|
frontend and the server is written in [Go](https://go.dev).
|
||||||
|
### Build Frontend
|
||||||
|
```sh
|
||||||
|
just build-fe
|
||||||
|
```
|
||||||
|
or
|
||||||
|
```sh
|
||||||
|
cd fe
|
||||||
|
pnpm build
|
||||||
|
```
|
||||||
|
|
||||||
|
### Build server
|
||||||
|
```sh
|
||||||
|
just build-server
|
||||||
|
```
|
||||||
|
or
|
||||||
|
```sh
|
||||||
|
go build ./server
|
||||||
|
```
|
||||||
|
|
||||||
|
### Build all
|
||||||
|
```sh
|
||||||
|
just build-all
|
||||||
|
```
|
||||||
|
|
||||||
|
### Build and Run all
|
||||||
|
```sh
|
||||||
|
just serve
|
||||||
|
```
|
||||||
|
|
|
@ -1,15 +0,0 @@
|
||||||
@tailwind base;
|
|
||||||
@tailwind components;
|
|
||||||
@tailwind utilities;
|
|
||||||
|
|
||||||
:root {
|
|
||||||
background-color: wheat;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Dark mode */
|
|
||||||
@media (prefers-color-scheme: dark) {
|
|
||||||
:root {
|
|
||||||
background-color: #1E293B;
|
|
||||||
color: antiquewhite;
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,18 +0,0 @@
|
||||||
<template>
|
|
||||||
<NuxtLink :to="to" class="bg-gray-50 hover:bg-gray-100 dark:bg-slate-700 dark:hover:bg-slate-600 m-4 px-5 py-5 md:px-10 rounded-3xl shadow-lg hover:shadow-xl">{{ title }} →</NuxtLink>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
defineProps({
|
|
||||||
to: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
},
|
|
||||||
title: {
|
|
||||||
type: String,
|
|
||||||
required: true
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
</script>
|
|
|
@ -1,32 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="w-screen grid-cols-4 grid-flow-col">
|
|
||||||
<div class="px-4 col-span-1" v-if="user">
|
|
||||||
<span>Hej {{ user.user_metadata.full_name }} </span> |
|
|
||||||
<button class="underline" @click="logout" >Logout</button>
|
|
||||||
</div>
|
|
||||||
<div class="nav" v-if="links">
|
|
||||||
<a href="/">Home</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
defineProps({
|
|
||||||
links: {
|
|
||||||
type: Boolean,
|
|
||||||
default: true
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
nav {
|
|
||||||
margin: 0 auto;
|
|
||||||
position: -webkit-sticky;
|
|
||||||
position: sticky;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
</style>
|
|
|
@ -1,28 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
import { defineComponent } from 'vue'
|
|
||||||
type TimeFormatProps = {
|
|
||||||
dateStyle: 'full' | 'long' | 'medium' | 'short',
|
|
||||||
timeStyle: 'full' | 'long' | 'medium' | 'short',
|
|
||||||
hour12: boolean
|
|
||||||
}
|
|
||||||
|
|
||||||
const props = defineProps<
|
|
||||||
{
|
|
||||||
format: TimeFormatProps,
|
|
||||||
dFormat: string,
|
|
||||||
crntTime: number
|
|
||||||
}
|
|
||||||
>()
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<code>
|
|
||||||
{{ `<t:${Math.floor(crntTime / 1000)}:${props.dFormat}>` }}
|
|
||||||
</code>
|
|
||||||
<span>
|
|
||||||
to get
|
|
||||||
<code>
|
|
||||||
{{Intl.DateTimeFormat(Intl.Locale, format).format(crntTime).replace(" at ", " ") + ' '}}
|
|
||||||
</code>
|
|
||||||
</span>
|
|
||||||
</template>
|
|
3
fe/.eslintrc
Normal file
3
fe/.eslintrc
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
{
|
||||||
|
"extends": ["next", "next/core-web-vitals"]
|
||||||
|
}
|
|
@ -2,4 +2,3 @@ auto-install-peers=true
|
||||||
node-version=17.9.1
|
node-version=17.9.1
|
||||||
engine-strict=false
|
engine-strict=false
|
||||||
strict-peer-dependencies=false
|
strict-peer-dependencies=false
|
||||||
shamefully-hoist=true
|
|
49
fe/README.md
Normal file
49
fe/README.md
Normal file
|
@ -0,0 +1,49 @@
|
||||||
|
# Welcome to [Astro](https://astro.build)
|
||||||
|
|
||||||
|
[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/basics)
|
||||||
|
|
||||||
|
> 🧑🚀 **Seasoned astronaut?** Delete this file. Have fun!
|
||||||
|
|
||||||
|
![basics](https://user-images.githubusercontent.com/4677417/186188965-73453154-fdec-4d6b-9c34-cb35c248ae5b.png)
|
||||||
|
|
||||||
|
|
||||||
|
## 🚀 Project Structure
|
||||||
|
|
||||||
|
Inside of your Astro project, you'll see the following folders and files:
|
||||||
|
|
||||||
|
```
|
||||||
|
/
|
||||||
|
├── public/
|
||||||
|
│ └── favicon.svg
|
||||||
|
├── src/
|
||||||
|
│ ├── components/
|
||||||
|
│ │ └── Card.astro
|
||||||
|
│ ├── layouts/
|
||||||
|
│ │ └── Layout.astro
|
||||||
|
│ └── pages/
|
||||||
|
│ └── index.astro
|
||||||
|
└── package.json
|
||||||
|
```
|
||||||
|
|
||||||
|
Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
|
||||||
|
|
||||||
|
There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
|
||||||
|
|
||||||
|
Any static assets, like images, can be placed in the `public/` directory.
|
||||||
|
|
||||||
|
## 🧞 Commands
|
||||||
|
|
||||||
|
All commands are run from the root of the project, from a terminal:
|
||||||
|
|
||||||
|
| Command | Action |
|
||||||
|
| :--------------------- | :------------------------------------------------- |
|
||||||
|
| `npm install` | Installs dependencies |
|
||||||
|
| `npm run dev` | Starts local dev server at `localhost:3000` |
|
||||||
|
| `npm run build` | Build your production site to `./dist/` |
|
||||||
|
| `npm run preview` | Preview your build locally, before deploying |
|
||||||
|
| `npm run astro ...` | Run CLI commands like `astro add`, `astro preview` |
|
||||||
|
| `npm run astro --help` | Get help using the Astro CLI |
|
||||||
|
|
||||||
|
## 👀 Want to learn more?
|
||||||
|
|
||||||
|
Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat).
|
9
fe/astro.config.mjs
Normal file
9
fe/astro.config.mjs
Normal file
|
@ -0,0 +1,9 @@
|
||||||
|
import { defineConfig } from 'astro/config';
|
||||||
|
import vue from "@astrojs/vue";
|
||||||
|
|
||||||
|
import tailwind from "@astrojs/tailwind";
|
||||||
|
|
||||||
|
// https://astro.build/config
|
||||||
|
export default defineConfig({
|
||||||
|
integrations: [vue(), tailwind()]
|
||||||
|
});
|
11
fe/lib/getUser.ts
Normal file
11
fe/lib/getUser.ts
Normal file
|
@ -0,0 +1,11 @@
|
||||||
|
import { prisma } from "~/server"
|
||||||
|
|
||||||
|
export const getUserByDiscordId = async (discord_id: string) => {
|
||||||
|
const user = await prisma.user.findUnique({
|
||||||
|
where: {
|
||||||
|
discord_id
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
return user
|
||||||
|
}
|
25
fe/package.json
Normal file
25
fe/package.json
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
{
|
||||||
|
"name": "friends-best",
|
||||||
|
"type": "module",
|
||||||
|
"version": "3.0.0",
|
||||||
|
"private": true,
|
||||||
|
"scripts": {
|
||||||
|
"dev": "astro dev",
|
||||||
|
"start": "deno run --allow-net --allow-read --allow-env ./dist/server/entry.mjs",
|
||||||
|
"build": "astro build",
|
||||||
|
"preview": "astro preview",
|
||||||
|
"astro": "astro"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@astrojs/deno": "^5.0.1",
|
||||||
|
"@astrojs/tailwind": "^5.1.0",
|
||||||
|
"@astrojs/vue": "4.0.8",
|
||||||
|
"astro": "^4.3.7",
|
||||||
|
"tailwindcss": "^3.4.1",
|
||||||
|
"vue": "^3.4.19"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"sass": "1.70.0",
|
||||||
|
"typescript": "^5.3.3"
|
||||||
|
}
|
||||||
|
}
|
4185
fe/pnpm-lock.yaml
Normal file
4185
fe/pnpm-lock.yaml
Normal file
File diff suppressed because it is too large
Load diff
BIN
fe/public/favicon.png
Normal file
BIN
fe/public/favicon.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 74 KiB |
13
fe/public/favicon.svg
Normal file
13
fe/public/favicon.svg
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 36 36">
|
||||||
|
<path fill="#000" d="M22.25 4h-8.5a1 1 0 0 0-.96.73l-5.54 19.4a.5.5 0 0 0 .62.62l5.05-1.44a2 2 0 0 0 1.38-1.4l3.22-11.66a.5.5 0 0 1 .96 0l3.22 11.67a2 2 0 0 0 1.38 1.39l5.05 1.44a.5.5 0 0 0 .62-.62l-5.54-19.4a1 1 0 0 0-.96-.73Z"/>
|
||||||
|
<path fill="url(#gradient)" d="M18 28a7.63 7.63 0 0 1-5-2c-1.4 2.1-.35 4.35.6 5.55.14.17.41.07.47-.15.44-1.8 2.93-1.22 2.93.6 0 2.28.87 3.4 1.72 3.81.34.16.59-.2.49-.56-.31-1.05-.29-2.46 1.29-3.25 3-1.5 3.17-4.83 2.5-6-.67.67-2.6 2-5 2Z"/>
|
||||||
|
<defs>
|
||||||
|
<linearGradient id="gradient" x1="16" x2="16" y1="32" y2="24" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop stop-color="#000"/>
|
||||||
|
<stop offset="1" stop-color="#000" stop-opacity="0"/>
|
||||||
|
</linearGradient>
|
||||||
|
</defs>
|
||||||
|
<style>
|
||||||
|
@media (prefers-color-scheme:dark){:root{filter:invert(100%)}}
|
||||||
|
</style>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 873 B |
1
fe/public/icons/arrow-left.svg
Normal file
1
fe/public/icons/arrow-left.svg
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>
|
After Width: | Height: | Size: 312 B |
1
fe/public/icons/home.svg
Normal file
1
fe/public/icons/home.svg
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-home"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg>
|
After Width: | Height: | Size: 332 B |
BIN
fe/public/yr.jpg
Normal file
BIN
fe/public/yr.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 171 KiB |
4
fe/src/assets/styles/_colours.scss
Normal file
4
fe/src/assets/styles/_colours.scss
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
$bg-colour-light: rgb(187, 187, 187);
|
||||||
|
$accent-colour-light: rgb(24, 96, 231);
|
||||||
|
$filter-accent-colour-light: invert(34%) sepia(96%) saturate(4970%) hue-rotate(216deg) brightness(95%) contrast(91%);
|
||||||
|
$filter-link-colour-dark: invert(99%) sepia(52%) saturate(532%) hue-rotate(308deg) brightness(100%) contrast(95%);
|
20
fe/src/assets/styles/globals.scss
Normal file
20
fe/src/assets/styles/globals.scss
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
@use 'colours';
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;700&display=swap');
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Ubuntu', sans-serif !important;
|
||||||
|
background-color: wheat !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
min-height: 80vh;
|
||||||
|
padding: 0 0.5rem;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 3rem;
|
||||||
|
}
|
3
fe/src/assets/styles/index.scss
Normal file
3
fe/src/assets/styles/index.scss
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
@use 'colours';
|
||||||
|
|
||||||
|
|
62
fe/src/components/Card.astro
Normal file
62
fe/src/components/Card.astro
Normal file
|
@ -0,0 +1,62 @@
|
||||||
|
---
|
||||||
|
export interface Props {
|
||||||
|
title: string;
|
||||||
|
body: string;
|
||||||
|
href: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { href, title, body } = Astro.props;
|
||||||
|
---
|
||||||
|
|
||||||
|
<li class="link-card">
|
||||||
|
<a href={href}>
|
||||||
|
<h2>
|
||||||
|
{title}
|
||||||
|
<span>→</span>
|
||||||
|
</h2>
|
||||||
|
<p>
|
||||||
|
{body}
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<style>
|
||||||
|
.link-card {
|
||||||
|
list-style: none;
|
||||||
|
display: flex;
|
||||||
|
padding: 0.15rem;
|
||||||
|
background-color: white;
|
||||||
|
background-image: var(--accent-gradient);
|
||||||
|
background-size: 400%;
|
||||||
|
border-radius: 0.5rem;
|
||||||
|
background-position: 100%;
|
||||||
|
transition: background-position 0.6s cubic-bezier(0.22, 1, 0.36, 1);
|
||||||
|
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.link-card > a {
|
||||||
|
width: 100%;
|
||||||
|
text-decoration: none;
|
||||||
|
line-height: 1.4;
|
||||||
|
padding: 1rem 1.3rem;
|
||||||
|
border-radius: 0.35rem;
|
||||||
|
color: #111;
|
||||||
|
background-color: white;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 1.25rem;
|
||||||
|
transition: color 0.6s cubic-bezier(0.22, 1, 0.36, 1);
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
margin-bottom: 0;
|
||||||
|
color: #444;
|
||||||
|
}
|
||||||
|
.link-card:is(:hover, :focus-within) {
|
||||||
|
background-position: 0;
|
||||||
|
}
|
||||||
|
.link-card:is(:hover, :focus-within) h2 {
|
||||||
|
color: rgb(var(--accent));
|
||||||
|
}
|
||||||
|
</style>
|
58
fe/src/components/LinkCard.astro
Normal file
58
fe/src/components/LinkCard.astro
Normal file
|
@ -0,0 +1,58 @@
|
||||||
|
---
|
||||||
|
export interface Props {
|
||||||
|
title: string;
|
||||||
|
to: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { to, title } = Astro.props;
|
||||||
|
|
||||||
|
const isExternal = to.startsWith('http');
|
||||||
|
---
|
||||||
|
{ isExternal == true ? (
|
||||||
|
<a href={to} target="_blank" rel="noopener noreferrer" class="bg-gray-50 hover:bg-gray-100 dark:bg-slate-700 dark:hover:bg-slate-600 m-4 px-5 py-5 md:px-10 rounded-3xl shadow-lg hover:shadow-xl">
|
||||||
|
<p>{title} →</p>
|
||||||
|
</a>
|
||||||
|
) : (
|
||||||
|
<a href={to} class="bg-gray-50 hover:bg-gray-100 dark:bg-slate-700 dark:hover:bg-slate-600 m-4 px-5 py-5 md:px-10 rounded-3xl shadow-lg hover:shadow-xl">
|
||||||
|
<p>{title} →</p>
|
||||||
|
</a>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
<style lang="scss">
|
||||||
|
@use '../assets/styles/colours';
|
||||||
|
.card {
|
||||||
|
margin: 1rem;
|
||||||
|
padding: 1.5rem;
|
||||||
|
text-align: left;
|
||||||
|
color: inherit;
|
||||||
|
text-decoration: none;
|
||||||
|
border: 2px solid #000;
|
||||||
|
border-radius: 20px;
|
||||||
|
transition: color 0.15s ease, border-color 0.15s ease;
|
||||||
|
}
|
||||||
|
.card p {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 1.25rem;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card:link,
|
||||||
|
.card:visited {
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card:hover,
|
||||||
|
.card:focus,
|
||||||
|
.card:active {
|
||||||
|
color: colours.$accent-colour-light !important;
|
||||||
|
border-color: colours.$accent-colour-light;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 600px) {
|
||||||
|
.card {
|
||||||
|
margin: 0.5rem;
|
||||||
|
padding: 1.25rem;
|
||||||
|
width: 9rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
66
fe/src/components/NavBar.astro
Normal file
66
fe/src/components/NavBar.astro
Normal file
|
@ -0,0 +1,66 @@
|
||||||
|
---
|
||||||
|
export interface Props {
|
||||||
|
links: {
|
||||||
|
to: string;
|
||||||
|
name: string;
|
||||||
|
img: {
|
||||||
|
src: string;
|
||||||
|
alt: string;
|
||||||
|
}
|
||||||
|
}[]
|
||||||
|
}
|
||||||
|
|
||||||
|
const { links } = Astro.props;
|
||||||
|
---
|
||||||
|
|
||||||
|
<nav>
|
||||||
|
{ links.map(link => (
|
||||||
|
<div class="nav-button">
|
||||||
|
<a href={link.to}>
|
||||||
|
<img src={link.img.src} alt={link.img.alt} />
|
||||||
|
<p>{ link.name }</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
))
|
||||||
|
}
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
@use '../assets/styles/colours';
|
||||||
|
nav {
|
||||||
|
margin: 0 auto;
|
||||||
|
position: -webkit-sticky;
|
||||||
|
position: sticky;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav :hover {
|
||||||
|
filter: colours.$filter-accent-colour-light;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-button {
|
||||||
|
margin: 0 1rem;
|
||||||
|
padding: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
nav :not(:hover) {
|
||||||
|
filter: colours.$filter-link-colour-dark;
|
||||||
|
}
|
||||||
|
.nav-button :hover {
|
||||||
|
filter: invert(100%) sepia(25%) saturate(4030%) hue-rotate(177deg) brightness(98%) contrast(97%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
40
fe/src/components/TimeFormat.vue
Normal file
40
fe/src/components/TimeFormat.vue
Normal file
|
@ -0,0 +1,40 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { defineComponent } from 'vue'
|
||||||
|
|
||||||
|
type TimeFormatProps = {
|
||||||
|
day: string | undefined,
|
||||||
|
month: string | undefined,
|
||||||
|
year: string | undefined,
|
||||||
|
hour: string | undefined,
|
||||||
|
minute: string | undefined,
|
||||||
|
second: string | undefined,
|
||||||
|
weekday: string | undefined,
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
formats: {
|
||||||
|
type: Array<TimeFormatProps>,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
dFormat: {
|
||||||
|
type: String,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
const crntTime = Date.now();
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<code>
|
||||||
|
{{ `<t:${Math.floor(crntTime / 1000)}:${props.dFormat}>` }}
|
||||||
|
</code>
|
||||||
|
<span>
|
||||||
|
to get
|
||||||
|
<code>
|
||||||
|
<span v-for="format in props.formats" :key="Math.floor(Math.random()*1000)">
|
||||||
|
{{Intl.DateTimeFormat(Intl.Locale, format).format(crntTime) + ' '}}
|
||||||
|
</span>
|
||||||
|
</code>
|
||||||
|
</span>
|
||||||
|
</template>
|
4
fe/src/components/TimeZone.vue
Normal file
4
fe/src/components/TimeZone.vue
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<span>{{Intl.DateTimeFormat().resolvedOptions().timeZone}}</span>
|
||||||
|
</template>
|
9
fe/src/components/UnixTime.vue
Normal file
9
fe/src/components/UnixTime.vue
Normal file
|
@ -0,0 +1,9 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { defineProps } from 'vue';
|
||||||
|
|
||||||
|
const crntTime = Date.now();
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<p>The current time in Unix Epoch: <code>{{ Math.floor(crntTime / 1000) }}</code> <br /> or <code>{{crntTime}}</code> in Unix millis</p>
|
||||||
|
</template>
|
1
fe/src/env.d.ts
vendored
Normal file
1
fe/src/env.d.ts
vendored
Normal file
|
@ -0,0 +1 @@
|
||||||
|
/// <reference types="astro/client" />
|
108
fe/src/layouts/Layout.astro
Normal file
108
fe/src/layouts/Layout.astro
Normal file
|
@ -0,0 +1,108 @@
|
||||||
|
---
|
||||||
|
import NavBar from '../components/NavBar.astro';
|
||||||
|
|
||||||
|
export interface Props {
|
||||||
|
title: string;
|
||||||
|
navLinks: {
|
||||||
|
to: string;
|
||||||
|
name: string;
|
||||||
|
img: {
|
||||||
|
src: string;
|
||||||
|
alt: string;
|
||||||
|
}
|
||||||
|
}[] | undefined
|
||||||
|
}
|
||||||
|
|
||||||
|
const { title, navLinks } = Astro.props;
|
||||||
|
import { ViewTransitions } from 'astro:transitions';
|
||||||
|
---
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<ViewTransitions />
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width" />
|
||||||
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||||
|
<meta name="generator" content={Astro.generator} />
|
||||||
|
<title>{title}</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
{ navLinks != undefined ? (
|
||||||
|
<NavBar links={navLinks} />
|
||||||
|
) : (<!-- If there were NavLinks, they would be here -->)
|
||||||
|
}
|
||||||
|
<slot />
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
<style lang="scss" is:global>
|
||||||
|
@use "../assets/styles/colours";
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;700&display=swap');
|
||||||
|
|
||||||
|
body {
|
||||||
|
background-color: colours.$bg-colour-light;
|
||||||
|
font-family: 'Ubuntu', sans-serif !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
min-height: 80vh;
|
||||||
|
padding: 0 0.5rem;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 3rem;
|
||||||
|
}
|
||||||
|
.footer {
|
||||||
|
width: 100%;
|
||||||
|
height: 100px;
|
||||||
|
border-top: 1px solid #eaeaea;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer a:hover {
|
||||||
|
color: #0070f3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer a {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-grow: 1;
|
||||||
|
color: #eaeaea;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grid-2 {
|
||||||
|
display: grid;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grid-3 {
|
||||||
|
display: grid;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
grid-template-columns: 1fr 1fr 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 600px) {
|
||||||
|
.grid-3 {
|
||||||
|
width: 90%;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Dark mode */
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
body {
|
||||||
|
background-color: #1E293B !important;
|
||||||
|
color: antiquewhite;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
39
fe/src/pages/index.astro
Normal file
39
fe/src/pages/index.astro
Normal file
|
@ -0,0 +1,39 @@
|
||||||
|
---
|
||||||
|
import Layout from '../layouts/Layout.astro';
|
||||||
|
import LinkCard from '../components/LinkCard.astro';
|
||||||
|
---
|
||||||
|
|
||||||
|
<Layout title="Vänner Bästa">
|
||||||
|
<main class="grid place-items-center h-screen">
|
||||||
|
<div class="grid place-items-center">
|
||||||
|
<h1 class="text-6xl font-bold underline">Vänner Bästa</h1>
|
||||||
|
<div class="mt-10 mx-4 place-items-center" >
|
||||||
|
<p>
|
||||||
|
A Young Royals fan website with links to different discussion
|
||||||
|
spaces.
|
||||||
|
</p>
|
||||||
|
<strong class="pt-5" >It's official! Series 3 is coming!</strong>
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-2 md:grid-cols-3 mt-10">
|
||||||
|
<LinkCard
|
||||||
|
title="Watch"
|
||||||
|
to="https://www.netflix.com/title/81210762"
|
||||||
|
/>
|
||||||
|
<LinkCard title="Discord" to="https://discord.gg/hyKVDeRJ8Y" />
|
||||||
|
<LinkCard
|
||||||
|
title="Reddit"
|
||||||
|
to="https://www.reddit.com/r/YoungRoyals/"
|
||||||
|
/>
|
||||||
|
<LinkCard
|
||||||
|
title="Babbel (ref)"
|
||||||
|
to="https://www.talkable.com/x/IchxFl"
|
||||||
|
/>
|
||||||
|
<LinkCard
|
||||||
|
title="Matrix"
|
||||||
|
to="https://matrix.to/#/#young-royals:matrix.org"
|
||||||
|
/>
|
||||||
|
<LinkCard title="Discord Utilities" to="/utilities" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</Layout>
|
42
fe/src/pages/utilities/birthdays.astro
Normal file
42
fe/src/pages/utilities/birthdays.astro
Normal file
|
@ -0,0 +1,42 @@
|
||||||
|
---
|
||||||
|
import TimeZone from "../../components/TimeZone.vue";
|
||||||
|
import Layout from "../../layouts/Layout.astro";
|
||||||
|
|
||||||
|
const navLinks = [
|
||||||
|
{
|
||||||
|
img: {
|
||||||
|
src: '/icons/arrow-left.svg',
|
||||||
|
alt: 'Back to Utilities',
|
||||||
|
},
|
||||||
|
to: '/utilities',
|
||||||
|
name: "Utilities",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
img: {
|
||||||
|
src: '/icons/home.svg',
|
||||||
|
alt: 'Go Home',
|
||||||
|
},
|
||||||
|
to: '/',
|
||||||
|
name: "Home",
|
||||||
|
},
|
||||||
|
];
|
||||||
|
---
|
||||||
|
|
||||||
|
<Layout title="Vänner Bästa | Birthdays" navLinks={navLinks}>
|
||||||
|
<div class="container grid place-items-center">
|
||||||
|
<div class="grid place-items-center">
|
||||||
|
<h1 class="text-6xl font-bold underline p-4">Birthdays</h1>
|
||||||
|
<p class="p-4">
|
||||||
|
Discord bots are changing. <br />
|
||||||
|
This means that we can no longer provide you with the command to set
|
||||||
|
your birthday. <br />
|
||||||
|
Instead, this page now gives you your timezone for use with Discord
|
||||||
|
bots.
|
||||||
|
</p>
|
||||||
|
<h2 class="p-4 text-4xl">
|
||||||
|
Your timezone:
|
||||||
|
<TimeZone class="underline" client:load/>
|
||||||
|
</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Layout>
|
27
fe/src/pages/utilities/index.astro
Normal file
27
fe/src/pages/utilities/index.astro
Normal file
|
@ -0,0 +1,27 @@
|
||||||
|
---
|
||||||
|
import LinkCard from "../../components/LinkCard.astro";
|
||||||
|
import NavBar from "../../components/NavBar.astro";
|
||||||
|
import Layout from '../../layouts/Layout.astro';
|
||||||
|
|
||||||
|
const navLinks = [
|
||||||
|
{
|
||||||
|
img: {
|
||||||
|
src: '/icons/home.svg',
|
||||||
|
alt: 'Go Home',
|
||||||
|
},
|
||||||
|
to: '/',
|
||||||
|
name: "Home",
|
||||||
|
},
|
||||||
|
];
|
||||||
|
---
|
||||||
|
<Layout title="Vänner Bästa | Utilities" navLinks={navLinks}>
|
||||||
|
<div class="container grid place-items-center">
|
||||||
|
<div class="">
|
||||||
|
<h1 class="title">Utilities for the Discord Server</h1>
|
||||||
|
<div class="grid-2">
|
||||||
|
<LinkCard title="Birthdays" to="/utilities/birthdays" />
|
||||||
|
<LinkCard title="Time" to="/utilities/time" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Layout>
|
79
fe/src/pages/utilities/time.astro
Normal file
79
fe/src/pages/utilities/time.astro
Normal file
|
@ -0,0 +1,79 @@
|
||||||
|
---
|
||||||
|
|
||||||
|
import NavBar from "../../components/NavBar.astro";
|
||||||
|
import TimeZone from "../../components/TimeZone.vue";
|
||||||
|
import Layout from "../../layouts/Layout.astro";
|
||||||
|
import TimeFormat from "../../components/TimeFormat.vue";
|
||||||
|
import UnixTime from "../../components/UnixTime.vue";
|
||||||
|
|
||||||
|
const navLinks = [
|
||||||
|
{
|
||||||
|
img: {
|
||||||
|
src: '/icons/arrow-left.svg',
|
||||||
|
alt: 'Back to Utilities',
|
||||||
|
},
|
||||||
|
to: '/utilities',
|
||||||
|
name: 'Utilities',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
img: {
|
||||||
|
src: '/icons/home.svg',
|
||||||
|
alt: 'Go Home',
|
||||||
|
},
|
||||||
|
to: '/',
|
||||||
|
name: 'Home',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
---
|
||||||
|
|
||||||
|
<Layout title="VännerBästa | Time" navLinks={navLinks}>
|
||||||
|
<div class="container grid place-items-center">
|
||||||
|
<div class="grid place-items-center">
|
||||||
|
<h1 class="text-6xl font-bold underline p-4">Time Utilities</h1>
|
||||||
|
<p class="p-4">
|
||||||
|
Your current timezone:
|
||||||
|
<TimeZone client:load />
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<UnixTime client:load/>
|
||||||
|
|
||||||
|
<p class="p-4">
|
||||||
|
To format the time for Discord, you can use: <br />
|
||||||
|
<TimeFormat formats={[{
|
||||||
|
day: 'numeric',
|
||||||
|
month: 'long',
|
||||||
|
year: 'numeric',
|
||||||
|
}, {hour: '2-digit', minute: '2-digit'}]} dFormat="f" client:only />
|
||||||
|
<br />
|
||||||
|
<TimeFormat formats={[{
|
||||||
|
weekday: 'long',
|
||||||
|
day: 'numeric',
|
||||||
|
month: 'long',
|
||||||
|
year: 'numeric',
|
||||||
|
}, { hour: '2-digit', minute: '2-digit', }]} dFormat="F" client:only />
|
||||||
|
<br />
|
||||||
|
<TimeFormat formats={[{
|
||||||
|
hour: '2-digit',
|
||||||
|
minute: '2-digit',
|
||||||
|
}]} dFormat="t" client:only />
|
||||||
|
<br />
|
||||||
|
<TimeFormat formats={[{
|
||||||
|
hour: '2-digit',
|
||||||
|
minute: '2-digit',
|
||||||
|
second: '2-digit',
|
||||||
|
}]} dFormat="T" client:only />
|
||||||
|
<br />
|
||||||
|
<TimeFormat formats={[{
|
||||||
|
day: '2-digit',
|
||||||
|
month: '2-digit',
|
||||||
|
year: 'numeric',
|
||||||
|
}]} dFormat="d" client:only />
|
||||||
|
<br />
|
||||||
|
<TimeFormat formats={[{
|
||||||
|
day: 'numeric',
|
||||||
|
month: 'long',
|
||||||
|
year: 'numeric',
|
||||||
|
}]} dFormat="D" client:only />
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</Layout>
|
12
fe/tailwind.config.cjs
Normal file
12
fe/tailwind.config.cjs
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
/** @type {import('tailwindcss').Config} */
|
||||||
|
module.exports = {
|
||||||
|
content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
|
||||||
|
theme: {
|
||||||
|
extend: {
|
||||||
|
colors: {
|
||||||
|
'wheat': "#F8EBD9"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
plugins: [],
|
||||||
|
}
|
3
fe/tsconfig.json
Normal file
3
fe/tsconfig.json
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
{
|
||||||
|
"extends": "astro/tsconfigs/strict"
|
||||||
|
}
|
BIN
friends-best
Executable file
BIN
friends-best
Executable file
Binary file not shown.
20
justfile
Normal file
20
justfile
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
build-fe:
|
||||||
|
cd ./fe && pnpm build && cd ..
|
||||||
|
|
||||||
|
build-server:
|
||||||
|
go build ./server
|
||||||
|
|
||||||
|
build-all:
|
||||||
|
cd ./fe && pnpm build && cp -r ./dist .. && cd ..
|
||||||
|
go build ./server
|
||||||
|
|
||||||
|
git:
|
||||||
|
git add -A && git commit -sS && git push
|
||||||
|
|
||||||
|
serve: build-all
|
||||||
|
./friends-best
|
||||||
|
|
||||||
|
go-tidy:
|
||||||
|
cd ./server && go mod tidy && cd ..
|
||||||
|
go-get MOD:
|
||||||
|
cd ./server && go get {{MOD}} && cd ..
|
|
@ -1,2 +0,0 @@
|
||||||
export default defineNuxtRouteMiddleware((to, from) => {
|
|
||||||
})
|
|
|
@ -1,28 +0,0 @@
|
||||||
// https://v3.nuxtjs.org/api/configuration/nuxt.config
|
|
||||||
export default defineNuxtConfig({
|
|
||||||
nitro: {
|
|
||||||
//plugins: ['~/server/index.ts'],
|
|
||||||
},
|
|
||||||
runtimeConfig: {
|
|
||||||
dbUri: process.env.DATABASE_URL || '',
|
|
||||||
discordClientId: process.env.DISCORD_CID || '',
|
|
||||||
discordClientSecret: process.env.DISCORD_CS || '',
|
|
||||||
discordRedirectUri: process.env.DISCORD_REDIRECT_URI || 'http://localhost:3000/auth/v1/callback',
|
|
||||||
discordGuildId: process.env.DISCORD_GUILD || '',
|
|
||||||
discordAdminRoleId: process.env.DISCORD_ADMIN_ROLE || '',
|
|
||||||
discordStaffRoleId: process.env.DISCORD_STAFF_ROLE || '',
|
|
||||||
jwtSecret: process.env.JWT_SECRET || 'not_so_secret',
|
|
||||||
},
|
|
||||||
modules: ["@nuxtjs/tailwindcss", "@nuxtjs/color-mode"],
|
|
||||||
colorMode: {
|
|
||||||
preference: 'system'
|
|
||||||
},
|
|
||||||
app: {
|
|
||||||
head: {
|
|
||||||
title: 'Vanner Basta',
|
|
||||||
meta: [
|
|
||||||
{name: "theme-color", media: "(prefers-color-scheme: dark)", content: "#1E293B"}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
24
package.json
24
package.json
|
@ -1,24 +0,0 @@
|
||||||
{
|
|
||||||
"private": true,
|
|
||||||
"scripts": {
|
|
||||||
"build": "nuxt build",
|
|
||||||
"dev": "nuxt dev",
|
|
||||||
"generate": "nuxt generate",
|
|
||||||
"preview": "nuxt preview",
|
|
||||||
"postinstall": "nuxt prepare"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@nuxtjs/color-mode": "3.2.0",
|
|
||||||
"@nuxtjs/tailwindcss": "6.6.7",
|
|
||||||
"@types/jsonwebtoken": "9.0.2",
|
|
||||||
"nuxt": "3.4.3",
|
|
||||||
"prisma": "4.14.0",
|
|
||||||
"tailwindcss": "3.3.2"
|
|
||||||
},
|
|
||||||
"dependencies": {
|
|
||||||
"@prisma/client": "4.14.0",
|
|
||||||
"jose": "4.14.4",
|
|
||||||
"scss": "0.2.4",
|
|
||||||
"zod": "3.21.4"
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,22 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
const router = useRouter()
|
|
||||||
definePageMeta({
|
|
||||||
middleware: 'auth'
|
|
||||||
})
|
|
||||||
|
|
||||||
async function logout() {
|
|
||||||
router.push('/login')
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="grid h-screen place-items-center">
|
|
||||||
<div class="grid place-items-center">
|
|
||||||
<h1 class="text-6xl font-bold underline">Vänner Bästa | Dash</h1>
|
|
||||||
<div class="mt-10 mx-4 place-items-center">
|
|
||||||
<p>Logged in as {{ user?.user_metadata?.full_name }}</p>
|
|
||||||
<button @click="logout" >Logout</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
|
@ -1,45 +0,0 @@
|
||||||
<template>
|
|
||||||
<NavHeader :links="false" class="h-screen-1/20" />
|
|
||||||
<div class="grid h-screen-19/20 place-items-center">
|
|
||||||
<div class="grid place-items-center">
|
|
||||||
<h1 class="text-6xl font-bold underline">Vänner Bästa</h1>
|
|
||||||
<div class="mt-10 mx-4 place-items-center">
|
|
||||||
<p>A Young Royals fan website with links to different discussion spaces.</p>
|
|
||||||
<strong class="pt-5">Season 2 is out now!</strong>
|
|
||||||
</div>
|
|
||||||
<div class="grid grid-cols-2 md:grid-cols-3 mt-10">
|
|
||||||
<LLink v-for="link in links" :to="link.href" :title="link.title" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
|
|
||||||
const links: Array<{href: string, title: string}> = [
|
|
||||||
{
|
|
||||||
href: "https://netflix.com",
|
|
||||||
title: "Netflix"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
href: "https://discord.gg/youngroyals",
|
|
||||||
title: "Discord"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
href: "https://reddit.com/r/youngroyals",
|
|
||||||
title: "Reddit"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
href: "https://www.talkable.com/x/IchxFl",
|
|
||||||
title: "Babbel (ref)"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
href: "/utilities",
|
|
||||||
title: "Discord Utilities"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
href: "/dash",
|
|
||||||
title: "Dashboard"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
</script>
|
|
|
@ -1,13 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="grid h-screen place-items-center">
|
|
||||||
<div class="grid place-items-center">
|
|
||||||
<h1 class="text-6xl font-bold underline">Vänner Bästa | Login</h1>
|
|
||||||
<div class="mt-10 mx-4 place-items-center">
|
|
||||||
<a href="https://discord.com/api/oauth2/authorize?client_id=1105533416377688174&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fauth%2Fv1%2Fcallback&response_type=code&scope=identify%20guilds%20guilds.members.read" >Login with Discord</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
</script>
|
|
|
@ -1,20 +0,0 @@
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<NavHeader class="h-screen-1/20" />
|
|
||||||
<div class="grid h-screen-19/20 place-items-center">
|
|
||||||
<div class="grid place-items-center">
|
|
||||||
<h1 class="text-6xl font-bold underline p-4">Birthdays</h1>
|
|
||||||
<p class="p-4">
|
|
||||||
Discord bots are changing. <br />
|
|
||||||
This means that we can no longer provide you with the command to set your birthday. <br />
|
|
||||||
Instead, this page now gives you your timezone for use with Discord bots.
|
|
||||||
</p>
|
|
||||||
<h2 class="p-4 text-4xl" >Your timezone: <span class="underline" >{{ timezone }}</span></h2>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
|
|
||||||
</script>
|
|
|
@ -1,26 +0,0 @@
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<NavHeader class="h-screen-1/20" />
|
|
||||||
<div class="grid h-screen-19/20 place-items-center">
|
|
||||||
<div class="grid place-items-center">
|
|
||||||
<h1 class="text-6xl font-bold underline">Vänner Bästa</h1>
|
|
||||||
<div class="grid grid-cols-2 mt-10">
|
|
||||||
<LLink v-for="link in links" :to="link.href" :title="link.title" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
const links: Array<{href: string, title: string}> = [
|
|
||||||
{
|
|
||||||
href: "/utilities/birthdays",
|
|
||||||
title: "Birthdays"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
href: "/utilities/time",
|
|
||||||
title: "Time"
|
|
||||||
},
|
|
||||||
]
|
|
||||||
</script>
|
|
|
@ -1,52 +0,0 @@
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<NavHeader class="h-screen-1/20" />
|
|
||||||
<div class="grid h-screen-19/20 place-items-center">
|
|
||||||
<div class="grid place-items-center">
|
|
||||||
<h1 class="text-6xl font-bold underline p-4">Time Utilities</h1>
|
|
||||||
<p class="p-4" >Your current timezone: {{ timezone }}</p>
|
|
||||||
<p>
|
|
||||||
The current time in Unix Epoch: <code>{{ Math.floor(unix/1000) }}</code> <br />
|
|
||||||
or <code>{{ unix }}</code> in milliseconds.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p class="p-4">
|
|
||||||
To format the time for Discord, you can use: <br />
|
|
||||||
<TimeFormat :crnt-time="unix" d-format="f" :format="{
|
|
||||||
dateStyle: 'long',
|
|
||||||
timeStyle: 'short',
|
|
||||||
hour12: false
|
|
||||||
}"/> <br />
|
|
||||||
<TimeFormat :format="{
|
|
||||||
dateStyle: 'full',
|
|
||||||
timeStyle: 'short',
|
|
||||||
hour12: false
|
|
||||||
}" dFormat="F" :crnt-time="unix" />
|
|
||||||
<br />
|
|
||||||
<TimeFormat :format="{
|
|
||||||
timeStyle: 'short',
|
|
||||||
hour12: false
|
|
||||||
}" dFormat="t" :crnt-time="unix" />
|
|
||||||
<br />
|
|
||||||
<TimeFormat :format="{
|
|
||||||
timeStyle: 'medium',
|
|
||||||
hour12: false
|
|
||||||
}" dFormat="T" :crnt-time="unix" />
|
|
||||||
<br />
|
|
||||||
<TimeFormat :format="{
|
|
||||||
dateStyle: 'short'
|
|
||||||
}" dFormat="d" :crnt-time="unix" />
|
|
||||||
<br />
|
|
||||||
<TimeFormat :format="{
|
|
||||||
dateStyle: 'medium'
|
|
||||||
}" dFormat="D" :crnt-time="unix" />
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
|
|
||||||
const unix = Date.now();
|
|
||||||
</script>
|
|
5915
pnpm-lock.yaml
5915
pnpm-lock.yaml
File diff suppressed because it is too large
Load diff
|
@ -1,62 +0,0 @@
|
||||||
generator client {
|
|
||||||
provider = "prisma-client-js"
|
|
||||||
}
|
|
||||||
|
|
||||||
datasource db {
|
|
||||||
provider = "postgresql"
|
|
||||||
url = env("DATABASE_URL")
|
|
||||||
}
|
|
||||||
|
|
||||||
model content_data {
|
|
||||||
id Int @id @default(autoincrement())
|
|
||||||
data String @db.VarChar
|
|
||||||
type String @db.VarChar
|
|
||||||
localised_content localised_content? @relation(fields: [localised_contentId], references: [id])
|
|
||||||
localised_contentId Int?
|
|
||||||
}
|
|
||||||
|
|
||||||
model localised_content {
|
|
||||||
id Int @id @default(autoincrement())
|
|
||||||
language String @db.VarChar
|
|
||||||
content String @db.VarChar
|
|
||||||
data content_data[]
|
|
||||||
element page_elements? @relation(fields: [elementId], references: [id])
|
|
||||||
elementId Int?
|
|
||||||
}
|
|
||||||
|
|
||||||
model page_elements {
|
|
||||||
id Int @id @default(autoincrement())
|
|
||||||
name String @db.VarChar
|
|
||||||
type String @db.VarChar
|
|
||||||
localisedContent localised_content[]
|
|
||||||
page pages? @relation(fields: [pageId], references: [id])
|
|
||||||
pageId Int?
|
|
||||||
}
|
|
||||||
|
|
||||||
model pages {
|
|
||||||
id Int @id @default(autoincrement())
|
|
||||||
name String @db.VarChar
|
|
||||||
description String @db.VarChar
|
|
||||||
elements page_elements[]
|
|
||||||
site sites? @relation(fields: [siteId], references: [id])
|
|
||||||
siteId Int?
|
|
||||||
}
|
|
||||||
|
|
||||||
model sites {
|
|
||||||
id Int @id @default(autoincrement())
|
|
||||||
site_name String @db.VarChar
|
|
||||||
owner_id String @db.VarChar
|
|
||||||
site_url String @db.VarChar
|
|
||||||
pages pages[]
|
|
||||||
}
|
|
||||||
|
|
||||||
model user {
|
|
||||||
id String @id @default(uuid())
|
|
||||||
name String
|
|
||||||
discord_id String @unique
|
|
||||||
created_at DateTime @default(now())
|
|
||||||
updated_at DateTime @updatedAt
|
|
||||||
is_admin Boolean @default(false)
|
|
||||||
is_staff Boolean @default(false)
|
|
||||||
is_member Boolean @default(false)
|
|
||||||
}
|
|
10
server/go.mod
Normal file
10
server/go.mod
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
module git.ludoviko.ch/lucxjo/friends-best
|
||||||
|
|
||||||
|
go 1.21.6
|
||||||
|
|
||||||
|
require (
|
||||||
|
github.com/gorilla/mux v1.8.1
|
||||||
|
github.com/sirupsen/logrus v1.9.3
|
||||||
|
)
|
||||||
|
|
||||||
|
require golang.org/x/sys v0.0.0-20220715151400-c0bba94af5f8 // indirect
|
17
server/go.sum
Normal file
17
server/go.sum
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
|
||||||
|
github.com/davecgh/go-spew v1.1.1 h1:vj9j/u1bqnvCEfJOwUhtlOARqs3+rkHYY13jYWTU97c=
|
||||||
|
github.com/davecgh/go-spew v1.1.1/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
|
||||||
|
github.com/gorilla/mux v1.8.1 h1:TuBL49tXwgrFYWhqrNgrUNEY92u81SPhu7sTdzQEiWY=
|
||||||
|
github.com/gorilla/mux v1.8.1/go.mod h1:AKf9I4AEqPTmMytcMc0KkNouC66V3BtZ4qD5fmWSiMQ=
|
||||||
|
github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZbAQM=
|
||||||
|
github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
|
||||||
|
github.com/sirupsen/logrus v1.9.3 h1:dueUQJ1C2q9oE3F7wvmSGAaVtTmUizReu6fjN8uqzbQ=
|
||||||
|
github.com/sirupsen/logrus v1.9.3/go.mod h1:naHLuLoDiP4jHNo9R0sCBMtWGeIprob74mVsIT4qYEQ=
|
||||||
|
github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
|
||||||
|
github.com/stretchr/testify v1.7.0 h1:nwc3DEeHmmLAfoZucVR881uASk0Mfjw8xYJ99tb5CcY=
|
||||||
|
github.com/stretchr/testify v1.7.0/go.mod h1:6Fq8oRcR53rry900zMqJjRRixrwX3KX962/h/Wwjteg=
|
||||||
|
golang.org/x/sys v0.0.0-20220715151400-c0bba94af5f8 h1:0A+M6Uqn+Eje4kHMK80dtF3JCXC4ykBgQG4Fe06QRhQ=
|
||||||
|
golang.org/x/sys v0.0.0-20220715151400-c0bba94af5f8/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
|
||||||
|
gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
|
||||||
|
gopkg.in/yaml.v3 v3.0.0-20200313102051-9f266ea9e77c h1:dUUwHk2QECo/6vqA44rthZ8ie2QXMNeKRTHCNY2nXvo=
|
||||||
|
gopkg.in/yaml.v3 v3.0.0-20200313102051-9f266ea9e77c/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
|
|
@ -1,8 +0,0 @@
|
||||||
export const runtimeConfig = useRuntimeConfig();
|
|
||||||
import { PrismaClient } from '@prisma/client';
|
|
||||||
import { Nitro } from 'nitropack';
|
|
||||||
|
|
||||||
export const prisma = new PrismaClient();
|
|
||||||
|
|
||||||
export default async (_nitroApp: Nitro) => {
|
|
||||||
};
|
|
17
server/main.go
Normal file
17
server/main.go
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
package main
|
||||||
|
|
||||||
|
import (
|
||||||
|
"github.com/gorilla/mux"
|
||||||
|
"net/http"
|
||||||
|
log "github.com/sirupsen/logrus"
|
||||||
|
)
|
||||||
|
|
||||||
|
func main() {
|
||||||
|
r := mux.NewRouter()
|
||||||
|
|
||||||
|
r.PathPrefix("/").Handler(http.FileServer(http.Dir("./dist")))
|
||||||
|
|
||||||
|
if err := http.ListenAndServe(":3000", r); err != nil {
|
||||||
|
log.Fatalf("failed to start server: %v", err)
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,203 +0,0 @@
|
||||||
import { runtimeConfig, prisma } from '~/server/index'
|
|
||||||
import * as jose from 'jose'
|
|
||||||
import { z } from 'zod';
|
|
||||||
|
|
||||||
const PartialUserGuildSchema = z.object({
|
|
||||||
id: z.string(),
|
|
||||||
name: z.string(),
|
|
||||||
icon: z.string().nullable(),
|
|
||||||
owner: z.boolean(),
|
|
||||||
permissions: z.number(),
|
|
||||||
features: z.array(z.string()),
|
|
||||||
});
|
|
||||||
|
|
||||||
const UserGuildSchema = z.object({
|
|
||||||
avatar: z.string().nullable(),
|
|
||||||
communication_disabled_until: z.string().nullable(),
|
|
||||||
flags: z.number(),
|
|
||||||
joined_at: z.string(),
|
|
||||||
nick: z.string().nullable(),
|
|
||||||
pending: z.boolean(),
|
|
||||||
premium_since: z.string().nullable(),
|
|
||||||
roles: z.array(z.string()),
|
|
||||||
user: z.object({
|
|
||||||
id: z.string(),
|
|
||||||
username: z.string(),
|
|
||||||
global_name: z.string().nullable(),
|
|
||||||
avatar: z.string().nullable(),
|
|
||||||
discriminator: z.string(),
|
|
||||||
public_flags: z.number(),
|
|
||||||
avatar_decoration: z.string().nullable(),
|
|
||||||
}),
|
|
||||||
mute: z.boolean(),
|
|
||||||
deaf: z.boolean(),
|
|
||||||
});
|
|
||||||
|
|
||||||
var userToWrite: {
|
|
||||||
discord_id: string,
|
|
||||||
name: string,
|
|
||||||
is_admin: boolean,
|
|
||||||
is_staff: boolean,
|
|
||||||
is_member: boolean,
|
|
||||||
}
|
|
||||||
|
|
||||||
export default defineEventHandler(async (event) => {
|
|
||||||
const { code } = getQuery(event)
|
|
||||||
let create_user = false
|
|
||||||
|
|
||||||
if (!code) {
|
|
||||||
return sendRedirect(event, '/')
|
|
||||||
}
|
|
||||||
|
|
||||||
const response = await fetch("https://discord.com/api/oauth2/token", {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/x-www-form-urlencoded',
|
|
||||||
'Accept-Encoding': 'application/x-www-form-urlencoded'
|
|
||||||
},
|
|
||||||
body: new URLSearchParams({
|
|
||||||
client_id: '1105533416377688174',
|
|
||||||
client_secret: '7FdJcfSNvhXpsR_46N-ZnbNoyjV3bl1o',
|
|
||||||
grant_type: 'authorization_code',
|
|
||||||
code: (code as string),
|
|
||||||
redirect_uri: 'http://localhost:3000/auth/v1/callback'
|
|
||||||
})
|
|
||||||
});
|
|
||||||
|
|
||||||
const data: {
|
|
||||||
access_token: string,
|
|
||||||
expires_in: number,
|
|
||||||
refresh_token: string,
|
|
||||||
scope: string,
|
|
||||||
token_type: string
|
|
||||||
} = await response.json();
|
|
||||||
|
|
||||||
const userReq = await fetch("https://discord.com/api/users/@me", {
|
|
||||||
headers: {
|
|
||||||
Authorization: `${data.token_type} ${data.access_token}`,
|
|
||||||
'Content-Type': 'application/x-www-form-urlencoded',
|
|
||||||
'Accept-Encoding': 'application/x-www-form-urlencoded'
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
const user: {
|
|
||||||
id: string,
|
|
||||||
username: string,
|
|
||||||
discriminator: string,
|
|
||||||
} = await userReq.json();
|
|
||||||
|
|
||||||
const dbUser = await prisma.user.findUnique({
|
|
||||||
where: {
|
|
||||||
discord_id: user.id
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
create_user = dbUser === null
|
|
||||||
|
|
||||||
const guilds = await fetch("https://discord.com/api/users/@me/guilds", {
|
|
||||||
headers: {
|
|
||||||
Authorization: `${data.token_type} ${data.access_token}`,
|
|
||||||
'Content-Type': 'application/x-www-form-urlencoded',
|
|
||||||
'Accept-Encoding': 'application/x-www-form-urlencoded'
|
|
||||||
}
|
|
||||||
}).then(async (res) => PartialUserGuildSchema.array().parse(await res.json()));
|
|
||||||
|
|
||||||
const guild = guilds.find((g) => g.id === runtimeConfig.discordGuildId);
|
|
||||||
|
|
||||||
if (guild) {
|
|
||||||
prisma.user.update({
|
|
||||||
where: {
|
|
||||||
discord_id: user.id
|
|
||||||
},
|
|
||||||
data: {
|
|
||||||
is_member: true
|
|
||||||
}
|
|
||||||
})
|
|
||||||
const member = await fetch(`https://discord.com/api/users/@me/guilds/${guild.id}/member`, {
|
|
||||||
headers: {
|
|
||||||
Authorization: `${data.token_type} ${data.access_token}`,
|
|
||||||
'Content-Type': 'application/x-www-form-urlencoded',
|
|
||||||
'Accept-Encoding': 'application/x-www-form-urlencoded'
|
|
||||||
}
|
|
||||||
}).then((res) => res.json()).then((res) => UserGuildSchema.parse(res))
|
|
||||||
|
|
||||||
if (member.roles.find((r) => r === runtimeConfig.discordAdminRoleId)) {
|
|
||||||
console.log('admin')
|
|
||||||
|
|
||||||
userToWrite = {
|
|
||||||
discord_id: user.id,
|
|
||||||
name: user.username + '#' + user.discriminator,
|
|
||||||
is_admin: true,
|
|
||||||
is_staff: true,
|
|
||||||
is_member: true
|
|
||||||
}
|
|
||||||
} else if (member.roles.find((r) => r === runtimeConfig.discordStaffRoleId)) {
|
|
||||||
console.log('staff')
|
|
||||||
|
|
||||||
userToWrite = {
|
|
||||||
discord_id: user.id,
|
|
||||||
name: user.username + '#' + user.discriminator,
|
|
||||||
is_admin: false,
|
|
||||||
is_staff: true,
|
|
||||||
is_member: true
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
console.log('member')
|
|
||||||
|
|
||||||
userToWrite = {
|
|
||||||
discord_id: user.id,
|
|
||||||
name: user.username + '#' + user.discriminator,
|
|
||||||
is_admin: false,
|
|
||||||
is_staff: false,
|
|
||||||
is_member: true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
console.log('not member')
|
|
||||||
|
|
||||||
userToWrite = {
|
|
||||||
discord_id: user.id,
|
|
||||||
name: user.username + '#' + user.discriminator,
|
|
||||||
is_admin: false,
|
|
||||||
is_staff: false,
|
|
||||||
is_member: false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (create_user) {
|
|
||||||
await prisma.user.create({
|
|
||||||
data: userToWrite
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
const transformedUser: typeof userToWrite = {
|
|
||||||
discord_id: user.id,
|
|
||||||
name: user.username + '#' + user.discriminator,
|
|
||||||
is_admin: userToWrite.is_admin,
|
|
||||||
is_staff: userToWrite.is_staff,
|
|
||||||
is_member: userToWrite.is_member
|
|
||||||
}
|
|
||||||
|
|
||||||
if (userToWrite !== transformedUser) {
|
|
||||||
await prisma.user.update({
|
|
||||||
where: {
|
|
||||||
discord_id: user.id
|
|
||||||
},
|
|
||||||
data: userToWrite
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const secret = new TextEncoder().encode(runtimeConfig.jwtSecret)
|
|
||||||
|
|
||||||
const token = await new jose.SignJWT({ sub: user.id })
|
|
||||||
.setProtectedHeader({ alg: 'HS512' })
|
|
||||||
.setIssuedAt()
|
|
||||||
.setIssuer('https://vannerba.st')
|
|
||||||
.setAudience('https://vannerba.st')
|
|
||||||
.setExpirationTime('5h')
|
|
||||||
.sign(secret)
|
|
||||||
|
|
||||||
setCookie(event, 'token', token)
|
|
||||||
|
|
||||||
return sendRedirect(event, '/dash')
|
|
||||||
})
|
|
|
@ -1,5 +0,0 @@
|
||||||
const url = `https://discord.com/api/oauth2/authorize?client_id=1105533416377688174&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fauth%2Fv1%2Fcallback&response_type=code&scope=identify%20guilds%20guilds.members.read`
|
|
||||||
|
|
||||||
export default defineEventHandler((event) => {
|
|
||||||
return sendRedirect(event, url)
|
|
||||||
})
|
|
4
server/src/assets/styles/_colours.scss
Normal file
4
server/src/assets/styles/_colours.scss
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
$bg-colour-light: rgb(187, 187, 187);
|
||||||
|
$accent-colour-light: rgb(24, 96, 231);
|
||||||
|
$filter-accent-colour-light: invert(34%) sepia(96%) saturate(4970%) hue-rotate(216deg) brightness(95%) contrast(91%);
|
||||||
|
$filter-link-colour-dark: invert(99%) sepia(52%) saturate(532%) hue-rotate(308deg) brightness(100%) contrast(95%);
|
20
server/src/assets/styles/globals.scss
Normal file
20
server/src/assets/styles/globals.scss
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
@use 'colours';
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;700&display=swap');
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Ubuntu', sans-serif !important;
|
||||||
|
background-color: wheat !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
min-height: 80vh;
|
||||||
|
padding: 0 0.5rem;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 3rem;
|
||||||
|
}
|
3
server/src/assets/styles/index.scss
Normal file
3
server/src/assets/styles/index.scss
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
@use 'colours';
|
||||||
|
|
||||||
|
|
62
server/src/components/Card.astro
Normal file
62
server/src/components/Card.astro
Normal file
|
@ -0,0 +1,62 @@
|
||||||
|
---
|
||||||
|
export interface Props {
|
||||||
|
title: string;
|
||||||
|
body: string;
|
||||||
|
href: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { href, title, body } = Astro.props;
|
||||||
|
---
|
||||||
|
|
||||||
|
<li class="link-card">
|
||||||
|
<a href={href}>
|
||||||
|
<h2>
|
||||||
|
{title}
|
||||||
|
<span>→</span>
|
||||||
|
</h2>
|
||||||
|
<p>
|
||||||
|
{body}
|
||||||
|
</p>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<style>
|
||||||
|
.link-card {
|
||||||
|
list-style: none;
|
||||||
|
display: flex;
|
||||||
|
padding: 0.15rem;
|
||||||
|
background-color: white;
|
||||||
|
background-image: var(--accent-gradient);
|
||||||
|
background-size: 400%;
|
||||||
|
border-radius: 0.5rem;
|
||||||
|
background-position: 100%;
|
||||||
|
transition: background-position 0.6s cubic-bezier(0.22, 1, 0.36, 1);
|
||||||
|
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.link-card > a {
|
||||||
|
width: 100%;
|
||||||
|
text-decoration: none;
|
||||||
|
line-height: 1.4;
|
||||||
|
padding: 1rem 1.3rem;
|
||||||
|
border-radius: 0.35rem;
|
||||||
|
color: #111;
|
||||||
|
background-color: white;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 1.25rem;
|
||||||
|
transition: color 0.6s cubic-bezier(0.22, 1, 0.36, 1);
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
margin-bottom: 0;
|
||||||
|
color: #444;
|
||||||
|
}
|
||||||
|
.link-card:is(:hover, :focus-within) {
|
||||||
|
background-position: 0;
|
||||||
|
}
|
||||||
|
.link-card:is(:hover, :focus-within) h2 {
|
||||||
|
color: rgb(var(--accent));
|
||||||
|
}
|
||||||
|
</style>
|
58
server/src/components/LinkCard.astro
Normal file
58
server/src/components/LinkCard.astro
Normal file
|
@ -0,0 +1,58 @@
|
||||||
|
---
|
||||||
|
export interface Props {
|
||||||
|
title: string;
|
||||||
|
to: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const { to, title } = Astro.props;
|
||||||
|
|
||||||
|
const isExternal = to.startsWith('http');
|
||||||
|
---
|
||||||
|
{ isExternal == true ? (
|
||||||
|
<a href={to} target="_blank" rel="noopener noreferrer" class="bg-gray-50 hover:bg-gray-100 dark:bg-slate-700 dark:hover:bg-slate-600 m-4 px-5 py-5 md:px-10 rounded-3xl shadow-lg hover:shadow-xl">
|
||||||
|
<p>{title} →</p>
|
||||||
|
</a>
|
||||||
|
) : (
|
||||||
|
<a href={to} class="bg-gray-50 hover:bg-gray-100 dark:bg-slate-700 dark:hover:bg-slate-600 m-4 px-5 py-5 md:px-10 rounded-3xl shadow-lg hover:shadow-xl">
|
||||||
|
<p>{title} →</p>
|
||||||
|
</a>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
<style lang="scss">
|
||||||
|
@use '../assets/styles/colours';
|
||||||
|
.card {
|
||||||
|
margin: 1rem;
|
||||||
|
padding: 1.5rem;
|
||||||
|
text-align: left;
|
||||||
|
color: inherit;
|
||||||
|
text-decoration: none;
|
||||||
|
border: 2px solid #000;
|
||||||
|
border-radius: 20px;
|
||||||
|
transition: color 0.15s ease, border-color 0.15s ease;
|
||||||
|
}
|
||||||
|
.card p {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 1.25rem;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card:link,
|
||||||
|
.card:visited {
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card:hover,
|
||||||
|
.card:focus,
|
||||||
|
.card:active {
|
||||||
|
color: colours.$accent-colour-light !important;
|
||||||
|
border-color: colours.$accent-colour-light;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 600px) {
|
||||||
|
.card {
|
||||||
|
margin: 0.5rem;
|
||||||
|
padding: 1.25rem;
|
||||||
|
width: 9rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
66
server/src/components/NavBar.astro
Normal file
66
server/src/components/NavBar.astro
Normal file
|
@ -0,0 +1,66 @@
|
||||||
|
---
|
||||||
|
export interface Props {
|
||||||
|
links: {
|
||||||
|
to: string;
|
||||||
|
name: string;
|
||||||
|
img: {
|
||||||
|
src: string;
|
||||||
|
alt: string;
|
||||||
|
}
|
||||||
|
}[]
|
||||||
|
}
|
||||||
|
|
||||||
|
const { links } = Astro.props;
|
||||||
|
---
|
||||||
|
|
||||||
|
<nav>
|
||||||
|
{ links.map(link => (
|
||||||
|
<div class="nav-button">
|
||||||
|
<a href={link.to}>
|
||||||
|
<img src={link.img.src} alt={link.img.alt} />
|
||||||
|
<p>{ link.name }</p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
))
|
||||||
|
}
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
@use '../assets/styles/colours';
|
||||||
|
nav {
|
||||||
|
margin: 0 auto;
|
||||||
|
position: -webkit-sticky;
|
||||||
|
position: sticky;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav :hover {
|
||||||
|
filter: colours.$filter-accent-colour-light;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-button {
|
||||||
|
margin: 0 1rem;
|
||||||
|
padding: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
nav :not(:hover) {
|
||||||
|
filter: colours.$filter-link-colour-dark;
|
||||||
|
}
|
||||||
|
.nav-button :hover {
|
||||||
|
filter: invert(100%) sepia(25%) saturate(4030%) hue-rotate(177deg) brightness(98%) contrast(97%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
40
server/src/components/TimeFormat.vue
Normal file
40
server/src/components/TimeFormat.vue
Normal file
|
@ -0,0 +1,40 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { defineComponent } from 'vue'
|
||||||
|
|
||||||
|
type TimeFormatProps = {
|
||||||
|
day: string | undefined,
|
||||||
|
month: string | undefined,
|
||||||
|
year: string | undefined,
|
||||||
|
hour: string | undefined,
|
||||||
|
minute: string | undefined,
|
||||||
|
second: string | undefined,
|
||||||
|
weekday: string | undefined,
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
formats: {
|
||||||
|
type: Array<TimeFormatProps>,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
dFormat: {
|
||||||
|
type: String,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
const crntTime = Date.now();
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<code>
|
||||||
|
{{ `<t:${Math.floor(crntTime / 1000)}:${props.dFormat}>` }}
|
||||||
|
</code>
|
||||||
|
<span>
|
||||||
|
to get
|
||||||
|
<code>
|
||||||
|
<span v-for="format in props.formats" :key="Math.floor(Math.random()*1000)">
|
||||||
|
{{Intl.DateTimeFormat(Intl.Locale, format).format(crntTime) + ' '}}
|
||||||
|
</span>
|
||||||
|
</code>
|
||||||
|
</span>
|
||||||
|
</template>
|
4
server/src/components/TimeZone.vue
Normal file
4
server/src/components/TimeZone.vue
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<span>{{Intl.DateTimeFormat().resolvedOptions().timeZone}}</span>
|
||||||
|
</template>
|
9
server/src/components/UnixTime.vue
Normal file
9
server/src/components/UnixTime.vue
Normal file
|
@ -0,0 +1,9 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { defineProps } from 'vue';
|
||||||
|
|
||||||
|
const crntTime = Date.now();
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<p>The current time in Unix Epoch: <code>{{ Math.floor(crntTime / 1000) }}</code> <br /> or <code>{{crntTime}}</code> in Unix millis</p>
|
||||||
|
</template>
|
1
server/src/env.d.ts
vendored
Normal file
1
server/src/env.d.ts
vendored
Normal file
|
@ -0,0 +1 @@
|
||||||
|
/// <reference types="astro/client" />
|
108
server/src/layouts/Layout.astro
Normal file
108
server/src/layouts/Layout.astro
Normal file
|
@ -0,0 +1,108 @@
|
||||||
|
---
|
||||||
|
import NavBar from '../components/NavBar.astro';
|
||||||
|
|
||||||
|
export interface Props {
|
||||||
|
title: string;
|
||||||
|
navLinks: {
|
||||||
|
to: string;
|
||||||
|
name: string;
|
||||||
|
img: {
|
||||||
|
src: string;
|
||||||
|
alt: string;
|
||||||
|
}
|
||||||
|
}[] | undefined
|
||||||
|
}
|
||||||
|
|
||||||
|
const { title, navLinks } = Astro.props;
|
||||||
|
import { ViewTransitions } from 'astro:transitions';
|
||||||
|
---
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<ViewTransitions />
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width" />
|
||||||
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||||
|
<meta name="generator" content={Astro.generator} />
|
||||||
|
<title>{title}</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
{ navLinks != undefined ? (
|
||||||
|
<NavBar links={navLinks} />
|
||||||
|
) : (<!-- If there were NavLinks, they would be here -->)
|
||||||
|
}
|
||||||
|
<slot />
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
<style lang="scss" is:global>
|
||||||
|
@use "../assets/styles/colours";
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;700&display=swap');
|
||||||
|
|
||||||
|
body {
|
||||||
|
background-color: colours.$bg-colour-light;
|
||||||
|
font-family: 'Ubuntu', sans-serif !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
min-height: 80vh;
|
||||||
|
padding: 0 0.5rem;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 3rem;
|
||||||
|
}
|
||||||
|
.footer {
|
||||||
|
width: 100%;
|
||||||
|
height: 100px;
|
||||||
|
border-top: 1px solid #eaeaea;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer a:hover {
|
||||||
|
color: #0070f3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer a {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-grow: 1;
|
||||||
|
color: #eaeaea;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grid-2 {
|
||||||
|
display: grid;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grid-3 {
|
||||||
|
display: grid;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
grid-template-columns: 1fr 1fr 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 600px) {
|
||||||
|
.grid-3 {
|
||||||
|
width: 90%;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Dark mode */
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
body {
|
||||||
|
background-color: #1E293B !important;
|
||||||
|
color: antiquewhite;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
39
server/src/pages/index.astro
Normal file
39
server/src/pages/index.astro
Normal file
|
@ -0,0 +1,39 @@
|
||||||
|
---
|
||||||
|
import Layout from '../layouts/Layout.astro';
|
||||||
|
import LinkCard from '../components/LinkCard.astro';
|
||||||
|
---
|
||||||
|
|
||||||
|
<Layout title="Vänner Bästa">
|
||||||
|
<main class="grid place-items-center h-screen">
|
||||||
|
<div class="grid place-items-center">
|
||||||
|
<h1 class="text-6xl font-bold underline">Vänner Bästa</h1>
|
||||||
|
<div class="mt-10 mx-4 place-items-center" >
|
||||||
|
<p>
|
||||||
|
A Young Royals fan website with links to different discussion
|
||||||
|
spaces.
|
||||||
|
</p>
|
||||||
|
<strong class="pt-5" >It's official! Series 3 is coming!</strong>
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-2 md:grid-cols-3 mt-10">
|
||||||
|
<LinkCard
|
||||||
|
title="Watch"
|
||||||
|
to="https://www.netflix.com/title/81210762"
|
||||||
|
/>
|
||||||
|
<LinkCard title="Discord" to="https://discord.gg/hyKVDeRJ8Y" />
|
||||||
|
<LinkCard
|
||||||
|
title="Reddit"
|
||||||
|
to="https://www.reddit.com/r/YoungRoyals/"
|
||||||
|
/>
|
||||||
|
<LinkCard
|
||||||
|
title="Babbel (ref)"
|
||||||
|
to="https://www.talkable.com/x/IchxFl"
|
||||||
|
/>
|
||||||
|
<LinkCard
|
||||||
|
title="Matrix"
|
||||||
|
to="https://matrix.to/#/#young-royals:matrix.org"
|
||||||
|
/>
|
||||||
|
<LinkCard title="Discord Utilities" to="/utilities" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</Layout>
|
42
server/src/pages/utilities/birthdays.astro
Normal file
42
server/src/pages/utilities/birthdays.astro
Normal file
|
@ -0,0 +1,42 @@
|
||||||
|
---
|
||||||
|
import TimeZone from "../../components/TimeZone.vue";
|
||||||
|
import Layout from "../../layouts/Layout.astro";
|
||||||
|
|
||||||
|
const navLinks = [
|
||||||
|
{
|
||||||
|
img: {
|
||||||
|
src: '/icons/arrow-left.svg',
|
||||||
|
alt: 'Back to Utilities',
|
||||||
|
},
|
||||||
|
to: '/utilities',
|
||||||
|
name: "Utilities",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
img: {
|
||||||
|
src: '/icons/home.svg',
|
||||||
|
alt: 'Go Home',
|
||||||
|
},
|
||||||
|
to: '/',
|
||||||
|
name: "Home",
|
||||||
|
},
|
||||||
|
];
|
||||||
|
---
|
||||||
|
|
||||||
|
<Layout title="Vänner Bästa | Birthdays" navLinks={navLinks}>
|
||||||
|
<div class="container grid place-items-center">
|
||||||
|
<div class="grid place-items-center">
|
||||||
|
<h1 class="text-6xl font-bold underline p-4">Birthdays</h1>
|
||||||
|
<p class="p-4">
|
||||||
|
Discord bots are changing. <br />
|
||||||
|
This means that we can no longer provide you with the command to set
|
||||||
|
your birthday. <br />
|
||||||
|
Instead, this page now gives you your timezone for use with Discord
|
||||||
|
bots.
|
||||||
|
</p>
|
||||||
|
<h2 class="p-4 text-4xl">
|
||||||
|
Your timezone:
|
||||||
|
<TimeZone class="underline" client:load/>
|
||||||
|
</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Layout>
|
27
server/src/pages/utilities/index.astro
Normal file
27
server/src/pages/utilities/index.astro
Normal file
|
@ -0,0 +1,27 @@
|
||||||
|
---
|
||||||
|
import LinkCard from "../../components/LinkCard.astro";
|
||||||
|
import NavBar from "../../components/NavBar.astro";
|
||||||
|
import Layout from '../../layouts/Layout.astro';
|
||||||
|
|
||||||
|
const navLinks = [
|
||||||
|
{
|
||||||
|
img: {
|
||||||
|
src: '/icons/home.svg',
|
||||||
|
alt: 'Go Home',
|
||||||
|
},
|
||||||
|
to: '/',
|
||||||
|
name: "Home",
|
||||||
|
},
|
||||||
|
];
|
||||||
|
---
|
||||||
|
<Layout title="Vänner Bästa | Utilities" navLinks={navLinks}>
|
||||||
|
<div class="container grid place-items-center">
|
||||||
|
<div class="">
|
||||||
|
<h1 class="title">Utilities for the Discord Server</h1>
|
||||||
|
<div class="grid-2">
|
||||||
|
<LinkCard title="Birthdays" to="/utilities/birthdays" />
|
||||||
|
<LinkCard title="Time" to="/utilities/time" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Layout>
|
79
server/src/pages/utilities/time.astro
Normal file
79
server/src/pages/utilities/time.astro
Normal file
|
@ -0,0 +1,79 @@
|
||||||
|
---
|
||||||
|
|
||||||
|
import NavBar from "../../components/NavBar.astro";
|
||||||
|
import TimeZone from "../../components/TimeZone.vue";
|
||||||
|
import Layout from "../../layouts/Layout.astro";
|
||||||
|
import TimeFormat from "../../components/TimeFormat.vue";
|
||||||
|
import UnixTime from "../../components/UnixTime.vue";
|
||||||
|
|
||||||
|
const navLinks = [
|
||||||
|
{
|
||||||
|
img: {
|
||||||
|
src: '/icons/arrow-left.svg',
|
||||||
|
alt: 'Back to Utilities',
|
||||||
|
},
|
||||||
|
to: '/utilities',
|
||||||
|
name: 'Utilities',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
img: {
|
||||||
|
src: '/icons/home.svg',
|
||||||
|
alt: 'Go Home',
|
||||||
|
},
|
||||||
|
to: '/',
|
||||||
|
name: 'Home',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
---
|
||||||
|
|
||||||
|
<Layout title="VännerBästa | Time" navLinks={navLinks}>
|
||||||
|
<div class="container grid place-items-center">
|
||||||
|
<div class="grid place-items-center">
|
||||||
|
<h1 class="text-6xl font-bold underline p-4">Time Utilities</h1>
|
||||||
|
<p class="p-4">
|
||||||
|
Your current timezone:
|
||||||
|
<TimeZone client:load />
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<UnixTime client:load/>
|
||||||
|
|
||||||
|
<p class="p-4">
|
||||||
|
To format the time for Discord, you can use: <br />
|
||||||
|
<TimeFormat formats={[{
|
||||||
|
day: 'numeric',
|
||||||
|
month: 'long',
|
||||||
|
year: 'numeric',
|
||||||
|
}, {hour: '2-digit', minute: '2-digit'}]} dFormat="f" client:only />
|
||||||
|
<br />
|
||||||
|
<TimeFormat formats={[{
|
||||||
|
weekday: 'long',
|
||||||
|
day: 'numeric',
|
||||||
|
month: 'long',
|
||||||
|
year: 'numeric',
|
||||||
|
}, { hour: '2-digit', minute: '2-digit', }]} dFormat="F" client:only />
|
||||||
|
<br />
|
||||||
|
<TimeFormat formats={[{
|
||||||
|
hour: '2-digit',
|
||||||
|
minute: '2-digit',
|
||||||
|
}]} dFormat="t" client:only />
|
||||||
|
<br />
|
||||||
|
<TimeFormat formats={[{
|
||||||
|
hour: '2-digit',
|
||||||
|
minute: '2-digit',
|
||||||
|
second: '2-digit',
|
||||||
|
}]} dFormat="T" client:only />
|
||||||
|
<br />
|
||||||
|
<TimeFormat formats={[{
|
||||||
|
day: '2-digit',
|
||||||
|
month: '2-digit',
|
||||||
|
year: 'numeric',
|
||||||
|
}]} dFormat="d" client:only />
|
||||||
|
<br />
|
||||||
|
<TimeFormat formats={[{
|
||||||
|
day: 'numeric',
|
||||||
|
month: 'long',
|
||||||
|
year: 'numeric',
|
||||||
|
}]} dFormat="D" client:only />
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</Layout>
|
|
@ -1,27 +0,0 @@
|
||||||
import type { Config } from 'tailwindcss'
|
|
||||||
|
|
||||||
export default <Partial<Config>>{
|
|
||||||
theme: {
|
|
||||||
extend: {
|
|
||||||
spacing: {
|
|
||||||
'screen-4/5': '80vh',
|
|
||||||
'screen-1/5': '20vh',
|
|
||||||
'screen-1/10': '10vh',
|
|
||||||
'screen-9/10': '90vh',
|
|
||||||
'screen-1/20': '5vh',
|
|
||||||
'screen-19/20': '95vh',
|
|
||||||
},
|
|
||||||
}
|
|
||||||
},
|
|
||||||
content: [
|
|
||||||
`./components/**/*.{vue,js,ts}`,
|
|
||||||
`./layouts/**/*.vue`,
|
|
||||||
`./pages/**/*.vue`,
|
|
||||||
`./composables/**/*.{js,ts}`,
|
|
||||||
`./plugins/**/*.{js,ts}`,
|
|
||||||
`./App.{js,ts,vue}`,
|
|
||||||
`./app.{js,ts,vue}`,
|
|
||||||
`./Error.{js,ts,vue}`,
|
|
||||||
`./error.{js,ts,vue}`
|
|
||||||
],
|
|
||||||
}
|
|
|
@ -1,8 +0,0 @@
|
||||||
{
|
|
||||||
// https://v3.nuxtjs.org/concepts/typescript
|
|
||||||
"extends": "./.nuxt/tsconfig.json",
|
|
||||||
"compilerOptions": {
|
|
||||||
"emitDecoratorMetadata": true,
|
|
||||||
"experimentalDecorators": true,
|
|
||||||
}
|
|
||||||
}
|
|
Loading…
Reference in a new issue