initial: bootstrap from BukidBountyApp base

2026-06-06 18:43:00 +08:00
commit eb4a5731fb
5674 changed files with 160857 additions and 0 deletions
--- a/resources/js/Components/Core/BackButton.vue
+++ b/resources/js/Components/Core/BackButton.vue
@@ -0,0 +1,124 @@
+<script setup>
+import { useNavigate } from '../../composables/Core/useNavigate'
+
+const props = defineProps({
+  to: {
+    type: [String, Object],
+    default: null
+  },
+  fallback: {
+    type: String,
+    default: 'Home'
+  },
+  text: {
+    type: String,
+    default: 'Back'
+  },
+  className: {
+    type: String,
+    default: ''
+  }
+})
+
+const { navigate } = useNavigate()
+
+const goBack = () => {
+  if (props.to) {
+    if (typeof props.to === 'string') {
+      navigate({ page: props.to })
+    } else {
+      navigate(props.to)
+    }
+  } else if (window.history.length > 1) {
+    window.history.back()
+  } else {
+    navigate({ page: props.fallback })
+  }
+}
+</script>
+
+<template>
+  <button @click="goBack" class="back-button-premium" :class="className" type="button">
+    <div class="icon-container">
+      <i class="fas fa-chevron-left"></i>
+    </div>
+    <span v-if="text" class="back-text">{{ text }}</span>
+  </button>
+</template>
+
+<style scoped>
+.back-button-premium {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  background: var(--bg-card, rgba(255, 255, 255, 0.8));
+  backdrop-filter: blur(10px);
+  -webkit-backdrop-filter: blur(10px);
+  border: 1px solid var(--border-color, rgba(0, 0, 0, 0.05));
+  padding: 6px 14px;
+  border-radius: 50px;
+  color: var(--text-primary, #333);
+  font-weight: 600;
+  font-size: 14px;
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  cursor: pointer;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
+  outline: none;
+}
+
+.back-button-premium:hover {
+  transform: translateX(-3px);
+  background: var(--bg-primary, #fff);
+  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
+  border-color: var(--border-color, rgba(0, 0, 0, 0.1));
+}
+
+.back-button-premium:active {
+  transform: translateX(-1px) scale(0.97);
+}
+
+.icon-container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  background: var(--bg-tertiary, #f8f9fa);
+  color: var(--text-primary, #1a1a1a);
+  border-radius: 50%;
+  font-size: 10px;
+  transition: all 0.3s ease;
+}
+
+.back-button-premium:hover .icon-container {
+  background: var(--text-primary, #1a1a1a);
+  color: var(--bg-primary, #fff);
+}
+
+.back-text {
+  letter-spacing: -0.2px;
+}
+
+/* Dark mode support */
+:global(.dark-mode) .back-button-premium {
+  background: rgba(30, 32, 38, 0.8);
+  border-color: rgba(255, 255, 255, 0.15);
+  color: #fff;
+  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
+}
+
+:global(.dark-mode) .icon-container {
+  background: rgba(255, 255, 255, 0.1);
+  color: #fff;
+}
+
+:global(.dark-mode) .back-button-premium:hover {
+  background: rgba(55, 60, 75, 1);
+  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
+}
+
+:global(.dark-mode) .back-button-premium:hover .icon-container {
+  background: #fff;
+  color: #1a1a1a;
+}
+</style>