pelmen/konfach_cloud_home
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add initial project files and setup for Vue with Tailwind CSS and authentication

Browse source
This commit is contained in:
artem 2025-03-16 13:00:03 +04:00
parent 2f1ceec405
commit fd65043a0e
29 changed files with 2682 additions and 0 deletions

3
.vscode/extensions.json vendored Normal file
View file

@ -0,0 +1,3 @@
{
"recommendations": ["Vue.volar"]
}

19
Dockerfile Normal file
View file

@ -0,0 +1,19 @@
FROM node:20-alpine as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm i
COPY . .
RUN npm run build
FROM busybox:latest
COPY --from=build-stage /app/dist /app
EXPOSE 80
CMD ["busybox", "httpd", "-f", "-p", "80", "-h", "/app"]

0
README.md Normal file
View file

92
callback.html Normal file
View file

@ -0,0 +1,92 @@
<!DOCTYPE html>
<html>
<head>
<title>Authentication Callback</title>
<script type="module" src="/src/scripts/callback.ts"></script>
<style>
body, html {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
background-color: #f9fafb;
color: #4b5563;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
overflow: hidden;
transition: background-color 0.3s ease, color 0.3s ease;
}
html.dark body {
background-color: #1f2937;
color: #f3f4f6;
}
.loading-container {
text-align: center;
}
.loader {
border: 4px solid rgba(59, 130, 246, 0.2);
border-radius: 50%;
border-top: 4px solid #3b82f6;
width: 50px;
height: 50px;
animation: spin 1s linear infinite;
margin: 0 auto 20px;
transition: border-color 0.3s ease;
}
html.dark .loader {
border-color: rgba(96, 165, 250, 0.2);
border-top-color: #60a5fa;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.loading-text {
font-size: 16px;
color: inherit;
margin-top: 16px;
}
</style>
<script>
// Apply theme on page load
(function() {
// Check for saved theme preference
const savedTheme = localStorage.getItem('theme');
// Check if user prefers dark mode
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
// Apply dark mode if explicitly set or if system prefers dark and no preference is saved
if (savedTheme === 'dark' || (!savedTheme && prefersDark)) {
document.documentElement.classList.add('dark');
}
// Listen for system preference changes
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => {
if (!localStorage.getItem('theme')) {
if (e.matches) {
document.documentElement.classList.add('dark');
} else {
document.documentElement.classList.remove('dark');
}
}
});
})();
</script>
</head>
<body>
<div class="loading-container">
<div class="loader"></div>
<p class="loading-text">Completing authentication, please wait...</p>
</div>
</body>
</html>

5
docker-compose.yaml Normal file
View file

@ -0,0 +1,5 @@
services:
home:
build: .
ports:
- "3000:80"

13
index.html Normal file
View file

@ -0,0 +1,13 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>

1904
package-lock.json generated Normal file
View file

File diff suppressed because it is too large Load diff

28
package.json Normal file
View file

@ -0,0 +1,28 @@
{
"name": "konfach_cloud_preview",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vue-tsc -b --noEmit && vite build",
"preview": "vite preview"
},
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^6.7.2",
"@fortawesome/free-solid-svg-icons": "^6.7.2",
"@fortawesome/vue-fontawesome": "^3.0.8",
"@tailwindcss/vite": "^4.0.14",
"oidc-client-ts": "^3.2.0",
"tailwindcss": "^4.0.14",
"vue": "^3.5.13"
},
"devDependencies": {
"@types/node": "^22.13.10",
"@vitejs/plugin-vue": "^5.2.1",
"@vue/tsconfig": "^0.7.0",
"typescript": "~5.7.2",
"vite": "^6.2.0",
"vue-tsc": "^2.2.4"
}
}

1
public/vite.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
Side by side

After

(image error) Size: 1.5 KiB

9
silent-renew.html Normal file
View file

@ -0,0 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<title>Silent Renewal</title>
<script type="module" src="/src/scripts/silent-renew.ts"></script>
</head>
<body>
</body>
</html>

39
src/App.vue Normal file
View file

@ -0,0 +1,39 @@
<script setup lang="ts">
import Category from "./components/Category.vue";
import {linkDefinitions} from "@/link_defenitions";
import ThemeSwitch from "./components/ThemeSwitch.vue";
import OpenIdAuth from "@/components/OpenIdAuth.vue";
import { isAuthenticated } from "@/scripts/auth";
import {computed} from "vue";
const isLogged = computed(() => isAuthenticated.value);
</script>
<template>
<div class="min-h-screen bg-white dark:bg-gray-900 transition-colors duration-300">
<header class="bg-gradient-to-r from-blue-500 to-indigo-600 dark:from-blue-700 dark:to-indigo-900 py-6 px-4 shadow-lg mb-8 flex justify-between items-center space-x-4">
<h1 class="text-4xl font-extrabold text-center text-white tracking-tight">
<span class="inline-block mr-2">🔗</span>
Konfach2.0 cloud links
<span class="block text-sm font-light mt-2 text-blue-100 dark:text-blue-200">Your cursed collection of resources</span>
</h1>
<div class="flex-1"></div>
<OpenIdAuth />
<ThemeSwitch />
</header>
<div v-if="isLogged" class="container mx-auto py-8 space-y-8 text-gray-900 dark:text-gray-100">
<Category
v-for="(cat, index) in linkDefinitions"
:key="index"
:category="cat"
/>
</div>
<div v-else class="container mx-auto py-8 space-y-8 text-gray-900 dark:text-gray-100 flex justify-center items-center">
<p class="text-center text-2xl font-bold mt-8">Залогинься, пожалуйста</p>
</div>
</div>
</template>
<style scoped>
</style>

1
src/assets/vue.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>
Side by side

After

(image error) Size: 496 B

35
src/components/Category.vue Normal file
View file

@ -0,0 +1,35 @@
<script setup lang="ts">
import type {ICategory} from "@/models/link";
import ResourceLink from "@/components/ResourceLink.vue";
import {userRoles} from "@/scripts/auth.js";
import {computed} from "vue";
const {
category
} = defineProps<{
category: ICategory
}>()
const isVisible = computed(() => {
return userRoles.value.includes(category.required_role) || category.required_role === '' || category.required_role === undefined
})
</script>
<template>
<div v-if="isVisible" class="border border-gray-300 dark:border-gray-700 rounded p-4 shadow-sm dark:shadow-gray-900 bg-white dark:bg-gray-800 transition-colors duration-300">
<h2 class="text-2xl font-bold text-gray-800 dark:text-gray-100 mb-6 pb-2 border-b border-gray-200 dark:border-gray-700">{{ category.categoryName }}</h2>
<div class="space-y-4">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
<div v-for="link in category.links" :key="link.link" class="transition-all">
<ResourceLink :link="link" />
</div>
</div>
</div>
</div>
</template>
<style scoped>
</style>

115
src/components/OpenIdAuth.vue Normal file
View file

@ -0,0 +1,115 @@
<script setup lang="ts">
import { ref, onMounted } from 'vue';
import {isLoggedIn as authIsLoggedIn, getUser, login as authLogin, logout as authLogout, completeLogin, isAuthenticated} from '@/scripts/auth';
interface User {
name: string;
email: string;
picture?: string;
}
const user = ref<User | null>(null);
const isLoading = ref(true);
const checkAuthStatus = async () => {
isLoading.value = true;
try {
const loggedIn = await authIsLoggedIn();
if (loggedIn) {
const oidcUser = await getUser();
user.value = {
name: oidcUser?.profile?.name || 'User',
email: oidcUser?.profile?.email || '',
picture: oidcUser?.profile?.picture
};
} else {
user.value = null;
}
} catch (error) {
console.error('Auth check failed:', error);
isAuthenticated.value = false;
user.value = null;
} finally {
isLoading.value = false;
}
};
const login = async () => {
isLoading.value = true;
try {
await authLogin();
// The page will redirect to the identity provider
} catch (error) {
console.error('Login failed:', error);
isLoading.value = false;
}
};
const logout = async () => {
isLoading.value = true;
try {
await authLogout();
// The page will redirect after logout
} catch (error) {
console.error('Logout failed:', error);
isLoading.value = false;
}
};
onMounted(async () => {
// Check if this is a callback from the identity provider
if (window.location.search.includes('code=')) {
try {
await completeLogin();
window.history.replaceState({}, document.title, window.location.pathname);
} catch (error) {
console.error('Error completing authentication:', error);
}
}
await checkAuthStatus();
});
</script>
<template>
<div class="rounded-lg border border-gray-300 dark:border-gray-700 p-3 bg-white dark:bg-gray-800 shadow transition-colors duration-300 w-[400px] h-[70px] flex flex-col">
<div class="flex-1 flex items-center justify-between">
<!-- Loading State -->
<div v-if="isLoading" class="w-full flex justify-center items-center">
<div class="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-500 dark:border-blue-400"></div>
</div>
<!-- Authenticated State -->
<div v-else-if="isAuthenticated" class="w-full flex items-center justify-between">
<div class="flex items-center space-x-3">
<img v-if="user?.picture" :src="user.picture" alt="Profile" class="w-9 h-9 rounded-full object-cover" />
<div v-else class="w-10 h-10 rounded-full bg-blue-500 dark:bg-blue-600 flex items-center justify-center text-white">
{{ user?.name.charAt(0) }}
</div>
<div>
<p class="font-medium text-gray-800 dark:text-gray-100">{{ user?.name }}</p>
<p class="text-sm text-gray-600 dark:text-gray-400">{{ user?.email }}</p>
</div>
</div>
<button
@click="logout"
class="py-2 px-4 bg-red-500 dark:bg-red-600 hover:bg-red-600 dark:hover:bg-red-700 text-white rounded transition-colors duration-200"
>
Log Out
</button>
</div>
<!-- Unauthenticated State -->
<div v-else class="w-full flex items-center space-x-4 justify-between">
<p class="text-gray-700 dark:text-gray-300">Not authenticated</p>
<button
@click="login"
class="py-2 px-4 bg-blue-500 dark:bg-blue-600 hover:bg-blue-600 dark:hover:bg-blue-700 text-white rounded transition-colors duration-200"
>
Log In with OpenID
</button>
</div>
</div>
</div>
</template>

34
src/components/ResourceLink.vue Normal file
View file

@ -0,0 +1,34 @@
<script setup lang="ts">
import type {ILink} from "@/models/link";
import {userRoles} from "@/scripts/auth";
import {computed} from "vue";
const {
link
} = defineProps<{
link: ILink
}>()
const onLinkClick = () => {
window.open(link.link, "_blank");
}
const isVisible = computed(() => {
return userRoles.value.includes(link.required_role) || link.required_role === '' || link.required_role === undefined
})
</script>
<template>
<div v-if="isVisible" class="border border-gray-300 dark:border-gray-700 rounded p-4 shadow-sm dark:shadow-gray-800 cursor-pointer bg-white dark:bg-gray-800 transition-colors duration-300 hover:shadow-md dark:hover:shadow-gray-900" @click="onLinkClick">
<h3 class="text-lg font-semibold mb-4 text-gray-800 dark:text-gray-100">{{ link.title }}</h3>
<p class="text-gray-600 dark:text-gray-400 overflow-hidden">{{ link.link }}</p>
<p v-if="link.description.length > 0" class="text-gray-700 dark:text-gray-300 mt-2 bg-gray-50 dark:bg-gray-700 p-3 rounded-md border-l-4 border-blue-400 dark:border-blue-600 italic">{{ link.description }}</p>
</div>
</template>
<style scoped>
</style>

17
src/components/ThemeSwitch.vue Normal file
View file

@ -0,0 +1,17 @@
<script setup lang="ts">
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import { faMoon, faSun } from '@fortawesome/free-solid-svg-icons'
import {toggleTheme, theme, lightTheme} from "@/scripts/theme";
</script>
<template>
<button @click="toggleTheme" class="p-2 rounded-full bg-white/20 hover:bg-white/30 transition-colors">
<FontAwesomeIcon v-if="theme === lightTheme" :icon="faMoon" />
<FontAwesomeIcon v-else :icon="faSun" />
</button>
</template>
<style scoped>
</style>

91
src/link_defenitions.ts Normal file
View file

@ -0,0 +1,91 @@
import type { ICategory, ILink } from "@/models/link.ts";
export const linkDefinitions = [
{
categoryName: "Авторизация",
links: [
{
title: "Управление аккаунтом",
link: "https://sso.konfach.ru/realms/konfach/account",
description: "Manage your account securely and update personal settings."
},
] as ILink[]
},
{
categoryName: "Общее",
required_role: "",
links: [
{
title: "NextCloud",
link: "https://nextcloud.konfach.ru",
description: "Access and manage your cloud storage with NextCloud."
},
{
title: "Шара",
link: "https://share.konfa.ch/",
description: "Easily share files and collaborate with Шара’s tools."
},
{
title: "Гит",
link: "https://git.kmsign.ru/",
description: "Host, manage, and review your code with our Git repository."
},
{
title: "VaultWarden (Сервер для BitWarden)",
link: "https://vaultwarden.kmsign.ru",
description: "Self-host your password management with VaultWarden."
},
{
title: "Immich (Клон гугл фото)",
link: "https://immich.royalcat.dev/",
description: "Manage and share your photos seamlessly with Immich."
}
] as ILink[]
},
{
categoryName: "Внутрянка",
required_role: "developer",
links: [
{
title: "minio",
link: "https://minio.royalcat.dev",
description: "Utilize MinIO for secure internal object storage.",
},
{
title: "komodo",
link: "https://komodo.kmsign.ru/",
description: "Access internal service dashboards with Komodo.",
},
{
title: "впн",
link: "https://3x-ui.konfa.ch/",
description: "Connect securely to internal networks using our VPN service.",
},
{
title: "графана",
link: "https://grafana.kmsign.ru/login/generic_oauth",
description: "Monitor and visualize internal data with Grafana.",
},
] as ILink[]
},
{
categoryName: "Порнуха",
links: [
{
title: "Порнуха",
link: "https://stash.royalcat.dev/",
description: "Browse curated adult content collections."
},
{
title: "hentai",
link: "https://stash-hentai.royalcat.dev/",
description: "Explore anime-themed adult entertainment resources."
},
{
title: "cgi",
link: "https://stash-cgi.royalcat.dev/",
description: "Discover computer-generated imagery within adult content."
},
] as ILink[]
}
] as ICategory[];

28
src/main.ts Normal file
View file

@ -0,0 +1,28 @@
import { createApp } from 'vue'
import './style.css'
import App from './App.vue'
import { initializeTheme } from "@/scripts/theme";
import {completeLogin} from "@/scripts/auth.js";
initializeTheme()
// Handle potential auth callback before mounting app
async function initializeApp() {
// If this is a callback from the identity provider
if (window.location.search.includes('code=')) {
try {
await completeLogin();
window.history.replaceState({}, document.title, window.location.pathname);
} catch (error) {
console.error('Error completing authentication:', error);
}
}
// Mount the app
createApp(App).mount('#app')
}
initializeApp()
.then(r => console.log('App initialized'))
.catch(error => console.error('Error initializing app:', error));

12
src/models/link.ts Normal file
View file

@ -0,0 +1,12 @@
export interface ILink {
link: string;
title: string;
description: string;
required_role: string
}
export interface ICategory {
categoryName: string;
required_role: string;
links: ILink[];
}

126
src/scripts/auth.ts Normal file
View file

@ -0,0 +1,126 @@
// src/services/authService.ts
import {UserManager, WebStorageStateStore, Log} from 'oidc-client-ts';
import {ref} from "vue";
// Configure logging (optional)
// Log.setLogger(console);
// Log.setLevel(Log.INFO);
// OIDC configuration - replace with your provider details
const oidcConfig = {
authority: 'https://sso.konfach.ru/realms/konfach/',
client_id: 'home',
redirect_uri: `${window.location.origin}/callback.html`,
response_type: 'code',
scope: 'openid profile email',
post_logout_redirect_uri: window.location.origin,
userStore: new WebStorageStateStore({store: window.localStorage}),
monitorSession: true,
// Add silent renewal settings
automaticSilentRenew: true,
silent_redirect_uri: `${window.location.origin}/silent-renew.html`,
// Add proper response handling
includeIdTokenInSilentRenew: true,
};
// Create the UserManager
export const userManager = new UserManager(oidcConfig);
export const userRoles = ref<string[]>([])
export const isAuthenticated = ref(false)
// Add event listeners for debugging
userManager.events.addUserLoaded(user => {
console.log('User loaded roles updated');
userRoles.value = getUserRoles(user.access_token);
isAuthenticated.value = true;
});
userManager.events.addSilentRenewError(error => {
console.error('Silent renew error', {error});
});
userManager.events.addUserSignedOut(() => {
console.log('User signed out');
isAuthenticated.value = false;
});
// Start the login process
export async function login() {
try {
return await userManager.signinRedirect();
} catch (error) {
console.error('Login redirect failed:', error);
throw error;
}
}
// Complete the login process after redirect
export async function completeLogin() {
try {
const user = await userManager.signinRedirectCallback();
console.log('Login completed successfully', user);
return user;
} catch (error) {
console.error('Error completing login:', error);
throw error;
}
}
// Log out
export async function logout() {
try {
return await userManager.signoutRedirect();
} catch (error) {
console.error('Logout failed:', error);
throw error;
}
}
// Check if user is logged in
export async function isLoggedIn() {
try {
const user = await userManager.getUser(true);
return !!user && !user.expired;
} catch (error) {
console.error('Error checking login status:', error);
return false;
}
}
// Add a method to handle token renewal
export async function renewToken() {
try {
return await userManager.signinSilent();
} catch (error) {
console.error('Silent token renewal failed:', error);
return null;
}
}
export async function getUser() {
try {
return await userManager.getUser(true);
} catch (error) {
console.error('Error getting user:', error);
return null;
}
}
export function getUserRoles(access_token: string) {
// Decode JWT token (without validation)
const tokenParts = access_token.split('.');
if (tokenParts.length !== 3) {
console.error('Invalid token format');
return null;
}
// Base64Url decode the payload (second part)
const base64Payload = tokenParts[1];
const payload = JSON.parse(atob(base64Payload.replace(/-/g, '+').replace(/_/g, '/')));
return payload.realm_access.roles;
}

11
src/scripts/callback.ts Normal file
View file

@ -0,0 +1,11 @@
import {userManager} from "@/scripts/auth.js";
userManager.signinRedirectCallback()
.then((user) => {
window.location.href = '/';
console.log('Signin successful: ', {user});
})
.catch(error => {
console.error('Callback error:', error);
window.location.href = '/?error=' + encodeURIComponent(error.message);
});

5
src/scripts/silent-renew.ts Normal file
View file

@ -0,0 +1,5 @@
import {userManager} from "@/scripts/auth.js";
userManager.signinSilentCallback()
.catch(error => {
console.error('Silent renew error:', error);
});

36
src/scripts/theme.ts Normal file
View file

@ -0,0 +1,36 @@
import {ref} from "vue";
const darkClass = 'dark';
const localStorageThemeKey = 'theme';
export const lightTheme = 'light';
export const darkTheme = 'dark';
export const theme = ref(localStorage.getItem(localStorageThemeKey) || darkTheme);
export function initializeTheme() {
// Get theme from localStorage or use system preference as fallback
const savedTheme = theme.value;
// Apply theme class immediately
if (savedTheme === darkTheme) {
document.documentElement.classList.add(darkClass);
localStorage.setItem(localStorageThemeKey, darkTheme);
} else {
document.documentElement.classList.remove(darkClass);
localStorage.setItem(localStorageThemeKey, lightTheme);
}
}
export function toggleTheme() {
// Toggle theme
document.documentElement.classList.toggle(darkClass);
// Save theme to localStorage
const isDark = document.documentElement.classList.contains(darkClass);
localStorage.setItem(localStorageThemeKey, isDark ? darkTheme : lightTheme);
// Update the reactive theme value
theme.value = isDark ? darkTheme : lightTheme;
}

3
src/style.css Normal file
View file

@ -0,0 +1,3 @@
@import "tailwindcss";
@custom-variant dark (&:where(.dark, .dark *));

1
src/vite-env.d.ts vendored Normal file
View file

@ -0,0 +1 @@
/// <reference types="vite/client" />

13
tailwind.config.ts Normal file
View file

@ -0,0 +1,13 @@
/** @type {import('tailwindcss').Config} */
export default {
content: [
"./index.html",
"./public/*",
"./src/**/*.{vue,js,ts,jsx,tsx}",
],
darkMode: 'class', // This enables class-based dark mode
theme: {
extend: {},
},
plugins: [],
}

14
tsconfig.json Normal file
View file

@ -0,0 +1,14 @@
{
"compilerOptions": {
"module": "nodenext",
"moduleResolution": "nodenext",
"baseUrl": ".",
"paths": {
"@/*" : ["src/*"]
}
},
"include": [
"src/**/*",
"public/**/*"
]
}

1
tsconfig.tsbuildinfo Normal file
View file

@ -0,0 +1 @@
{"root":["./src/App.vue","./src/link_defenitions.ts","./src/main.ts","./src/vite-env.d.ts","./src/components/Category.vue","./src/components/OpenIdAuth.vue","./src/components/ResourceLink.vue","./src/components/ThemeSwitch.vue","./src/models/link.ts","./src/scripts/auth.ts","./src/scripts/callback.ts","./src/scripts/silent-renew.ts","./src/scripts/theme.ts"],"version":"5.7.3"}

26
vite.config.ts Normal file
View file

@ -0,0 +1,26 @@
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import tailwindcss from "@tailwindcss/vite"
import path from 'path'
import { resolve } from 'path'
export default defineConfig({
build: {
rollupOptions: {
input: {
'main': resolve(__dirname, './index.html'),
'callback': resolve(__dirname, './callback.html'),
'silent-renew': resolve(__dirname, './silent-renew.html'),
},
}
},
resolve: {
alias: {
'@': path.resolve(__dirname, './src')
}
},
plugins: [
vue(),
tailwindcss(),
],
})