Move to appConfig, Vuetify 3

This commit is contained in:
Andrew Illarionov 2024-01-27 19:17:30 +03:00
parent 4ac1fd9574
commit 1f7c8f0ed4
29 changed files with 1329 additions and 1323 deletions

View File

@ -15,8 +15,6 @@ module.exports = {
indent: ['error', 2, { SwitchCase: 1 }],
quotes: [2, 'single', { avoidEscape: true }],
'no-console': 'off',
'vue/no-multiple-template-root': 'off',
'vue/multi-word-component-names': 'off',
'no-unused-vars': 'off',
'@typescript-eslint/no-unused-vars': [
'error',
@ -26,6 +24,8 @@ module.exports = {
caughtErrorsIgnorePattern: '^_',
},
],
'vue/no-multiple-template-root': 'off',
'vue/multi-word-component-names': 'off',
},
settings: {
'import/ignore': ['vue-fontawesome'],

View File

@ -1 +1 @@
[{"D:\\Software\\Development\\Websites\\enderman.ch\\index\\assets\\styles\\transitions.scss":"1","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\TransitionY.vue":"2","D:\\Software\\Development\\Websites\\enderman.ch\\index\\app.vue":"3","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\EMail.vue":"4","D:\\Software\\Development\\Websites\\enderman.ch\\index\\pages\\about.vue":"5","D:\\Software\\Development\\Websites\\enderman.ch\\index\\pages\\index.vue":"6","D:\\Software\\Development\\Websites\\enderman.ch\\index\\pages\\projects.vue":"7","D:\\Software\\Development\\Websites\\enderman.ch\\index\\pages\\social.vue":"8","D:\\Software\\Development\\Websites\\enderman.ch\\index\\layouts\\Card.vue":"9","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\blocks\\Options.vue":"10","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\blocks\\Flooter.vue":"11","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\blocks\\SwipeControls.vue":"12","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\blocks\\Logo.vue":"13","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\blocks\\Route.vue":"14","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\ui\\Dialog.vue":"15","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\animations\\Portal.vue":"16"},{"size":165,"mtime":1700688268778,"hashOfConfig":"17"},{"size":1513,"mtime":1700430002840,"hashOfConfig":"17"},{"size":1550,"mtime":1700850776284,"hashOfConfig":"17"},{"size":804,"mtime":1700688952880,"hashOfConfig":"17"},{"size":2135,"mtime":1700689265787,"hashOfConfig":"17"},{"size":3117,"mtime":1700689271383,"hashOfConfig":"17"},{"size":2304,"mtime":1700689265769,"hashOfConfig":"17"},{"size":3232,"mtime":1700689265781,"hashOfConfig":"17"},{"size":1623,"mtime":1700748530633,"hashOfConfig":"17"},{"size":1150,"mtime":1706039004185,"hashOfConfig":"17"},{"size":2119,"mtime":1706017145787,"hashOfConfig":"17"},{"size":1345,"mtime":1706015856048,"hashOfConfig":"17"},{"size":1135,"mtime":1706030243608,"hashOfConfig":"17"},{"size":979,"mtime":1706003786966,"hashOfConfig":"17"},{"size":1519,"mtime":1706031675155,"hashOfConfig":"17"},{"size":16911,"mtime":1706027251875,"hashOfConfig":"17"},"5tgxr3"]
[{"D:\\Software\\Development\\Websites\\enderman.ch\\index\\assets\\styles\\transitions.scss":"1","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\TransitionY.vue":"2","D:\\Software\\Development\\Websites\\enderman.ch\\index\\app.vue":"3","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\EMail.vue":"4","D:\\Software\\Development\\Websites\\enderman.ch\\index\\pages\\about.vue":"5","D:\\Software\\Development\\Websites\\enderman.ch\\index\\pages\\index.vue":"6","D:\\Software\\Development\\Websites\\enderman.ch\\index\\pages\\projects.vue":"7","D:\\Software\\Development\\Websites\\enderman.ch\\index\\pages\\social.vue":"8","D:\\Software\\Development\\Websites\\enderman.ch\\index\\layouts\\Card.vue":"9","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\blocks\\Options.vue":"10","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\blocks\\Flooter.vue":"11","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\blocks\\SwipeControls.vue":"12","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\blocks\\Logo.vue":"13","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\blocks\\Route.vue":"14","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\ui\\Dialog.vue":"15","D:\\Software\\Development\\Websites\\enderman.ch\\index\\components\\animations\\Portal.vue":"16"},{"size":165,"mtime":1700688268778,"hashOfConfig":"17"},{"size":1513,"mtime":1700430002840,"hashOfConfig":"17"},{"size":1550,"mtime":1700850776284,"hashOfConfig":"17"},{"size":804,"mtime":1700688952880,"hashOfConfig":"17"},{"size":2135,"mtime":1700689265787,"hashOfConfig":"17"},{"size":3117,"mtime":1700689271383,"hashOfConfig":"17"},{"size":2304,"mtime":1700689265769,"hashOfConfig":"17"},{"size":3232,"mtime":1700689265781,"hashOfConfig":"17"},{"size":1623,"mtime":1700748530633,"hashOfConfig":"17"},{"size":761,"mtime":1706186305129,"hashOfConfig":"17"},{"size":2045,"mtime":1706266444695,"hashOfConfig":"17"},{"size":1236,"mtime":1706205683132,"hashOfConfig":"17"},{"size":1135,"mtime":1706030243608,"hashOfConfig":"17"},{"size":979,"mtime":1706003786966,"hashOfConfig":"17"},{"size":1519,"mtime":1706031675155,"hashOfConfig":"17"},{"size":16911,"mtime":1706027251875,"hashOfConfig":"17"},"5tgxr3"]

14
app.config.ts Normal file
View File

@ -0,0 +1,14 @@
import config from './config'
export default defineAppConfig({
...config,
nuxtIcon: {
size: '1em',
class: 'icon',
aliases: {},
iconifyApiOptions: {
url: 'https://api.iconify.design',
publicApiFallback: false,
},
},
})

16
app.vue
View File

@ -1,17 +1,11 @@
<script setup lang="ts">
import { useQuasar } from 'quasar'
import { useRuntimeConfig } from '#imports'
const config = useRuntimeConfig()
const quasar = useQuasar()
quasar.dark.set('auto')
const config = useAppConfig()
useHead({
titleTemplate: (chunk) => {
return !chunk || chunk === config.public.websiteName
? config.public.websiteName
: `${chunk} Enderman`
titleTemplate: (chunk?) => {
return chunk === config.title.short
? config.title.full
: `${chunk} ${config.title.short}`
},
})
</script>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 60 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" fill="none" viewBox="0 0 48 48" id="github"><rect width="48" height="48" fill="#000" rx="24"></rect><path fill="#fff" fill-rule="evenodd" d="M31.4225 46.8287C29.0849 47.589 26.5901 48 24 48C21.4081 48 18.9118 47.5884 16.5728 46.8272C17.6533 46.9567 18.0525 46.2532 18.0525 45.6458C18.0525 45.3814 18.048 44.915 18.0419 44.2911C18.035 43.5692 18.0259 42.6364 18.0195 41.5615C11.343 43.0129 9.9345 38.3418 9.9345 38.3418C8.844 35.568 7.2705 34.8294 7.2705 34.8294C5.091 33.3388 7.4355 33.369 7.4355 33.369C9.843 33.5387 11.1105 35.8442 11.1105 35.8442C13.2525 39.5144 16.728 38.4547 18.096 37.8391C18.3135 36.2871 18.9345 35.2286 19.62 34.6283C14.2905 34.022 8.688 31.9625 8.688 22.7597C8.688 20.1373 9.6225 17.994 11.1585 16.3142C10.911 15.7065 10.0875 13.2657 11.3925 9.95888C11.3925 9.95888 13.4085 9.31336 17.9925 12.4206C19.908 11.8876 21.96 11.6222 24.0015 11.6114C26.04 11.6218 28.0935 11.8876 30.0105 12.4206C34.5915 9.31336 36.603 9.95888 36.603 9.95888C37.9125 13.2657 37.089 15.7065 36.8415 16.3142C38.3805 17.994 39.309 20.1373 39.309 22.7597C39.309 31.9849 33.6975 34.0161 28.3515 34.6104C29.2125 35.3519 29.9805 36.8168 29.9805 39.058C29.9805 41.2049 29.9671 43.0739 29.9582 44.3125C29.9538 44.9261 29.9505 45.385 29.9505 45.6462C29.9505 46.2564 30.3401 46.9613 31.4225 46.8287Z" clip-rule="evenodd"></path></svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 65 65" fill="#fff"><use xlink:href="#B" x=".5" y=".5"/><defs><linearGradient id="A" x2="50%" x1="50%" y2="100%" y1="0%"><stop stop-color="#111d2e" offset="0%"/><stop stop-color="#051839" offset="21.2%"/><stop stop-color="#0a1b48" offset="40.7%"/><stop stop-color="#132e62" offset="58.1%"/><stop stop-color="#144b7e" offset="73.8%"/><stop stop-color="#136497" offset="87.3%"/><stop stop-color="#1387b8" offset="100%"/></linearGradient></defs><symbol id="B"><g><path d="M1.305 41.202C5.259 54.386 17.488 64 31.959 64c17.673 0 32-14.327 32-32s-14.327-32-32-32C15.001 0 1.124 13.193.028 29.874c2.074 3.477 2.879 5.628 1.275 11.328z" fill="url(#A)"/><path d="M30.31 23.985l.003.158-7.83 11.375c-1.268-.058-2.54.165-3.748.662a8.14 8.14 0 0 0-1.498.8L.042 29.893s-.398 6.546 1.26 11.424l12.156 5.016c.6 2.728 2.48 5.12 5.242 6.27a8.88 8.88 0 0 0 11.603-4.782 8.89 8.89 0 0 0 .684-3.656L42.18 36.16l.275.005c6.705 0 12.155-5.466 12.155-12.18s-5.44-12.16-12.155-12.174c-6.702 0-12.155 5.46-12.155 12.174zm-1.88 23.05c-1.454 3.5-5.466 5.147-8.953 3.694a6.84 6.84 0 0 1-3.524-3.362l3.957 1.64a5.04 5.04 0 0 0 6.591-2.719 5.05 5.05 0 0 0-2.715-6.601l-4.1-1.695c1.578-.6 3.372-.62 5.05.077 1.7.703 3 2.027 3.696 3.72s.692 3.56-.01 5.246M42.466 32.1a8.12 8.12 0 0 1-8.098-8.113 8.12 8.12 0 0 1 8.098-8.111 8.12 8.12 0 0 1 8.1 8.111 8.12 8.12 0 0 1-8.1 8.113m-6.068-8.126a6.09 6.09 0 0 1 6.08-6.095c3.355 0 6.084 2.73 6.084 6.095a6.09 6.09 0 0 1-6.084 6.093 6.09 6.09 0 0 1-6.081-6.093z"/></g></symbol></svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24" id="twitch"><path fill="#A071FF" d="M5 1.25C4.80109 1.25 4.61032 1.32902 4.46967 1.46967L1.46967 4.46967C1.32902 4.61032 1.25 4.80109 1.25 5V19.5C1.25 19.9142 1.58579 20.25 2 20.25H6.25V22C6.25 22.4142 6.58579 22.75 7 22.75H9C9.17545 22.75 9.34535 22.6885 9.48014 22.5762L12.2715 20.25H19C19.2508 20.25 19.4849 20.1247 19.624 19.916L22.624 15.416C22.7062 15.2928 22.75 15.1481 22.75 15V2C22.75 1.58579 22.4142 1.25 22 1.25H5Z"></path><path fill="#ECEFF1" d="M6 3.75C5.80109 3.75 5.61032 3.82902 5.46966 3.96967C5.32901 4.11033 5.25 4.3011 5.25 4.50001L5.2502 15C5.2502 15.4142 5.58599 15.75 6.0002 15.75H8.2502V17.5C8.2502 17.791 8.41854 18.0558 8.68208 18.1792C8.94562 18.3026 9.25677 18.2625 9.48033 18.0762L12.2717 15.75H17.7002C17.951 15.75 18.1851 15.6247 18.3242 15.416L20.1242 12.716C20.2064 12.5928 20.2502 12.4481 20.2502 12.3V4.5C20.2502 4.08579 19.9144 3.75 19.5002 3.75H6Z"></path><path fill="#A071FF" fill-rule="evenodd" d="M12 6.25C12.4142 6.25 12.75 6.58579 12.75 7V12C12.75 12.4142 12.4142 12.75 12 12.75 11.5858 12.75 11.25 12.4142 11.25 12V7C11.25 6.58579 11.5858 6.25 12 6.25zM16 6.25C16.4142 6.25 16.75 6.58579 16.75 7V12C16.75 12.4142 16.4142 12.75 16 12.75 15.5858 12.75 15.25 12.4142 15.25 12V7C15.25 6.58579 15.5858 6.25 16 6.25z" clip-rule="evenodd"></path></svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -1,10 +1,9 @@
// Libraries.
@use '@fortawesome/fontawesome-svg-core/styles.css' as fontawesome;
@use 'bootstrap' with (
$grid-breakpoints: (
xs: 0,
sm: 601px,
md: 996px,
md: 961px,
lg: 1281px,
xl: 1921px,
xxl: 2561px
@ -56,7 +55,7 @@ body {
// Entry point (Vue mount).
#ender-app {
flex: 1;
flex: 1 1 0;
image-rendering: auto;
}

View File

@ -1,5 +1,4 @@
<script setup lang="ts">
import { useQuasar } from 'quasar'
import type { PropType } from 'vue'
type ModeOptions = 'in-out' | 'out-in' | 'default' | undefined
@ -17,9 +16,12 @@ type RenderOptions =
| 'lg-down'
| 'lg-up'
| 'xl'
| 'xl-down'
| 'xl-up'
| 'xxl'
| undefined
const quasar = useQuasar()
const vdisp = ref(useVDisplay())
const props = defineProps({
fallback: {
type: String,
@ -54,27 +56,33 @@ const render = computed(() => {
case 'always':
return true
case 'xs':
return quasar.screen.xs
return vdisp.value.xs
case 'sm':
return quasar.screen.sm
return vdisp.value.sm
case 'sm-down':
return quasar.screen.xs || quasar.screen.sm
return vdisp.value.smAndDown
case 'sm-up':
return !quasar.screen.xs
return vdisp.value.smAndUp
case 'md':
return quasar.screen.md
return vdisp.value.md
case 'md-down':
return !quasar.screen.lg && !quasar.screen.xl
return vdisp.value.mdAndDown
case 'md-up':
return !quasar.screen.xs && !quasar.screen.sm
return vdisp.value.mdAndUp
case 'lg':
return quasar.screen.lg
return vdisp.value.lg
case 'lg-down':
return !quasar.screen.xl
return vdisp.value.lgAndDown
case 'lg-up':
return quasar.screen.lg || quasar.screen.xl
return vdisp.value.lgAndUp
case 'xl':
return quasar.screen.xl
return vdisp.value.xl
case 'xl-down':
return vdisp.value.xlAndDown
case 'xl-up':
return vdisp.value.xlAndUp
case 'xxl':
return vdisp.value.xxl
default:
return false
}
@ -91,7 +99,7 @@ const render = computed(() => {
:enter-active-class="`animate__animated ${props.enter}`"
:leave-active-class="`animate__animated ${props.leave}`"
>
<slot v-if="(quasar.screen.width || quasar.screen.height) && render" />
<slot v-if="render" />
</Transition>
</ClientOnly>
</template>

View File

@ -1,24 +1,22 @@
<script setup lang="ts">
import { useRuntimeConfig } from '#imports'
const props = defineProps({
opaque: Boolean,
})
const config = useRuntimeConfig()
const version = config.public.version
const buildDate = config.public.buildDate
const config = useAppConfig()
const currentYear = new Date().getFullYear()
const mailTemplate = `I've just found a bug on https://enderman.ch and would like to report it.%0D%0A%0D%0AWebsite version: ${
config.public.version
config.build.version
}%0D%0ABuild date: ${
config.public.buildDate
config.build.date
}%0D%0ATimestamp: ${new Date().toISOString()}%0D%0A%0D%0A%0D%0ASteps to reproduce:%0D%0A{ Explain in detail what happened here, or attach a video/screenshot }%0D%0A%0D%0AAdditional information:%0D%0A{ Helpful information, such as developer console output / Leave empty if none }%0D%0A%0D%0A%0D%0A// Keep in mind that it's just a template, you can change it as you wish! :)`
</script>
<template>
<footer class="user-select-none text-align-center line-height-1-5">
<footer
class="user-select-none pass-through text-align-center line-height-1-5"
>
<span
class="font-small"
:class="{
@ -50,8 +48,8 @@ const mailTemplate = `I've just found a bug on https://enderman.ch and would lik
>. All rights reserved.
<wbr />
<sub class="nobr">
β{{ version ? version : '?.?.?' }} ({{
buildDate ? buildDate : '1970-01-01'
β{{ config.build.version ? config.build.version : '?.?.?' }} ({{
config.build.date ? config.build.date : '1970-01-01'
}})
</sub>
</span>

View File

@ -1,31 +1,9 @@
<script setup lang="ts">
import { useQuasar } from 'quasar'
import Dialog from '~/components/ui/Dialog.vue'
import cogIcon from '~/assets/images/icons/cog.png'
import pearlIcon from '~/assets/images/icons/pearl.gif'
const quasar = useQuasar()
function optionsMenu() {
quasar
.dialog({
component: Dialog,
componentProps: {
icon: pearlIcon,
alt: 'Pearl',
},
})
.onOk(() => {
console.log('OK')
})
.onCancel(() => {
console.log('Cancel')
})
.onDismiss(() => {
console.log('OK or Cancel (Dialog Dismissed)')
})
}
function optionsMenu() {}
</script>
<template>

View File

@ -1,5 +1,4 @@
<script setup lang="ts">
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import { storeToRefs } from 'pinia'
import { usePageStore } from '~/stores/pages'
@ -25,11 +24,11 @@ const state = computed(() => {
<template>
<div class="control-layout pass-through">
<NuxtLink class="control-icon no-decoration" :to="state.prev">
<FontAwesomeIcon icon="fa-solid fa-angle-left" fixed-width />
<Icon name="iconoir:nav-arrow-left" />
</NuxtLink>
<NuxtLink class="control-icon no-decoration" :to="state.next">
<FontAwesomeIcon icon="fa-solid fa-angle-right" fixed-width />
<Icon name="iconoir:nav-arrow-right" />
</NuxtLink>
</div>
</template>

View File

@ -0,0 +1 @@
<template></template>

View File

@ -0,0 +1 @@
<template></template>

View File

@ -0,0 +1 @@
<template></template>

View File

@ -1,13 +1,4 @@
<script setup>
import { useDialogPluginComponent } from 'quasar'
const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } =
useDialogPluginComponent()
defineEmits({
...useDialogPluginComponent.emitsObject,
})
const props = defineProps({
icon: {
type: String,
@ -24,61 +15,62 @@ const animation = ref(true)
</script>
<template>
<QDialog ref="dialogRef" @hide="onDialogHide">
<QCard class="dialog">
<div class="overlay background"></div>
<div class="overlay content">
<img
class="icon-badge user-select-none"
draggable="false"
:src="props.icon"
:alt="props.alt"
/>
<QCardSection>
<h3 class="alex text-align-center">Site options</h3>
<div class="row">
<div class="col-12 col-sm-6">
<p>
<strong>Theme</strong><br />
Available in all flavors, vanilla and chocolate.
</p>
<QToggle
v-model="theme"
class="px-5"
color="black"
dense
size="xl"
:unchecked-icon="mdiWhiteBalanceSunny"
:checked-icon="mdiWeatherNight"
icon-color="primary"
@change="theme = !theme"
/>
<QCheckbox v-model="theme" />
</div>
<div class="col-12 col-sm-6">
<p>
<strong>Animation</strong><br />
Some computers may have issues rendering that gorgeous
background animation. Enabling it substantially increases power
consumption.
</p>
<QToggle
v-model="animation"
color="purple"
dense
size="xl"
:unchecked-icon="mdiStop"
:checked-icon="mdiPlay"
@change="theme = !theme"
/>
</div>
</div>
Report a bug
<QCardActions>
<QBtn label="OK" @click="onDialogOK" />
</QCardActions>
</QCardSection>
</div>
</QCard>
</QDialog>
<p>FALSE</p>
<!-- <QDialog ref="dialogRef" @hide="onDialogHide">-->
<!-- <QCard class="dialog">-->
<!-- <div class="overlay background"></div>-->
<!-- <div class="overlay content">-->
<!-- <img-->
<!-- class="icon-badge user-select-none"-->
<!-- draggable="false"-->
<!-- :src="props.icon"-->
<!-- :alt="props.alt"-->
<!-- />-->
<!-- <QCardSection>-->
<!-- <h3 class="alex text-align-center">Site options</h3>-->
<!-- <div class="row">-->
<!-- <div class="col-12 col-sm-6">-->
<!-- <p>-->
<!-- <strong>Theme</strong><br />-->
<!-- Available in all flavors, vanilla and chocolate.-->
<!-- </p>-->
<!-- <QToggle-->
<!-- v-model="theme"-->
<!-- class="px-5"-->
<!-- color="black"-->
<!-- dense-->
<!-- size="xl"-->
<!-- :unchecked-icon="mdiWhiteBalanceSunny"-->
<!-- :checked-icon="mdiWeatherNight"-->
<!-- icon-color="primary"-->
<!-- @change="theme = !theme"-->
<!-- />-->
<!-- <QCheckbox v-model="theme" />-->
<!-- </div>-->
<!-- <div class="col-12 col-sm-6">-->
<!-- <p>-->
<!-- <strong>Animation</strong><br />-->
<!-- Some computers may have issues rendering that gorgeous-->
<!-- background animation. Enabling it substantially increases power-->
<!-- consumption.-->
<!-- </p>-->
<!-- <QToggle-->
<!-- v-model="animation"-->
<!-- color="purple"-->
<!-- dense-->
<!-- size="xl"-->
<!-- :unchecked-icon="mdiStop"-->
<!-- :checked-icon="mdiPlay"-->
<!-- @change="theme = !theme"-->
<!-- />-->
<!-- </div>-->
<!-- </div>-->
<!-- Report a bug-->
<!-- <QCardActions>-->
<!-- <QBtn label="OK" @click="onDialogOK" />-->
<!-- </QCardActions>-->
<!-- </QCardSection>-->
<!-- </div>-->
<!-- </QCard>-->
<!-- </QDialog>-->
</template>

20
components/ui/XIcon.vue Normal file
View File

@ -0,0 +1,20 @@
<script setup lang="ts">
const props = defineProps({
name: {
type: String,
required: true,
},
size: {
type: String,
default: 'md',
},
color: {
type: String,
default: 'currentColor',
},
})
</script>
<template></template>
<style scoped lang="scss"></style>

View File

@ -0,0 +1,18 @@
import { useDark, useToggle } from '@vueuse/core'
export function useCustomTheme() {
const { $vuetify } = useNuxtApp()
const isDark = useDark({
valueDark: 'dark',
valueLight: 'light',
initialValue: 'light',
onChanged: (dark: boolean) => {
$vuetify.theme.global.name.value = dark ? 'dark' : 'light'
},
})
const toggle = useToggle(isDark)
return { isDark, toggle }
}

36
config.ts Normal file
View File

@ -0,0 +1,36 @@
import packageJSON from './package.json'
interface TitleConfig {
full: string
short: string
}
interface BuildConfig {
date?: string
version: string
}
type config = {
url: string
name: string
title: TitleConfig
description: string
locale: string
build: BuildConfig
}
export default {
url: 'https://enderman.ch',
name: packageJSON.name || 'app',
title: {
full: "Enderman's Website",
short: 'Enderman',
},
description:
'A software engineer, a malware enthusiast and, most importantly, a weird tall creature. I have over 300K subscribers on YouTube and over 20K followers on Twitter.',
locale: 'en',
build: {
date: new Date().toISOString().split('T')[0],
version: packageJSON.version || '0.0.0',
},
} satisfies config as config

View File

@ -1,15 +1,11 @@
import packageJSON from './package.json'
const websiteName = "Enderman's Website"
const websiteURL = 'https://enderman.ch'
const buildDate = new Date().toISOString().split('T')[0]
import config from './config'
// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
app: {
head: {
htmlAttrs: {
lang: 'en',
lang: config.locale,
},
link: [
{
@ -35,6 +31,9 @@ export default defineNuxtConfig({
pageTransition: { name: 'page', mode: 'out-in' },
rootId: 'ender-app',
},
features: {
inlineStyles: false,
},
components: {
dirs: [
{
@ -47,18 +46,19 @@ export default defineNuxtConfig({
css: ['~/assets/styles/main.scss'],
plugins: [],
modules: [
'@pinia/nuxt',
'@nuxt/content',
'nuxt-quasar-ui',
['@nuxtjs/eslint-module', { failOnError: false, lintOnStart: false }],
['@nuxtjs/stylelint-module', { failOnError: true, lintOnStart: false }],
'@nuxtjs/color-mode',
'@pinia/nuxt',
'@nuxtjs/strapi',
'@nuxt/content',
'vuetify-nuxt-module',
'@nuxtjs/google-fonts',
'nuxt-icon',
'nuxt-site-config',
'nuxt-simple-sitemap',
'nuxt-simple-robots',
'nuxt-link-checker',
'nuxt-og-image',
'@nuxtjs/strapi',
'nuxt-link-checker',
],
nitro: {
prerender: {
@ -68,27 +68,34 @@ export default defineNuxtConfig({
routes: ['/robots.txt', '/sitemap.xml'],
},
},
quasar: {
lang: 'en-US',
plugins: ['Dark', 'Dialog'],
config: {
brand: {
primary: '#271249',
secondary: '#00A2ED',
accent: '#9C27B0',
dark: '#1D1D1D',
'dark-page': '#121212',
positive: '#21BA45',
negative: '#C10015',
info: '#31CCEC',
warning: '#F2C037',
vuetify: {
moduleOptions: {
importComposables: true,
prefixComposables: true,
styles: 'none',
includeTransformAssetsUrls: true,
ssrClientHints: {
reloadOnFirstRequest: false,
viewportSize: true,
prefersColorScheme: true,
// prefersColorSchemeOptions: {
// cookieName: 'color-scheme',
// lightThemeName: 'light',
// darkThemeName: 'dark',
// useBrowserThemeOnly: false,
// },
prefersReducedMotion: false,
},
},
extras: {
font: null,
svgIcons: ['mdi-v7'],
vuetifyOptions: {
ssr: {
clientWidth: 0,
clientHeight: 0,
},
components: false,
labComponents: true,
directives: false,
icons: false,
},
},
googleFonts: {
@ -99,8 +106,18 @@ export default defineNuxtConfig({
},
},
site: {
url: websiteURL,
name: websiteName,
env: process.env.NODE_ENV,
url: config.url,
name: config.name,
indexable: true,
trailingSlash: false,
},
linkChecker: {
failOnError: true,
report: {
html: true,
markdown: true,
},
},
routeRules: {
'/': {
@ -149,42 +166,12 @@ export default defineNuxtConfig({
// },
},
robots: {
enabled: true,
metaTag: true,
blockNonSeoBots: true,
credits: false,
},
linkChecker: {
failOnError: true,
report: {
html: true,
markdown: true,
},
},
typescript: {
typeCheck: true,
},
runtimeConfig: {
public: {
version: JSON.stringify(packageJSON.version).slice(1, -1),
buildDate,
websiteName,
websiteURL,
},
},
/* vite: {
build: {
rollupOptions: {
output: {
manualChunks(id: string) {
if (id.includes('node_modules')) {
return id
.toString()
.split('node_modules/')[1]
.split('/')[0]
.toString()
}
},
},
},
},
}, */
})

2083
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -1,5 +1,6 @@
{
"name": "index",
"name": "enderapp",
"version": "0.1.3",
"private": true,
"type": "module",
"scripts": {
@ -15,9 +16,8 @@
},
"devDependencies": {
"@nuxt/content": "^2.11.0",
"@nuxt/devtools": "latest",
"@nuxt/devtools": "^1.0.8",
"@nuxt/types": "^2.17.3",
"@nuxtjs/color-mode": "^3.3.2",
"@nuxtjs/eslint-config-typescript": "^12.1.0",
"@nuxtjs/eslint-module": "^4.1.0",
"@nuxtjs/google-fonts": "^3.1.3",
@ -27,40 +27,33 @@
"@typescript-eslint/parser": "^6.19.1",
"animate.css": "latest",
"bootstrap": "^5.3.2",
"caniuse-lite": "^1.0.30001579",
"csso": "^5.0.5",
"caniuse-lite": "^1.0.30001580",
"eslint": "^8.56.0",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-nuxt": "^4.0.0",
"eslint-plugin-prettier": "^5.1.3",
"nuxt": "^3.9.3",
"nuxt-link-checker": "^2.1.11",
"nuxt-og-image": "^2.2.4",
"nuxt-quasar-ui": "^2.0.7",
"nuxt-icon": "^0.6.8",
"nuxt-link-checker": "^3.0.0-rc.6",
"nuxt-og-image": "^3.0.0-rc.29",
"nuxt-simple-robots": "^4.0.0-rc.13",
"nuxt-simple-sitemap": "^4.4.1",
"nuxt-site-config": "^2.2.8",
"pinia": "^2.1.7",
"prettier": "^3.2.4",
"quasar": "^2.14.2",
"sass": "^1.70.0",
"stylelint": "^15.11.0",
"stylelint-config-recommended-vue": "^1.5.0",
"stylelint-config-standard-scss": "^11.0.0",
"typescript": "^5.3.3",
"vite-plugin-require": "^1.1.14",
"vue": "^3.4.15",
"vue-router": "^4.2.5",
"vue-tsc": "^1.8.27"
"vue-tsc": "^1.8.27",
"vuetify": "^3.5.1",
"vuetify-nuxt-module": "^0.10.2"
},
"dependencies": {
"@fortawesome/fontawesome-free": "^6.5.1",
"@fortawesome/fontawesome-svg-core": "^6.5.1",
"@fortawesome/free-brands-svg-icons": "^6.5.1",
"@fortawesome/free-regular-svg-icons": "^6.5.1",
"@fortawesome/free-solid-svg-icons": "^6.5.1",
"@fortawesome/vue-fontawesome": "^3.0.5",
"@quasar/extras": "^1.16.9"
},
"version": "0.1.3"
"@date-io/date-fns": "^3.0.0",
"date-fns": "^3.3.1"
}
}

View File

@ -1,13 +1,10 @@
<script setup lang="ts">
import { useRuntimeConfig } from '#imports'
const config = useRuntimeConfig()
const config = useAppConfig()
const meta = {
title: 'Enderman',
description:
'A software engineer, a malware enthusiast and, most importantly, a weird tall creature. I have over 300K subscribers on YouTube and over 20K followers on Twitter.',
description: config.description,
image: 'https://enderman.ch/images/logo.png',
url: 'https://enderman.ch/',
url: config.url,
}
useSeoMeta({
@ -25,7 +22,7 @@ useSeoMeta({
})
useHead({
title: config.public.websiteName ? config.public.websiteName : 'Enderman',
title: 'Enderman',
htmlAttrs: {
lang: 'en',
},

View File

@ -1,16 +1,14 @@
<script setup lang="ts">
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
const socials = [
{
name: 'YouTube',
url: 'https://go.enderman.ch/youtube',
icon: 'youtube',
icon: 'youtube-icon',
},
{
name: 'Andrew',
url: 'https://go.enderman.ch/andrew',
icon: 'youtube',
icon: 'youtube-icon',
},
{
name: 'Twitch',
@ -20,7 +18,7 @@ const socials = [
{
name: 'TikTok',
url: 'https://go.enderman.ch/tiktok',
icon: 'tiktok',
icon: 'tiktok-icon',
},
{
name: 'Twitter',
@ -35,12 +33,12 @@ const socials = [
{
name: 'Discord',
url: 'https://go.enderman.ch/discord',
icon: 'discord',
icon: 'discord-icon',
},
{
name: 'GitHub',
url: 'https://go.enderman.ch/github',
icon: 'github',
icon: 'github-icon',
},
{
name: 'Steam',
@ -91,7 +89,6 @@ useHead({
<h3 class="alex">Online presence</h3>
<hr />
<p>
<FontAwesomeIcon icon="fa-solid fa-" fixed-width />
<strong>🚧 This page is currently under construction.</strong> Expect a
lot more content to be added as time passes.
<em>Please report all bugs you encounter via the link in the footer</em>,
@ -104,12 +101,7 @@ useHead({
<ul class="list-style-type-none p-0">
<li v-for="(page, index) in socials" :key="index">
<div class="d-flex flex-row align-items-center gap-1">
<ClientOnly>
<FontAwesomeIcon
:icon="`fa-brands fa-${page.icon}`"
fixed-width
/>
</ClientOnly>
<Icon :name="`logos:${page.icon}`" />
<a
class="link-hi"
target="_blank"

View File

@ -1,15 +0,0 @@
import { library, config } from '@fortawesome/fontawesome-svg-core'
import { fab } from '@fortawesome/free-brands-svg-icons'
import { fas } from '@fortawesome/free-solid-svg-icons'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
// Add icon packs.
library.add(fab, fas)
// Let Nuxt manage CSS.
config.autoAddCss = false
export default defineNuxtPlugin((nuxtApp) => {
nuxtApp.vueApp.component('FontAwesomeIcon', FontAwesomeIcon)
})

View File

@ -1,12 +0,0 @@
import { Screen } from 'quasar'
export default defineNuxtPlugin(() => {
Screen.setSizes({
sm: 601,
md: 996,
lg: 1281,
xl: 1921,
})
Screen.setDebounce(0)
})

View File

@ -1,31 +0,0 @@
import type { Router } from 'vue-router'
interface CustomRouter extends Router {
running?: boolean
nextRoute?: string | null
}
export default defineNuxtPlugin((nuxtApp) => {
const customRouter: CustomRouter = useRouter()
nuxtApp.hook('page:start', () => {
customRouter.running = false
customRouter.beforeEach((to, _from, next) => {
if (customRouter.running) {
next(true)
} else {
customRouter.nextRoute = to.fullPath
next(false)
}
})
})
nuxtApp.hook('page:transition:finish', () => {
customRouter.running = true
if (customRouter.nextRoute) {
customRouter
.push(customRouter.nextRoute)
.then(() => (customRouter.nextRoute = null))
}
})
})

View File

@ -2,6 +2,6 @@
// https://nuxt.com/docs/guide/concepts/typescript
"extends": "./.nuxt/tsconfig.json",
"compilerOptions": {
"types": ["vite/client"]
"types": ["vite/client"],
}
}