From 1ad6fc5e3a0f917679f133c50a264dd1d92067dc Mon Sep 17 00:00:00 2001
From: minie4 <minie4@gmx.de>
Date: Sun, 4 Jun 2023 00:08:30 +0200
Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Move=20from=20.vue=20files?=
 =?UTF-8?q?=20to=20Lucide=20for=20icons?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package-lock.json                            | 10 ++++++++
 package.json                                 |  1 +
 src/components/bottom-navbar.vue             | 10 ++++----
 src/components/date-selector.vue             |  6 ++---
 src/components/history-list.vue              |  7 +++---
 src/components/icons/arrow-icon.vue          | 19 ----------------
 src/components/icons/bell-icon.vue           | 19 ----------------
 src/components/icons/bell-off-icon.vue       | 22 ------------------
 src/components/icons/calendar-icon.vue       | 21 -----------------
 src/components/icons/clipboard-copy-icon.vue | 21 -----------------
 src/components/icons/clock-icon-big.vue      | 19 ----------------
 src/components/icons/clock-icon.vue          | 19 ----------------
 src/components/icons/clock-off-icon.vue      | 24 --------------------
 src/components/icons/menu-icon.vue           | 20 ----------------
 src/components/substitution-list.vue         |  5 ++--
 src/components/timetable-setup.vue           |  2 +-
 src/components/titlebar-element.vue          |  2 +-
 src/views/TokenView.vue                      |  4 ++--
 18 files changed, 27 insertions(+), 204 deletions(-)
 delete mode 100644 src/components/icons/arrow-icon.vue
 delete mode 100644 src/components/icons/bell-icon.vue
 delete mode 100644 src/components/icons/bell-off-icon.vue
 delete mode 100644 src/components/icons/calendar-icon.vue
 delete mode 100644 src/components/icons/clipboard-copy-icon.vue
 delete mode 100644 src/components/icons/clock-icon-big.vue
 delete mode 100644 src/components/icons/clock-icon.vue
 delete mode 100644 src/components/icons/clock-off-icon.vue
 delete mode 100644 src/components/icons/menu-icon.vue

diff --git a/package-lock.json b/package-lock.json
index 52ada89..b406c30 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -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",
diff --git a/package.json b/package.json
index 9244e0b..e2b54ff 100644
--- a/package.json
+++ b/package.json
@@ -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",
diff --git a/src/components/bottom-navbar.vue b/src/components/bottom-navbar.vue
index d907541..446d0ee 100644
--- a/src/components/bottom-navbar.vue
+++ b/src/components/bottom-navbar.vue
@@ -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>
diff --git a/src/components/date-selector.vue b/src/components/date-selector.vue
index 02608b0..bc7d515 100644
--- a/src/components/date-selector.vue
+++ b/src/components/date-selector.vue
@@ -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>
 
diff --git a/src/components/history-list.vue b/src/components/history-list.vue
index d9e44ba..760254c 100644
--- a/src/components/history-list.vue
+++ b/src/components/history-list.vue
@@ -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')"
   />
diff --git a/src/components/icons/arrow-icon.vue b/src/components/icons/arrow-icon.vue
deleted file mode 100644
index 66aea0f..0000000
--- a/src/components/icons/arrow-icon.vue
+++ /dev/null
@@ -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>
diff --git a/src/components/icons/bell-icon.vue b/src/components/icons/bell-icon.vue
deleted file mode 100644
index 755294f..0000000
--- a/src/components/icons/bell-icon.vue
+++ /dev/null
@@ -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>
diff --git a/src/components/icons/bell-off-icon.vue b/src/components/icons/bell-off-icon.vue
deleted file mode 100644
index 0c4ec8c..0000000
--- a/src/components/icons/bell-off-icon.vue
+++ /dev/null
@@ -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>
diff --git a/src/components/icons/calendar-icon.vue b/src/components/icons/calendar-icon.vue
deleted file mode 100644
index 5d2d47a..0000000
--- a/src/components/icons/calendar-icon.vue
+++ /dev/null
@@ -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>
diff --git a/src/components/icons/clipboard-copy-icon.vue b/src/components/icons/clipboard-copy-icon.vue
deleted file mode 100644
index 1c52c13..0000000
--- a/src/components/icons/clipboard-copy-icon.vue
+++ /dev/null
@@ -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>
diff --git a/src/components/icons/clock-icon-big.vue b/src/components/icons/clock-icon-big.vue
deleted file mode 100644
index 0074cc7..0000000
--- a/src/components/icons/clock-icon-big.vue
+++ /dev/null
@@ -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>
diff --git a/src/components/icons/clock-icon.vue b/src/components/icons/clock-icon.vue
deleted file mode 100644
index 43b6d68..0000000
--- a/src/components/icons/clock-icon.vue
+++ /dev/null
@@ -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>
diff --git a/src/components/icons/clock-off-icon.vue b/src/components/icons/clock-off-icon.vue
deleted file mode 100644
index 0ad30b8..0000000
--- a/src/components/icons/clock-off-icon.vue
+++ /dev/null
@@ -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>
diff --git a/src/components/icons/menu-icon.vue b/src/components/icons/menu-icon.vue
deleted file mode 100644
index 67524ed..0000000
--- a/src/components/icons/menu-icon.vue
+++ /dev/null
@@ -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>
diff --git a/src/components/substitution-list.vue b/src/components/substitution-list.vue
index d2d4260..1824a1d 100644
--- a/src/components/substitution-list.vue
+++ b/src/components/substitution-list.vue
@@ -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')"
   />
diff --git a/src/components/timetable-setup.vue b/src/components/timetable-setup.vue
index 4e47e63..22997d4 100644
--- a/src/components/timetable-setup.vue
+++ b/src/components/timetable-setup.vue
@@ -1,5 +1,5 @@
 <script setup>
-import CalendarIcon from "./icons/calendar-icon.vue";
+import { CalendarIcon } from "lucide-vue-next";
 
 defineProps({
   options: {
diff --git a/src/components/titlebar-element.vue b/src/components/titlebar-element.vue
index 1b704b8..0b6db43 100644
--- a/src/components/titlebar-element.vue
+++ b/src/components/titlebar-element.vue
@@ -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";
diff --git a/src/views/TokenView.vue b/src/views/TokenView.vue
index 9a30a24..069d30c 100644
--- a/src/views/TokenView.vue
+++ b/src/views/TokenView.vue
@@ -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>