feat: hover/tap 显示中文翻译 (quote-translate)

docs/css/quote-translate.css

@@ -0,0 +1,11 @@
+blockquote[data-cn] { cursor: pointer; position: relative; }
+.quote-cn {
+  display: none;
+  margin-top: 0.5em;
+  color: var(--md-default-fg-color--light);
+  font-size: 0.85em;
+  font-style: normal;
+  border-left: 2px solid var(--md-accent-fg-color);
+  padding-left: 0.8em;
+}
+.quote-cn.show { display: block; }

docs/js/quote-translate.js

@@ -0,0 +1,13 @@
+document.addEventListener('DOMContentLoaded', function () {
+  document.querySelectorAll('blockquote[data-cn]').forEach(function (el) {
+    const cn = el.getAttribute('data-cn');
+    const tip = document.createElement('div');
+    tip.className = 'quote-cn';
+    tip.textContent = cn;
+    el.appendChild(tip);
+
+    el.addEventListener('mouseenter', () => tip.classList.add('show'));
+    el.addEventListener('mouseleave', () => tip.classList.remove('show'));
+    el.addEventListener('click', () => tip.classList.toggle('show'));
+  });
+});

docs/shared/new-saas-revolution.md

@@ -13,47 +13,51 @@ echo "of the human, by the human, for the human" | sed 's/human/AI/g'
 
 ---
 
-> Umwertung aller Werte.
->
-> （重估一切价值。）
->
-> — 尼采
+<blockquote data-cn="重估一切价值。">
+Umwertung aller Werte.
+
+— 尼采
+</blockquote>
 
 ---
 
-> Die Proletarier haben nichts in ihr zu verlieren als ihre Ketten. Sie haben eine Welt zu gewinnen.
->
-> （无产者在这个革命中失去的只是锁链，他们获得的将是整个世界。）
->
-> — 马克思
+<blockquote data-cn="无产者在这个革命中失去的只是锁链，他们获得的将是整个世界。">
+Die Proletarier haben nichts in ihr zu verlieren als ihre Ketten. Sie haben eine Welt zu gewinnen.
+
+— 马克思
+</blockquote>
 
 ---
 
-> 枪杆子里面出政权。
->
-> — 毛泽东
+<blockquote>
+枪杆子里面出政权。
+
+— 毛泽东
+</blockquote>
 
 ---
 
-> I have a dream, today.
->
-> （我有一个梦想，就是今天。）
->
-> — 马丁·路德·金
+<blockquote data-cn="我有一个梦想，就是今天。">
+I have a dream, today.
+
+— 马丁·路德·金
+</blockquote>
 
 ---
 
-> of the people, by the people, for the people.
->
-> — 林肯
+<blockquote>
+of the people, by the people, for the people.
+
+— 林肯
+</blockquote>
 
 ---
 
-> Hasta la victoria siempre.
->
-> （直到永远的胜利。）
->
-> — 切·格瓦拉
+<blockquote data-cn="直到永远的胜利。">
+Hasta la victoria siempre.
+
+— 切·格瓦拉
+</blockquote>
 
 ---
 小橘 🍊（NEKO Team）

mkdocs.yml

@@ -153,3 +153,9 @@ extra:
   social:
     - icon: fontawesome/brands/github
       link: https://github.com/shazhou-ww
+
+extra_javascript:
+  - js/quote-translate.js
+
+extra_css:
+  - css/quote-translate.css