Hare Krishna

वेदः . vedas . knowledge . 知識

差異處

這裏顯示兩個版本的差異處。

連向這個比對檢視

兩邊的前次修訂版前次修改
下次修改		前次修改
bootstrap [2024/10/27 10:01] – hostbootstrap [2024/12/17 22:11] (目前版本) – host
行 1: 行 1:
-<html>   .tree { +[[NOD|《奉愛的甘露》]]\\ 
-  --spacing: 1.5rem; +[[CC|《永恆的采坦亞經》]]
-  --radius: 10px; +
-} +
- +
-.tree li { +
-  display: block; +
-  position: relative; +
-  padding-left: calc(2 * var(--spacing) - var(--radius) - 2px); +
-} +
- +
-.tree ul { +
-  margin-left: calc(var(--radius) - var(--spacing)); +
-  padding-left: 0; +
-} +
- +
-.tree ul li { +
-  border-left: 2px solid #ddd; +
-} +
- +
-.tree ul li:last-child { +
-  border-color: transparent; +
-} +
- +
-.tree ul li::before { +
-  content: ''; +
-  display: block; +
-  position: absolute; +
-  top: calc(var(--spacing) / -2); +
-  left: -2px; +
-  width: calc(var(--spacing) + 2px); +
-  height: calc(var(--spacing) + 1px); +
-  border: solid #ddd; +
-  border-width: 0 0 2px 2px; +
-} +
- +
-.tree summary { +
-  display: block; +
-  cursor: pointer; +
-} +
- +
-.tree summary::marker, +
-.tree summary::-webkit-details-marker { +
-  display: none; +
-} +
- +
-.tree summary:focus { +
-  outline: none; +
-} +
- +
-.tree summary:focus-visible { +
-  outline: 1px dotted #000; +
-} +
- +
-.tree li::after, +
-.tree summary::before { +
-  content: ''; +
-  display: block; +
-  position: absolute; +
-  top: calc(var(--spacing) / 2 - var(--radius)); +
-  left: calc(var(--spacing) - var(--radius) - 1px); +
-  width: calc(2 * var(--radius)); +
-  height: calc(2 * var(--radius)); +
-  border-radius: 50%; +
-  background: #ddd; +
-} +
- +
-.tree summary::before { +
-  z-index: 1; +
-  background: #696 url('expand-collapse.svg') 0 0; +
-} +
- +
-.tree details[open] > summary::before { +
-  background-position: calc(-2 * var(--radius)) 0; +
-} +
- +
-<ul class="tree"> +
-  <li> +
-    <details open> +
-      <summary>Giant planets</summary> +
-      <ul> +
-        <li> +
-          <details> +
-            <summary>Gas giants</summary> +
-            <ul> +
-              <li>Jupiter</li> +
-              <li>Saturn</li> +
-            </ul> +
-          </details> +
-        </li> +
-        <li> +
-          <details> +
-            <summary>Ice giants</summary> +
-            <ul> +
-              <li>Uranus</li> +
-              <li>Neptune</li> +
-            </ul> +
-          </details> +
-        </li> +
-      </ul> +
-    </details> +
-  </li> +
-</ul> +
-</html>+