summaryrefslogtreecommitdiffstatshomepage
path: root/frontend/src/lib/icons
diff options
context:
space:
mode:
authorWolfgang Müller2024-03-05 18:08:09 +0100
committerWolfgang Müller2024-03-05 19:25:59 +0100
commitd1d654ebac2d51e3841675faeb56480e440f622f (patch)
tree56ef123c1a15a10dfd90836e4038e27efde950c6 /frontend/src/lib/icons
downloadhircine-0.1.0.tar.gz
Initial commit0.1.0
Diffstat (limited to '')
-rw-r--r--frontend/src/lib/icons/Bookmark.svelte10
-rw-r--r--frontend/src/lib/icons/Female.svelte1
-rw-r--r--frontend/src/lib/icons/Location.svelte1
-rw-r--r--frontend/src/lib/icons/Male.svelte1
-rw-r--r--frontend/src/lib/icons/Organized.svelte21
-rw-r--r--frontend/src/lib/icons/Star.svelte25
-rw-r--r--frontend/src/lib/icons/Transgender.svelte1
7 files changed, 60 insertions, 0 deletions
diff --git a/frontend/src/lib/icons/Bookmark.svelte b/frontend/src/lib/icons/Bookmark.svelte
new file mode 100644
index 0000000..6f8e192
--- /dev/null
+++ b/frontend/src/lib/icons/Bookmark.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+ export let bookmarked: boolean | undefined = undefined;
+ export let hoverable = false;
+</script>
+
+{#if bookmarked}
+ <span class:hoverable class="icon-gray icon-base icon-[material-symbols--bookmark]" />
+{:else}
+ <span class:hoverable class="icon-gray icon-base dim icon-[material-symbols--bookmark-outline]" />
+{/if}
diff --git a/frontend/src/lib/icons/Female.svelte b/frontend/src/lib/icons/Female.svelte
new file mode 100644
index 0000000..c772a6a
--- /dev/null
+++ b/frontend/src/lib/icons/Female.svelte
@@ -0,0 +1 @@
+<span class="icon-xs icon-[material-symbols--female] -mx-[3px]" />
diff --git a/frontend/src/lib/icons/Location.svelte b/frontend/src/lib/icons/Location.svelte
new file mode 100644
index 0000000..e345f83
--- /dev/null
+++ b/frontend/src/lib/icons/Location.svelte
@@ -0,0 +1 @@
+<span class="icon-xs icon-[material-symbols--location-on-outline]" />
diff --git a/frontend/src/lib/icons/Male.svelte b/frontend/src/lib/icons/Male.svelte
new file mode 100644
index 0000000..e3578b7
--- /dev/null
+++ b/frontend/src/lib/icons/Male.svelte
@@ -0,0 +1 @@
+<span class="icon-xs icon-[material-symbols--male] -mx-px" />
diff --git a/frontend/src/lib/icons/Organized.svelte b/frontend/src/lib/icons/Organized.svelte
new file mode 100644
index 0000000..66b5b00
--- /dev/null
+++ b/frontend/src/lib/icons/Organized.svelte
@@ -0,0 +1,21 @@
+<script lang="ts">
+ export let organized: boolean | undefined = undefined;
+ export let hoverable = false;
+ export let tristate = false;
+ export let dim = false;
+</script>
+
+{#if organized}
+ <span class:hoverable class="icon-gray icon-base icon-[material-symbols--check-circle]" />
+{:else if organized === undefined || !tristate}
+ <span
+ class:hoverable
+ class="icon-gray dim icon-base icon-[material-symbols--check-circle-outline]"
+ />
+{:else}
+ <span
+ class:hoverable
+ class:dim
+ class="icon-gray icon-base icon-[material-symbols--unpublished]"
+ />
+{/if}
diff --git a/frontend/src/lib/icons/Star.svelte b/frontend/src/lib/icons/Star.svelte
new file mode 100644
index 0000000..7613c55
--- /dev/null
+++ b/frontend/src/lib/icons/Star.svelte
@@ -0,0 +1,25 @@
+<script lang="ts">
+ export let large = false;
+ export let favourite: boolean | undefined = undefined;
+ export let hoverable = false;
+</script>
+
+{#if favourite}
+ <span class:hoverable class:large class="icon-yellow icon-[material-symbols--star-rounded]" />
+{:else}
+ <span
+ class:hoverable
+ class:large
+ class="icon-yellow dim icon-[material-symbols--star-outline-rounded]"
+ />
+{/if}
+
+<style lang="postcss">
+ span {
+ @apply -m-px -translate-y-px text-[26px];
+ }
+
+ span.large {
+ @apply text-[34px];
+ }
+</style>
diff --git a/frontend/src/lib/icons/Transgender.svelte b/frontend/src/lib/icons/Transgender.svelte
new file mode 100644
index 0000000..7d9adc6
--- /dev/null
+++ b/frontend/src/lib/icons/Transgender.svelte
@@ -0,0 +1 @@
+<span class="icon-xs icon-[material-symbols--transgender]" />