♻️ Move from .vue files to Lucide for icons

This commit is contained in:
2023-06-04 00:08:30 +02:00
parent 7b04760a7d
commit 1ad6fc5e3a
18 changed files with 27 additions and 204 deletions

10
package-lock.json generated
View File

@ -7,8 +7,10 @@
"": {
"name": "timetable-v2",
"version": "0.0.0",
"license": "GPL-3.0-or-later",
"dependencies": {
"dayjs": "^1.11.3",
"lucide-vue-next": "^0.233.0",
"swiper": "^9.3.2",
"vite-plugin-git-revision": "^0.1.9",
"vue": "^3.2.37",
@ -4417,6 +4419,14 @@
"node": ">=10"
}
},
"node_modules/lucide-vue-next": {
"version": "0.233.0",
"resolved": "https://registry.npmjs.org/lucide-vue-next/-/lucide-vue-next-0.233.0.tgz",
"integrity": "sha512-cZbLMXQLMLy5i9ax/6wc0IP9gknAhWfLNdlBzUaRmmG3pUCDvGhTy86pu2/G1mGo94S+wSc6ILcqgvo4Qys2aw==",
"peerDependencies": {
"vue": ">=3.0.1"
}
},
"node_modules/magic-string": {
"version": "0.30.0",
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.0.tgz",

View File

@ -11,6 +11,7 @@
},
"dependencies": {
"dayjs": "^1.11.3",
"lucide-vue-next": "^0.233.0",
"swiper": "^9.3.2",
"vite-plugin-git-revision": "^0.1.9",
"vue": "^3.2.37",

View File

@ -1,7 +1,5 @@
<script setup>
import CalendarIcon from "./icons/calendar-icon.vue";
import BellIcon from "./icons/bell-icon.vue";
import ClockIcon from "./icons/clock-icon.vue";
import { CalendarIcon, BellIcon, ClockIcon } from "lucide-vue-next";
import { RouterLink } from "vue-router";
</script>
@ -9,19 +7,19 @@ import { RouterLink } from "vue-router";
<div class="bottomnav">
<div class="entry">
<RouterLink to="/timetable">
<CalendarIcon class="icon" />
<CalendarIcon size="30" class="icon" />
<span class="title">{{ $t("title.timetable") }}</span>
</RouterLink>
</div>
<div class="entry">
<RouterLink to="/substitutions">
<BellIcon class="icon" />
<BellIcon size="30" class="icon" />
<span class="title">{{ $t("title.substitutions") }}</span>
</RouterLink>
</div>
<div class="entry">
<RouterLink to="/history">
<ClockIcon class="icon" />
<ClockIcon size="30" class="icon" />
<span class="title">{{ $t("title.history") }}</span>
</RouterLink>
</div>

View File

@ -1,6 +1,6 @@
<script setup>
import { selectedDate, selectedDay, changeDay, changeDate } from "../store";
import ArrowIcon from "./icons/arrow-icon.vue";
import { ArrowLeftIcon, ArrowRightIcon } from "lucide-vue-next";
import dayjs from "dayjs";
import { getDateSkippingWeekend } from "../util";
@ -17,7 +17,7 @@ const dayNames = [
<template>
<div class="selector">
<ArrowIcon @click="changeDay--" />
<ArrowLeftIcon @click="changeDay--" />
<span
class="day"
@click="changeDate = getDateSkippingWeekend(dayjs().toDate(), true)"
@ -25,7 +25,7 @@ const dayNames = [
{{ $t(dayNames[selectedDay + 1]) }},
{{ dayjs(selectedDate).format("DD.MM.YYYY") }}
</span>
<ArrowIcon style="transform: rotate(180deg)" @click="changeDay++" />
<ArrowRightIcon @click="changeDay++" />
</div>
</template>

View File

@ -4,8 +4,7 @@ import { getSubstitutionText } from "../util";
import { computed } from "vue";
import dayjs from "dayjs";
import InfoCard from "./info-card.vue";
import ClockIconBig from "./icons/clock-icon-big.vue";
import ClockOffIcon from "./icons/clock-off-icon.vue";
import { ClockIcon, AlarmClockOffIcon } from "lucide-vue-next";
const props = defineProps({
date: {
@ -27,13 +26,13 @@ const chars = {
<template>
<InfoCard
v-show="typeof historyOfDate == 'undefined'"
:icon="ClockIconBig"
:icon="ClockIcon"
:title="$t('infoCard.titles.loading')"
:text="$t('infoCard.texts.loading')"
/>
<InfoCard
v-show="typeof historyOfDate == 'object' && historyOfDate.length == 0"
:icon="ClockOffIcon"
:icon="AlarmClockOffIcon"
:title="$t('infoCard.titles.noHistory')"
:text="$t('infoCard.texts.noHistory')"
/>

View File

@ -1,19 +0,0 @@
<!-- From https://github.com/feathericons/feather -->
<template>
<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>
</template>

View File

@ -1,19 +0,0 @@
<!-- From https://github.com/feathericons/feather -->
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
width="30"
height="30"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-bell"
>
<path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path>
<path d="M13.73 21a2 2 0 0 1-3.46 0"></path>
</svg>
</template>

View File

@ -1,22 +0,0 @@
<!-- From https://github.com/feathericons/feather -->
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
width="30"
height="30"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-bell-off"
>
<path d="M13.73 21a2 2 0 0 1-3.46 0"></path>
<path d="M18.63 13A17.89 17.89 0 0 1 18 8"></path>
<path d="M6.26 6.26A5.86 5.86 0 0 0 6 8c0 7-3 9-3 9h14"></path>
<path d="M18 8a6 6 0 0 0-9.33-5"></path>
<line x1="1" y1="1" x2="23" y2="23"></line>
</svg>
</template>

View File

@ -1,21 +0,0 @@
<!-- From https://github.com/feathericons/feather -->
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
width="30"
height="30"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-calendar"
>
<rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect>
<line x1="16" y1="2" x2="16" y2="6"></line>
<line x1="8" y1="2" x2="8" y2="6"></line>
<line x1="3" y1="10" x2="21" y2="10"></line>
</svg>
</template>

View File

@ -1,21 +0,0 @@
<!-- From https://github.com/lucide-icons/lucide -->
<template>
<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"
>
<rect x="8" y="2" width="8" height="4" rx="1" ry="1"></rect>
<path d="M8 4H6a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2"></path>
<path d="M16 4h2a2 2 0 0 1 2 2v4"></path>
<path d="M21 14H11"></path>
<path d="m15 10-4 4 4 4"></path>
</svg>
</template>

View File

@ -1,19 +0,0 @@
<!-- From https://github.com/feathericons/feather -->
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
width="30"
height="30"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-clock"
>
<circle cx="12" cy="12" r="10"></circle>
<polyline points="12 6 12 12 16 14"></polyline>
</svg>
</template>

View File

@ -1,19 +0,0 @@
<!-- From https://github.com/feathericons/feather -->
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
width="30"
height="30"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-clock"
>
<circle cx="12" cy="12" r="10"></circle>
<polyline points="12 6 12 12 16 14"></polyline>
</svg>
</template>

View File

@ -1,24 +0,0 @@
<!-- From https://github.com/lucide-icons/lucide -->
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
width="30"
height="30"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M6.87 6.87a8 8 0 1 0 11.26 11.26"></path>
<path
d="M19.9 14.25A7.44 7.44 0 0 0 20 13a8 8 0 0 0-8-8 7.44 7.44 0 0 0-1.25.1"
></path>
<path d="m22 6-3-3"></path>
<path d="m6 19-2 2"></path>
<path d="m2 2 20 20"></path>
<path d="M4 4 2 6"></path>
</svg>
</template>

View File

@ -1,20 +0,0 @@
<!-- From https://github.com/feathericons/feather -->
<template>
<svg
xmlns="http://www.w3.org/2000/svg"
width="26"
height="26"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-menu"
>
<line x1="3" y1="12" x2="21" y2="12"></line>
<line x1="3" y1="6" x2="21" y2="6"></line>
<line x1="3" y1="18" x2="21" y2="18"></line>
</svg>
</template>

View File

@ -3,8 +3,7 @@ import { substitutions } from "../store";
import { getSubstitutionText, getSubstitutionColor } from "../util";
import { computed } from "vue";
import InfoCard from "./info-card.vue";
import BellOffIcon from "./icons/bell-off-icon.vue";
import ClockIconBig from "./icons/clock-icon-big.vue";
import { BellOffIcon, ClockIcon } from "lucide-vue-next";
const props = defineProps({
date: {
@ -20,7 +19,7 @@ const substitutionsForDate = computed(() => {
<template>
<InfoCard
v-show="typeof substitutionsForDate == 'undefined'"
:icon="ClockIconBig"
:icon="ClockIcon"
:title="$t('infoCard.titles.loading')"
:text="$t('infoCard.texts.loading')"
/>

View File

@ -1,5 +1,5 @@
<script setup>
import CalendarIcon from "./icons/calendar-icon.vue";
import { CalendarIcon } from "lucide-vue-next";
defineProps({
options: {

View File

@ -1,5 +1,5 @@
<script setup>
import MenuIcon from "./icons/menu-icon.vue";
import { MenuIcon } from "lucide-vue-next";
import { computed } from "vue";
import { useRoute, useRouter, RouterLink } from "vue-router";
import { lastRoute } from "../store";

View File

@ -1,6 +1,6 @@
<script setup>
import { ref } from "vue";
import clipboardCopyIcon from "../components/icons/clipboard-copy-icon.vue";
import { ClipboardCopyIcon } from "lucide-vue-next";
const password = ref("");
const token = ref("");
@ -49,7 +49,7 @@ function copy() {
ref="token_element"
v-bind:value="token.token"
/>
<clipboardCopyIcon />
<ClipboardCopyIcon />
</div>
</div>
</template>