Initial WordPress theme

assets/css/main.css

@@ -0,0 +1,24 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+*{box-sizing:border-box;margin:0;padding:0}
+html{scroll-behavior:smooth}
+body{font-family:"SF Pro Display","SF Pro Text","Inter","Noto Sans SC",system-ui,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#fff;color:#1D1D1F;line-height:1.5}
+button,a,[role="button"]{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
+::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#d1d1d6;border-radius:4px}
+.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
+.prose{max-width:none}.prose h2{font-size:1.25rem;margin-top:2rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid #f3f4f6}.prose h3{font-size:1.125rem;margin-top:1.5rem;margin-bottom:.75rem}.prose p{color:#4b5563;line-height:1.75;margin-bottom:1rem}.prose img{border-radius:.75rem;box-shadow:0 1px 2px rgba(0,0,0,.04)}
+.gongxue-header.scrolled{background:rgba(255,255,255,.8);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 1px 3px rgba(0,0,0,.05)}
+.gongxue-header,.gongxue-header *{-webkit-tap-highlight-color:transparent}
+.gongxue-header,.gongxue-header:focus,.gongxue-header:focus-visible,.gongxue-header:focus-within{outline:0!important}
+.gongxue-header a,.gongxue-header button{outline:none!important;box-shadow:none!important}
+.gongxue-header a:focus,.gongxue-header a:focus-visible,.gongxue-header a:active,.gongxue-header button:focus,.gongxue-header button:focus-visible,.gongxue-header button:active{outline:0!important;box-shadow:none!important}
+.mobile-menu.active{display:block;animation:fadeIn .3s ease-out forwards}
+.gx-phone{position:relative;margin:0 auto;width:100%;max-width:280px;z-index:10;transition:transform .3s;aspect-ratio:1290/2796}.gx-phone:hover{transform:scale(1.02)}
+.gx-phone-frame{position:relative;width:100%;height:100%;background:#000;border-radius:16%/7.38%;box-shadow:0 0 0 1px #444,0 0 0 3px #d1d1d1,0 0 0 4px #999,0 20px 50px -10px rgba(0,0,0,.3);padding:3px;overflow:hidden}
+.gx-phone-screen{position:relative;width:100%;height:100%;background:#111;border-radius:calc(16% - 1%)/calc(7.38% - .5%);box-shadow:inset 0 0 20px rgba(255,255,255,.08);overflow:hidden}
+.gx-phone-screen img{width:100%;height:100%;object-fit:cover;object-position:top;position:relative;z-index:10}.gx-phone-island{position:absolute;top:3.5%;left:50%;transform:translateX(-50%);width:30%;height:3.5%;background:#000;border-radius:20px;z-index:50}.gx-phone-home{position:absolute;bottom:2%;left:50%;transform:translateX(-50%);width:35%;height:.5%;background:rgba(255,255,255,.8);border-radius:999px;z-index:20}
+.gx-book{position:relative}.gx-book::before{content:"";position:absolute;inset:-10%;background:linear-gradient(135deg,rgba(255,237,213,.5),rgba(219,234,254,.45));filter:blur(45px);border-radius:999px}.gx-book img{position:relative;z-index:1;width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 20px 30px rgba(0,0,0,.15));transition:transform .5s}.gx-book-card-image img{transform:scale(.9)}.group:hover .gx-book img{transform:scale(1.05) translateY(-6px)}.group:hover .gx-book-card-image img{transform:scale(.95) translateY(-4px)}
+.gx-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:1rem}.gx-modal.active{display:flex}.gx-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(6px)}.gx-modal-panel{position:relative;background:#fff;border-radius:1.5rem;box-shadow:0 25px 80px rgba(0,0,0,.25);width:100%;max-width:28rem;animation:slideUp .25s ease-out}
+.floating-service{position:fixed;right:1.5rem;bottom:1.5rem;z-index:50;display:flex;flex-direction:column;align-items:flex-end}.service-menu{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1rem;transition:all .3s;transform-origin:bottom right}.service-menu.closed{opacity:0;transform:scale(.9) translateY(10px);pointer-events:none}.service-item{display:flex;align-items:center;gap:.75rem;background:rgba(255,255,255,.9);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.3);padding:.75rem 1rem;border-radius:1rem;box-shadow:0 10px 25px rgba(0,0,0,.1);transition:all .2s}.service-item:hover{background:#fff;transform:scale(1.05)}
+@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

assets/js/main.js

@@ -0,0 +1,153 @@
+(function() {
+  'use strict';
+
+  function initHeader() {
+    var header = document.querySelector('.gongxue-header');
+    if (!header) return;
+    var update = function() { header.classList.toggle('scrolled', window.scrollY > 20); };
+    window.addEventListener('scroll', update, { passive: true });
+    update();
+  }
+
+  function initHeaderFocusGuard() {
+    var header = document.querySelector('.gongxue-header');
+    if (!header) return;
+
+    var clearFocus = function(target) {
+      if (target && typeof target.blur === 'function') {
+        requestAnimationFrame(function() { target.blur(); });
+      }
+    };
+
+    header.addEventListener('pointerdown', function(e) {
+      clearFocus(e.target.closest('a,button'));
+    });
+    header.addEventListener('click', function(e) {
+      clearFocus(e.target.closest('a,button'));
+    });
+    window.addEventListener('pageshow', function() {
+      if (header.contains(document.activeElement)) {
+        clearFocus(document.activeElement);
+      }
+    });
+  }
+
+  function initMobileMenu() {
+    var toggle = document.querySelector('.mobile-menu-toggle');
+    var menu = document.querySelector('.mobile-menu');
+    if (!toggle || !menu) return;
+    toggle.addEventListener('click', function() {
+      var open = menu.classList.contains('active');
+      menu.classList.toggle('active');
+      menu.classList.toggle('hidden');
+      document.body.style.overflow = open ? '' : 'hidden';
+    });
+    menu.querySelectorAll('a').forEach(function(link) {
+      link.addEventListener('click', function() {
+        menu.classList.remove('active');
+        menu.classList.add('hidden');
+        document.body.style.overflow = '';
+      });
+    });
+  }
+
+  function initHeroVideo() {
+    document.querySelectorAll('[data-gx-video]').forEach(function(box) {
+      var video = box.querySelector('video');
+      var play = box.querySelector('[data-gx-play]');
+      var cover = box.querySelector('[data-gx-cover]');
+      if (!video || !play) return;
+      play.addEventListener('click', function() {
+        if (!video.src && video.dataset.src) video.src = video.dataset.src;
+        video.controls = true;
+        video.play();
+        video.classList.remove('opacity-0');
+        video.classList.add('opacity-100');
+        if (cover) cover.classList.add('hidden');
+        play.classList.add('hidden');
+      });
+    });
+  }
+
+  function initModals() {
+    document.querySelectorAll('[data-gx-modal-open]').forEach(function(button) {
+      button.addEventListener('click', function() {
+        var modal = document.querySelector(button.dataset.gxModalOpen);
+        if (modal) modal.classList.add('active');
+      });
+    });
+    document.querySelectorAll('[data-gx-modal-close], .gx-modal-backdrop').forEach(function(button) {
+      button.addEventListener('click', function() {
+        var modal = button.closest('.gx-modal');
+        if (modal) modal.classList.remove('active');
+      });
+    });
+  }
+
+  function initFloatingService() {
+    var toggle = document.querySelector('.service-toggle');
+    var menu = document.querySelector('.service-menu');
+    if (!toggle || !menu) return;
+    toggle.addEventListener('click', function() {
+      menu.classList.toggle('closed');
+      toggle.classList.toggle('rotate-90');
+    });
+    document.addEventListener('click', function(e) {
+      var service = document.querySelector('.floating-service');
+      if (service && !service.contains(e.target)) {
+        menu.classList.add('closed');
+        toggle.classList.remove('rotate-90');
+      }
+    });
+  }
+
+  function initShare() {
+    document.querySelectorAll('.gx-share').forEach(function(button) {
+      button.addEventListener('click', function() {
+        var url = button.dataset.url || location.href;
+        var title = button.dataset.title || document.title;
+        if (navigator.share) {
+          navigator.share({ title: title, url: url }).catch(function() {});
+        } else if (navigator.clipboard) {
+          navigator.clipboard.writeText(url);
+          button.textContent = '链接已复制';
+          setTimeout(function() { button.textContent = '分享文章'; }, 1400);
+        }
+      });
+    });
+  }
+
+  function initCounters() {
+    var nodes = document.querySelectorAll('[data-count-end]');
+    if (!nodes.length || !('IntersectionObserver' in window)) return;
+    var observer = new IntersectionObserver(function(entries) {
+      entries.forEach(function(entry) {
+        if (!entry.isIntersecting || entry.target.dataset.done) return;
+        entry.target.dataset.done = '1';
+        var el = entry.target;
+        var end = parseFloat(el.dataset.countEnd) || 0;
+        var suffix = el.dataset.countSuffix || '';
+        var start = performance.now();
+        function frame(now) {
+          var t = Math.min((now - start) / 1800, 1);
+          var value = end * (1 - Math.pow(1 - t, 4));
+          el.textContent = Math.round(value) + suffix;
+          if (t < 1) requestAnimationFrame(frame);
+        }
+        requestAnimationFrame(frame);
+      });
+    }, { threshold: 0.4 });
+    nodes.forEach(function(node) { observer.observe(node); });
+  }
+
+  document.addEventListener('DOMContentLoaded', function() {
+    initHeader();
+    initHeaderFocusGuard();
+    initMobileMenu();
+    initHeroVideo();
+    initModals();
+    initFloatingService();
+    initShare();
+    initCounters();
+  });
+})();