From f50ff6be403c19ce44632098104a775f4144ea66 Mon Sep 17 00:00:00 2001
From: Terry Truong <terry06890@gmail.com>
Date: Fri, 7 Oct 2022 14:20:59 +1100
Subject: Add title bar

Add IconButton.vue and components/*Icon.vue files
---
 src/components/IconButton.vue | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)
 create mode 100644 src/components/IconButton.vue

(limited to 'src/components/IconButton.vue')

diff --git a/src/components/IconButton.vue b/src/components/IconButton.vue
new file mode 100644
index 0000000..9357e97
--- /dev/null
+++ b/src/components/IconButton.vue
@@ -0,0 +1,23 @@
+<template>
+<div :style="styles" class="p-2 rounded-full hover:cursor-pointer"
+	:class="{'hover:brightness-125': !disabled, 'brightness-50': disabled}">
+	<slot class="w-full h-full">?</slot>
+</div>
+</template>
+
+<script setup lang="ts">
+import {computed} from 'vue';
+
+const props = defineProps({
+	size: {type: Number, default: 36},
+	disabled: {type: Boolean, default: false},
+});
+
+const styles = computed(() => ({
+	minWidth: props.size + 'px',
+	maxWidth: props.size + 'px',
+	minHeight: props.size + 'px',
+	maxHeight: props.size + 'px',
+	padding: (props.size / 5) + 'px',
+}));
+</script>
-- 
cgit v1.2.3