App.vue 804 B

123456789101112131415161718192021222324252627282930313233343536373839
  1. <script setup lang="ts">
  2. import { motion } from "motion-v";
  3. </script>
  4. <template>
  5. <motion.div
  6. class="overflow-x-hidden font-sans"
  7. :key="$route.fullPath"
  8. :initial="{ opacity: 0 }"
  9. :animate="{ opacity: 1, transition: { duration: 0.5, ease: 'easeOut' } }"
  10. >
  11. <router-view></router-view>
  12. </motion.div>
  13. </template>
  14. <style scoped>
  15. /* 修改垂直滚动条 */
  16. ::-webkit-scrollbar {
  17. width: 5px; /* 修改宽度 */
  18. }
  19. ::-webkit-scrollbar-thumb {
  20. border-radius: 5px;
  21. }
  22. /* 修改滚动条轨道背景色 */
  23. ::-webkit-scrollbar-track {
  24. background-color: transparent;
  25. }
  26. /* 修改滚动条滑块颜色 */
  27. ::-webkit-scrollbar-thumb {
  28. background-color: #0a5f73;
  29. }
  30. /* 修改滚动条滑块悬停时的颜色 */
  31. ::-webkit-scrollbar-thumb:hover {
  32. background-color: #30459c;
  33. }
  34. </style>