initial: bootstrap from BukidBountyApp base

resources/js/Components/Core/Services/SideTextButton.vue

@@ -0,0 +1,60 @@
+<template>
+  <li @click="$emit('click', $event)" class="side-text-button">
+    <div class="icon-wrapper-seamless">
+      <IconImage
+        v-if="icon"
+        :src="icon"
+        :width="iconWidth"
+        :height="iconHeight"
+        class="seamless-icon"
+      />
+    </div>
+    <div class="text-label" style="color: var(--text-primary);">
+      {{ text }}
+    </div>
+  </li>
+</template>
+
+<script setup>
+import IconImage from '../IconImage.vue'
+
+defineProps({
+  text:       { type: String, required: true },
+  icon:       { type: String, default: '' },
+  iconWidth:  { type: [String, Number], default: 30 },
+  iconHeight: { type: [String, Number], default: 30 },
+})
+
+defineEmits(['click'])
+</script>
+
+<style scoped>
+.side-text-button {
+    background: transparent !important;
+    border: none !important;
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    padding: 10px 16px;
+    transition: all 0.2s ease;
+    cursor: pointer;
+}
+
+.side-text-button:hover {
+    background: var(--bg-tertiary) !important;
+}
+
+.icon-wrapper-seamless {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.seamless-icon {
+    filter: brightness(1.1) contrast(1.1);
+}
+
+.text-label {
+    font-weight: 500;
+}
+</style>