HTML Protection

:root {
  --navbar-h: 56px;
  --sidebar-width: 260px;
  --radius-sm: .25rem;
  --radius-md: .5rem;
  --radius-lg: .75rem;
  --transition-fast: .18s;
  --transition-med: .25s;
  --elev-1: 0 .125rem .25rem rgba(0,0,0,.06);
  --elev-2: 0 .5rem 1rem rgba(0,0,0,.10);
  --bg: var(--bs-body-bg, #ffffff);
  --surface: #f7f7f8;
  --text: var(--bs-body-color, #1d1d1f);
  --muted: var(--bs-secondary-color, #6c757d);
  --primary: var(--bs-primary, #0d6efd);
  --primary-contrast: #fff;
  --danger: #e02433;
  --success: #198754;
  --border: rgba(0,0,0,0.08);
  --shadow: 0 .5rem 1rem rgba(0,0,0,0.06);
  --accent: #9b51e0;
  --link: var(--primary);
  --link-hover: color-mix(in srgb, var(--primary) 82%, black 18%);
  --surface-soft: color-mix(in srgb, var(--bg) 96%, #000 4%);
  --surface-strong: color-mix(in srgb, var(--bg) 90%, #000 10%);
  --border-strong: color-mix(in srgb, var(--border) 70%, currentColor 30%);
  --focus: color-mix(in srgb, var(--primary) 45%, white 55%);
  --code-bg: #f6f8fa;
  --code-text: #0b1220;
  --code-inline: rgba(0,0,0,0.05);
}

pre

--link: var(--primary);
--link-hover: color-mix(in srgb, var(--primary) 82%, black 18%);
--surface-soft: color-mix(in srgb, var(--bg) 96%, #000 4%);
--surface-strong: color-mix(in srgb, var(--bg) 90%, #000 10%);
--border-strong: color-mix(in srgb, var(--border) 70%, currentColor 30%);
--focus: color-mix(in srgb, var(--primary) 45%, white 55%);
--code-bg: #f6f8fa;
--code-text: #0b1220;
--code-inline: rgba(0,0,0,0.05);

code

document.addEventListener(‘click’, function(e) {
var btn = e.target.closest(‘[data-zob-friends-toggle]’);
if (!btn) return;

var target = btn.getAttribute(‘data-bs-target’);
if (!target) return;

var el = document.querySelector(target);
if (!el) return;

el.addEventListener(‘shown.bs.collapse’, function() {
btn.textContent = btn.getAttribute(‘data-text-collapse’) || ‘收起’;
}, { once: true });

el.addEventListener(‘hidden.bs.collapse’, function() {
btn.textContent = btn.getAttribute(‘data-text-expand’) || ‘展开更多’;
}, { once: true });
});

script

html, body {
margin: 0;
padding: 0;
transition: background-color .3s ease, color .3s ease;
background-color: var(–bg);
color: var(–text);
}
.collapse-toggle-icon { transition: transform .3s; }
.collapse.show .collapse-toggle-icon { transform: rotate(180deg); }

<br /><br /> el.addEventListener(‘hidden.bs.collapse’, function() {<br /><br /> btn.textContent = btn.getAttribute(‘data-text-expand’) || ‘展开更多’;<br /><br /> }, { once: true });<br /><br /> });<span data-mce-type=”bookmark” style=”display: inline-block; width: 0px; overflow: hidden; line-height: 0;” class=”mce_SELRES_start”></span><br /><br />