From da319c28d5203aec6cb57d45e9736290e3a352bc Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Sat, 23 May 2026 14:39:38 +0200 Subject: [PATCH 01/13] Add chevron down icon --- src/assets/icons/chevron-down.svg | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) create mode 100644 src/assets/icons/chevron-down.svg diff --git a/src/assets/icons/chevron-down.svg b/src/assets/icons/chevron-down.svg new file mode 100644 index 0000000..29beb9d --- /dev/null +++ b/src/assets/icons/chevron-down.svg @@ -0,0 +1,26 @@ + + + + + \ No newline at end of file From fc4584f932195a3d149f3d30bb7747db2b4acf09 Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Sat, 23 May 2026 15:53:36 +0200 Subject: [PATCH 02/13] Add crescent moon icon --- src/assets/icons/crescent-moon.svg | 36 ++++++++++++++++++++++++++++++ 1 file changed, 36 insertions(+) create mode 100644 src/assets/icons/crescent-moon.svg diff --git a/src/assets/icons/crescent-moon.svg b/src/assets/icons/crescent-moon.svg new file mode 100644 index 0000000..e2fb3b1 --- /dev/null +++ b/src/assets/icons/crescent-moon.svg @@ -0,0 +1,36 @@ + + + + + \ No newline at end of file From c5467620c57c677b9ce13999edd5b0751785d248 Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Sat, 23 May 2026 16:01:15 +0200 Subject: [PATCH 03/13] Add sun icon --- src/assets/icons/sun.svg | 45 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 45 insertions(+) create mode 100644 src/assets/icons/sun.svg diff --git a/src/assets/icons/sun.svg b/src/assets/icons/sun.svg new file mode 100644 index 0000000..8ee19b7 --- /dev/null +++ b/src/assets/icons/sun.svg @@ -0,0 +1,45 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file From b617078e58ae505402fb0cd5ca1aa85797e7e443 Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Sat, 23 May 2026 16:07:11 +0200 Subject: [PATCH 04/13] Add black and white circle icon --- src/assets/icons/circle-black-white.svg | 38 +++++++++++++++++++++++++ 1 file changed, 38 insertions(+) create mode 100644 src/assets/icons/circle-black-white.svg diff --git a/src/assets/icons/circle-black-white.svg b/src/assets/icons/circle-black-white.svg new file mode 100644 index 0000000..9cff73c --- /dev/null +++ b/src/assets/icons/circle-black-white.svg @@ -0,0 +1,38 @@ + + + + + + \ No newline at end of file From f24749423b32d9f46a24bd78a34ab5c475d8284c Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Sat, 23 May 2026 16:12:23 +0200 Subject: [PATCH 05/13] Add icon component --- src/features/icons/components/Icon.vue | 37 ++++++++++++++++++++++++++ 1 file changed, 37 insertions(+) create mode 100644 src/features/icons/components/Icon.vue diff --git a/src/features/icons/components/Icon.vue b/src/features/icons/components/Icon.vue new file mode 100644 index 0000000..10d5d74 --- /dev/null +++ b/src/features/icons/components/Icon.vue @@ -0,0 +1,37 @@ + + + + + \ No newline at end of file From bf3786249bd4bbfb448d56fb3ba72fbbcffcd699 Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Sat, 23 May 2026 16:13:40 +0200 Subject: [PATCH 06/13] Add icon component prop to specify the size of the icon --- src/features/icons/components/Icon.vue | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/features/icons/components/Icon.vue b/src/features/icons/components/Icon.vue index 10d5d74..6429dfc 100644 --- a/src/features/icons/components/Icon.vue +++ b/src/features/icons/components/Icon.vue @@ -21,6 +21,10 @@ const props = defineProps({ name: { required: true, type: String + }, + size: { + type: [Number, String], + default: 24 } }) @@ -33,5 +37,5 @@ const Icon = computed(() => icons[`/src/assets/icons/${props.name}.svg`]) \ No newline at end of file From 1679800272e83b5bbccaeca73947903db6c02955 Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Sat, 23 May 2026 16:28:25 +0200 Subject: [PATCH 07/13] Add utility function to ensure that a CSS dimension has a unit --- src/utils/cssDimensions.js | 31 +++++++++++++++++++++++++++++++ 1 file changed, 31 insertions(+) create mode 100644 src/utils/cssDimensions.js diff --git a/src/utils/cssDimensions.js b/src/utils/cssDimensions.js new file mode 100644 index 0000000..ec1521d --- /dev/null +++ b/src/utils/cssDimensions.js @@ -0,0 +1,31 @@ +/* +Copyright 2026 Seekra + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +export const ensureUnit = function (d) { + if (!d) d = 0; + + // ensure that it is a string + if (typeof d === 'number') d = d.toString(); + + if (d === '') d = '0'; + + // if it ends with a number + if (/\d$/.test(d)) { + d += 'px'; + }; + + return d; +}; \ No newline at end of file From 534734ce9a9ec927a0696c6c04eca833fa9c509a Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Sat, 23 May 2026 16:30:43 +0200 Subject: [PATCH 08/13] Ensure unit of the size prop in the icon component --- src/features/icons/components/Icon.vue | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/features/icons/components/Icon.vue b/src/features/icons/components/Icon.vue index 6429dfc..2083414 100644 --- a/src/features/icons/components/Icon.vue +++ b/src/features/icons/components/Icon.vue @@ -16,6 +16,7 @@ limitations under the License. \ No newline at end of file From 20e350d88ba8bf25a3e567278f6af0d49812ddd5 Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Sat, 23 May 2026 16:34:57 +0200 Subject: [PATCH 09/13] Add icon component flexbox wrapper --- src/features/icons/components/Icon.vue | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/src/features/icons/components/Icon.vue b/src/features/icons/components/Icon.vue index 2083414..fbbfd04 100644 --- a/src/features/icons/components/Icon.vue +++ b/src/features/icons/components/Icon.vue @@ -40,5 +40,14 @@ const size = computed(() => ensureUnit(props.size)) \ No newline at end of file +
+ +
+ + + \ No newline at end of file From 35db1d65f26a4a30510626364989de8963f16c78 Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Sun, 31 May 2026 23:18:14 +0200 Subject: [PATCH 10/13] Add --invert CSS variable for the invertion (according to the color scheme) --- src/styles/variables/colors.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/styles/variables/colors.css b/src/styles/variables/colors.css index e79a738..cc2b21f 100644 --- a/src/styles/variables/colors.css +++ b/src/styles/variables/colors.css @@ -82,6 +82,8 @@ limitations under the License. --blue-box-shadow: oklch(0.52 0.15 268 / 0.25); --light-hover: var(--light-d-2); + + --invert: invert(0); } @media (prefers-color-scheme: dark) { @@ -114,6 +116,8 @@ limitations under the License. --gray-box-shadow: oklch(0.25 0.0001 271 / 0.7); --light-hover: var(--light-d-5); + + --invert: invert(1); } } @@ -146,4 +150,6 @@ limitations under the License. --gray-box-shadow: oklch(0.25 0.0001 271 / 0.7); --light-hover: var(--light-d-5); + + --invert: invert(1); } \ No newline at end of file From 274d25d6543568cec4738f139dc171aa160b6a19 Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Sun, 31 May 2026 23:19:06 +0200 Subject: [PATCH 11/13] feat(icons): Invert icons according to the color scheme --- src/features/icons/components/Icon.vue | 1 + 1 file changed, 1 insertion(+) diff --git a/src/features/icons/components/Icon.vue b/src/features/icons/components/Icon.vue index fbbfd04..b70953e 100644 --- a/src/features/icons/components/Icon.vue +++ b/src/features/icons/components/Icon.vue @@ -49,5 +49,6 @@ const size = computed(() => ensureUnit(props.size)) .icon-container { display: flex; align-items: center; + filter: var(--invert); } \ No newline at end of file From 54090751a547cab6a09f7ba512feb6fb1058c978 Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Sun, 31 May 2026 23:21:22 +0200 Subject: [PATCH 12/13] feat(icons): use icons at the color scheme button --- .../colorScheme/components/ColorSchemeButton.vue | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/src/features/colorScheme/components/ColorSchemeButton.vue b/src/features/colorScheme/components/ColorSchemeButton.vue index 7f4e47e..4f4c228 100644 --- a/src/features/colorScheme/components/ColorSchemeButton.vue +++ b/src/features/colorScheme/components/ColorSchemeButton.vue @@ -15,6 +15,8 @@ limitations under the License. -->