feat: add ripple effect, update theme styles and layout

2026-02-26 22:57:03 +00:00
parent bdbb561740
commit 12a4130c38
13 changed files with 1028 additions and 12 deletions
--- a/src/components/Footer.vue
+++ b/src/components/Footer.vue
@@ -0,0 +1,38 @@
+<script setup>
+const currentYear = new Date().getFullYear();
+const version = __APP_VERSION__;
+</script>
+
+<template>
+  <footer class="app-footer unselectable">
+    <div class="footer-content">
+      <p>&copy; {{ currentYear }} Tools App. v{{ version }}</p>
+    </div>
+  </footer>
+</template>
+
+<style scoped>
+.app-footer {
+  width: 100%;
+  padding: 1rem;
+  background-color: #242424;
+  border-top: 1px solid rgba(255, 255, 255, 0.1);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: auto; /* Push to bottom in flex container */
+}
+
+.footer-content {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+
+p {
+  font-size: 0.9rem;
+  color: rgba(255, 255, 255, 0.6);
+  margin: 0;
+  font-family: monospace;
+}
+</style>