ijit

.vitepress/theme/Show.vue

@@ -0,0 +1,48 @@
+<template>
+  <div >
+    <button class="show-btn" @click="show = !show">
+      {{ show ? '隐藏关键字' : '显示关键字' }}
+    </button>
+    <div v-if="show" class="show-content">{{ text }}</div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+const props = defineProps({
+  text: {
+    type: String,
+    required: true
+  }
+})
+const show = ref(false)
+</script>
+
+<style scoped>
+.show-btn {
+  padding: 8px 20px;
+  margin-top: 10px;
+  margin-bottom: -10px;
+  background: linear-gradient(90deg, #4f8cff 0%, #38c8ff 100%);
+  color: #fff;
+  border: none;
+  border-radius: 6px;
+  font-size: 16px;
+  cursor: pointer;
+  box-shadow: 0 2px 8px rgba(79,140,255,0.15);
+  transition: background 0.3s, box-shadow 0.3s;
+}
+.show-btn:hover {
+  background: linear-gradient(90deg, #38c8ff 0%, #4f8cff 100%);
+  box-shadow: 0 4px 16px rgba(56,200,255,0.18);
+}
+.show-content {
+  margin-top: 16px;
+  padding: 12px 18px;
+  background: #f6faff;
+  border-radius: 6px;
+  color: #333;
+  font-size: 15px;
+  box-shadow: 0 1px 4px rgba(79,140,255,0.08);
+}
+</style>