body-start.blade.php 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. <!-- 自定义页面启动脚本 -->
  2. <script>
  3. document.addEventListener('DOMContentLoaded', function() {
  4. const densityKey = 'filament_density';
  5. const savedDensity = localStorage.getItem(densityKey) || 'comfortable';
  6. document.body.dataset.density = savedDensity;
  7. window.setTableDensity = function(nextDensity) {
  8. const density = nextDensity === 'compact' ? 'compact' : 'comfortable';
  9. document.body.dataset.density = density;
  10. localStorage.setItem(densityKey, density);
  11. };
  12. // 添加淡入动画
  13. const elements = document.querySelectorAll('.fi-main, .fi-topbar, .fi-sidebar');
  14. elements.forEach((el, index) => {
  15. el.style.opacity = '0';
  16. el.style.transform = 'translateY(20px)';
  17. setTimeout(() => {
  18. el.style.transition = 'all 0.5s ease-in-out';
  19. el.style.opacity = '1';
  20. el.style.transform = 'translateY(0)';
  21. }, index * 100);
  22. });
  23. // 自定义滚动条
  24. const style = document.createElement('style');
  25. style.textContent = `
  26. .fi-main::-webkit-scrollbar {
  27. width: 8px;
  28. height: 8px;
  29. }
  30. .fi-main::-webkit-scrollbar-track {
  31. background: #f1f5f9;
  32. border-radius: 4px;
  33. }
  34. .fi-main::-webkit-scrollbar-thumb {
  35. background: #cbd5e1;
  36. border-radius: 4px;
  37. transition: background 0.2s ease;
  38. }
  39. .fi-main::-webkit-scrollbar-thumb:hover {
  40. background: #94a3b8;
  41. }
  42. `;
  43. document.head.appendChild(style);
  44. });
  45. </script>