SebinNyshkim/viktor-reference
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

style: run linter

Browse source
This commit is contained in:
Sebin Nyshkim 2023-04-03 00:33:35 +02:00
parent bb724f581b
commit b57c5a9be8
7 changed files with 94 additions and 99 deletions
Download patch file Download diff file Expand all files Collapse all files

18
.eslintrc.cjs
View file

@ -1,15 +1,15 @@
/* eslint-env node */
require("@rushstack/eslint-patch/modern-module-resolution");
require('@rushstack/eslint-patch/modern-module-resolution')
module.exports = {
root: true,
extends: [
"plugin:vue/vue3-essential",
"eslint:recommended",
"@vue/eslint-config-typescript",
"@vue/eslint-config-prettier",
'extends': [
'plugin:vue/vue3-essential',
'eslint:recommended',
'@vue/eslint-config-typescript',
'@vue/eslint-config-prettier/skip-formatting'
],
parserOptions: {
ecmaVersion: "latest",
},
};
ecmaVersion: 'latest'
}
}

33
src/components/LocaleSwitcher.vue
View file

@ -1,43 +1,42 @@
<script setup lang="ts">
import { computed } from "vue";
import CircleCheckIcon from "@/assets/icons/CircleCheckIcon.vue";
import CircleIcon from "@/assets/icons/CircleIcon.vue";
import { computed } from 'vue'
import CircleCheckIcon from '@/assets/icons/CircleCheckIcon.vue'
import CircleIcon from '@/assets/icons/CircleIcon.vue'
interface LocaleOption {
code: string;
name: string;
flag: string;
code: string
name: string
flag: string
}
interface Props {
modelValue: string;
id: string;
locales: LocaleOption[];
modelValue: string
id: string
locales: LocaleOption[]
}
const props = defineProps<Props>();
const emit = defineEmits(["update:modelValue"]);
const props = defineProps<Props>()
const emit = defineEmits(['update:modelValue'])
const selectModel = computed({
get() {
return props.modelValue;
return props.modelValue
},
set(value) {
emit("update:modelValue", value);
},
});
emit('update:modelValue', value)
}
})
</script>
<template>
<div class="localeselect">
<div v-for="locale in locales" class="localeselect__locale">
<div v-for="locale in locales" class="localeselect__locale" :key="`locale-${locale.code}`">
<input
type="radio"
name="lang"
class="localeselect__input"
:id="`lang-${locale.code}`"
:value="locale.code"
:key="`locale-${locale.code}`"
v-model="selectModel"
/>
<label class="localeselect__label" :for="`lang-${locale.code}`">

5
src/components/SiteNavigation.vue
View file

@ -1,8 +1,3 @@
<script setup lang="ts">
import router from "@/router";
import { RouterLink } from "vue-router";
</script>
<template>
<nav class="navigation">
<div class="navigation__list">

31
src/views/AnatomyView.vue
View file

@ -1,17 +1,17 @@
<script setup lang="ts">
import RefImage from "@/components/RefImage.vue";
import ColorTable from "@/components/ColorTable.vue";
import RefImage from '@/components/RefImage.vue'
import ColorTable from '@/components/ColorTable.vue'
const colors = [
{ name: "data.colors.front", value: "#e7c7b1" },
{ name: "data.colors.limbs", value: "#493428" },
{ name: "data.colors.back", value: "#422322" },
{ name: "data.colors.spine", value: "#341c1c" },
{ name: "data.colors.tissue", value: "#6bb9db" },
{ name: "data.colors.spikes", value: "#f8ebdd" },
{ name: "data.colors.eyesPrimary", value: "#a7eef1" },
{ name: "data.colors.eyesSecondary", value: "#6dabd1" },
];
{ name: 'data.colors.front', value: '#e7c7b1' },
{ name: 'data.colors.limbs', value: '#493428' },
{ name: 'data.colors.back', value: '#422322' },
{ name: 'data.colors.spine', value: '#341c1c' },
{ name: 'data.colors.tissue', value: '#6bb9db' },
{ name: 'data.colors.spikes', value: '#f8ebdd' },
{ name: 'data.colors.eyesPrimary', value: '#a7eef1' },
{ name: 'data.colors.eyesSecondary', value: '#6dabd1' }
]
</script>
<template>
@ -71,14 +71,15 @@ const colors = [
</template>
<template #caption>
{{ $t('anatomy.images.back.caption') }} &copy; <a href="http://twitter.com/sabertoofs">sabertoofs</a>
{{ $t('anatomy.images.back.caption') }} &copy;
<a href="http://twitter.com/sabertoofs">sabertoofs</a>
</template>
</RefImage>
<ColorTable :colors="colors"></ColorTable>
<section>
<p v-for="p in $tm('anatomy.paragraphs[0]')">{{ p }}</p>
<p v-for="(p, i) in $tm('anatomy.paragraphs[0]')" :key="i">{{ p }}</p>
</section>
<RefImage dropshadow>
@ -151,12 +152,12 @@ const colors = [
</template>
<template #caption>
{{ $t("anatomy.images.front.caption") }} &copy;
{{ $t('anatomy.images.front.caption') }} &copy;
<a href="http://twitter.com/sabertoofs">sabertoofs</a>
</template>
</RefImage>
<section>
<p v-for="p in $tm('anatomy.paragraphs[1]')">{{ p }}</p>
<p v-for="(p, i) in $tm('anatomy.paragraphs[1]')" :key="i">{{ p }}</p>
</section>
</template>

26
src/views/CareerPathView.vue
View file

@ -1,13 +1,13 @@
<script setup lang="ts">
import TimelineList from "@/components/TimelineList.vue";
import TimelineItem from "@/components/TimelineItem.vue";
import WhiskeyGlassIcon from "@/assets/icons/WhiskeyGlassIcon.vue";
import TreeIcon from "@/assets/icons/TreeIcon.vue";
import CarIcon from "@/assets/icons/CarIcon.vue";
import HelmetSafetyIcon from "@/assets/icons/HelmetSafetyIcon.vue";
import IndustryIcon from "@/assets/icons/IndustryIcon.vue";
import TruckIcon from "@/assets/icons/TruckIcon.vue";
import BoxesIcon from "@/assets/icons/BoxesIcon.vue";
import TimelineList from '@/components/TimelineList.vue'
import TimelineItem from '@/components/TimelineItem.vue'
import WhiskeyGlassIcon from '@/assets/icons/WhiskeyGlassIcon.vue'
import TreeIcon from '@/assets/icons/TreeIcon.vue'
import CarIcon from '@/assets/icons/CarIcon.vue'
import HelmetSafetyIcon from '@/assets/icons/HelmetSafetyIcon.vue'
import IndustryIcon from '@/assets/icons/IndustryIcon.vue'
import TruckIcon from '@/assets/icons/TruckIcon.vue'
import BoxesIcon from '@/assets/icons/BoxesIcon.vue'
const jobIcons = [
WhiskeyGlassIcon,
@ -16,18 +16,18 @@ const jobIcons = [
HelmetSafetyIcon,
IndustryIcon,
TruckIcon,
BoxesIcon,
];
BoxesIcon
]
</script>
<template>
<section>
<h1>{{ $t(`${$route.meta.title}`) }}</h1>
<p v-for="p in $tm('career.paragraphs')">{{ p }}</p>
<p v-for="(p, i) in $tm('career.paragraphs')" :key="i">{{ p }}</p>
</section>
<TimelineList>
<TimelineItem v-for="(job, idx) in $tm('career.jobs')">
<TimelineItem v-for="(job, idx) in $tm('career.jobs')" :key="idx">
<template #icon>
<component :is="jobIcons[idx as number]"></component>
</template>

70
src/views/GeneralView.vue
View file

@ -1,50 +1,50 @@
<script setup lang="ts">
import DataTable from "@/components/DataTable.vue";
import DataTable from '@/components/DataTable.vue'
const dob = new Date("1987-12-08");
const locale = "en-US";
const dob = new Date('1987-12-08')
const locale = 'en-US'
const dateFormat = new Intl.DateTimeFormat(locale, {
year: "numeric",
month: "long",
day: "2-digit",
});
year: 'numeric',
month: 'long',
day: '2-digit'
})
const height = 227;
const weight = 175;
const height = 227
const weight = 175
const toImperial = (cm: number): string => {
const realFeet = (cm * 0.3937) / 12;
const feet = Math.floor(realFeet);
const inches = Math.round((realFeet - feet) * 12);
const realFeet = (cm * 0.3937) / 12
const feet = Math.floor(realFeet)
const inches = Math.round((realFeet - feet) * 12)
return `${feet}'${inches}"`;
};
return `${feet}'${inches}"`
}
const toInch = (cm: number): string => {
return `${Math.round(cm / 2.45)} in`;
};
return `${Math.round(cm / 2.45)} in`
}
const toLbs = (kg: number): number => {
const nearExact = kg / 0.45359237;
const lbs = Math.floor(nearExact);
const nearExact = kg / 0.45359237
const lbs = Math.floor(nearExact)
return lbs;
};
return lbs
}
const heads = ["data.general.heading[0]", "data.general.heading[1]"];
const heads = ['data.general.heading[0]', 'data.general.heading[1]']
const data = [
["data.general.fullName[0]", "data.general.fullName[1]"],
["data.general.dob[0]", dateFormat.format(dob)],
["data.general.gender[0]", "data.general.gender[1]"],
["data.general.height[0]", `${height} cm (${toImperial(height)})`],
["data.general.weight[0]", `${weight} kg (${toLbs(weight)} lbs)`],
];
['data.general.fullName[0]', 'data.general.fullName[1]'],
['data.general.dob[0]', dateFormat.format(dob)],
['data.general.gender[0]', 'data.general.gender[1]'],
['data.general.height[0]', `${height} cm (${toImperial(height)})`],
['data.general.weight[0]', `${weight} kg (${toLbs(weight)} lbs)`]
]
const sexHeads = ["data.sexuality.heading[0]", "data.sexuality.heading[1]"];
const sexHeads = ['data.sexuality.heading[0]', 'data.sexuality.heading[1]']
const sexData = [
["data.sexuality.identifiesAs[0]", "data.sexuality.identifiesAs[1]"],
["data.sexuality.preferredRole[0]", "data.sexuality.preferredRole[1]"],
];
['data.sexuality.identifiesAs[0]', 'data.sexuality.identifiesAs[1]'],
['data.sexuality.preferredRole[0]', 'data.sexuality.preferredRole[1]']
]
</script>
<template>
@ -55,17 +55,17 @@ const sexData = [
<DataTable :headings="heads" :data="data"></DataTable>
<section>
<h2>{{ $t("general.personality.heading") }}</h2>
<p v-for="p in $tm('general.personality.paragraphs')">{{ p }}</p>
<h2>{{ $t('general.personality.heading') }}</h2>
<p v-for="(p, i) in $tm('general.personality.paragraphs')" :key="i">{{ p }}</p>
</section>
<section>
<h2>{{ $t("general.sexuality.heading") }}</h2>
<h2>{{ $t('general.sexuality.heading') }}</h2>
</section>
<DataTable :headings="sexHeads" :data="sexData"></DataTable>
<section>
<p v-for="p in $tm('general.sexuality.paragraphs')">{{ p }}</p>
<p v-for="(p, i) in $tm('general.sexuality.paragraphs')" :key="i">{{ p }}</p>
</section>
</template>

10
src/views/HomeView.vue
View file

@ -1,16 +1,16 @@
<script setup lang="ts">
import WelcomeHeader from "@/components/WelcomeHeader.vue";
import WelcomeHeader from '@/components/WelcomeHeader.vue'
</script>
<template>
<WelcomeHeader>
<template #main>{{ $t("welcomeHeader.mainTitle") }}</template>
<template #sub>{{ $t("welcomeHeader.subTitle") }}</template>
<template #main>{{ $t('welcomeHeader.mainTitle') }}</template>
<template #sub>{{ $t('welcomeHeader.subTitle') }}</template>
</WelcomeHeader>
<section>
<h3>{{ $t("home.heading") }}</h3>
<h3>{{ $t('home.heading') }}</h3>
<p v-for="p in $tm('home.paragraphs')">{{ p }}</p>
<p v-for="(p, i) in $tm('home.paragraphs')" :key="i">{{ p }}</p>
</section>
</template>