https://codex.erakh.com/api.php?action=feedcontributions&feedformat=atom&user=Juoh 2026-09-01T10:18:09Z User contributions MediaWiki 1.43.1 https://codex.erakh.com/index.php?title=MediaWiki:Common.js&diff=17 2026-04-11T17:49:51Z

<p>Juoh: header style sync with erakh.com</p> <hr /> <div>(function () {<br /> var fontLink = document.createElement(&quot;link&quot;);<br /> fontLink.rel = &quot;stylesheet&quot;;<br /> fontLink.href = &quot;https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&amp;display=swap&quot;;<br /> document.head.insertBefore(fontLink, document.head.firstChild);<br /> <br /> function getCookie(name) {<br /> var match = document.cookie.match(new RegExp(&quot;(?:^|; )&quot; + name + &quot;=([^;]*)&quot;));<br /> return match ? decodeURIComponent(match[1]) : null;<br /> }<br /> <br /> var user = null;<br /> try {<br /> var raw = getCookie(&quot;erakh_user&quot;);<br /> if (raw) user = JSON.parse(raw);<br /> } catch (e) {}<br /> <br /> function sp(el, prop, val) {<br /> el.style.setProperty(prop, val, &quot;important&quot;);<br /> }<br /> <br /> var header = document.createElement(&quot;header&quot;);<br /> sp(header, &quot;position&quot;, &quot;fixed&quot;);<br /> sp(header, &quot;top&quot;, &quot;0&quot;);<br /> sp(header, &quot;left&quot;, &quot;0&quot;);<br /> sp(header, &quot;right&quot;, &quot;0&quot;);<br /> sp(header, &quot;z-index&quot;, &quot;9999&quot;);<br /> sp(header, &quot;width&quot;, &quot;100%&quot;);<br /> sp(header, &quot;background&quot;, &quot;#f9f6f0&quot;);<br /> sp(header, &quot;border-bottom&quot;, &quot;1px solid #e2d9c8&quot;);<br /> sp(header, &quot;display&quot;, &quot;flex&quot;);<br /> sp(header, &quot;align-items&quot;, &quot;center&quot;);<br /> sp(header, &quot;justify-content&quot;, &quot;space-between&quot;);<br /> sp(header, &quot;padding&quot;, &quot;0 2rem&quot;);<br /> sp(header, &quot;height&quot;, &quot;56px&quot;);<br /> sp(header, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> <br /> var left = document.createElement(&quot;div&quot;);<br /> sp(left, &quot;display&quot;, &quot;flex&quot;);<br /> sp(left, &quot;align-items&quot;, &quot;center&quot;);<br /> sp(left, &quot;gap&quot;, &quot;1.75rem&quot;);<br /> <br /> var logo = document.createElement(&quot;a&quot;);<br /> logo.href = &quot;https://erakh.com&quot;;<br /> logo.textContent = &quot;Erakh Archive&quot;;<br /> sp(logo, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(logo, &quot;font-size&quot;, &quot;1.125rem&quot;);<br /> sp(logo, &quot;font-weight&quot;, &quot;500&quot;);<br /> sp(logo, &quot;color&quot;, &quot;#2a2218&quot;);<br /> sp(logo, &quot;text-decoration&quot;, &quot;none&quot;);<br /> sp(logo, &quot;letter-spacing&quot;, &quot;0.05em&quot;);<br /> sp(logo, &quot;text-transform&quot;, &quot;none&quot;);<br /> sp(logo, &quot;font-variant&quot;, &quot;normal&quot;);<br /> sp(logo, &quot;font-variant-caps&quot;, &quot;normal&quot;);<br /> sp(logo, &quot;line-height&quot;, &quot;1&quot;);<br /> <br /> var nav = document.createElement(&quot;nav&quot;);<br /> sp(nav, &quot;display&quot;, &quot;flex&quot;);<br /> sp(nav, &quot;align-items&quot;, &quot;center&quot;);<br /> sp(nav, &quot;gap&quot;, &quot;1.5rem&quot;);<br /> <br /> var codexLink = document.createElement(&quot;a&quot;);<br /> codexLink.href = &quot;https://codex.erakh.com&quot;;<br /> codexLink.textContent = &quot;Codex&quot;;<br /> sp(codexLink, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(codexLink, &quot;font-size&quot;, &quot;1rem&quot;);<br /> sp(codexLink, &quot;color&quot;, &quot;#6b5e4e&quot;);<br /> sp(codexLink, &quot;text-decoration&quot;, &quot;none&quot;);<br /> sp(codexLink, &quot;text-transform&quot;, &quot;none&quot;);<br /> sp(codexLink, &quot;font-variant&quot;, &quot;normal&quot;);<br /> sp(codexLink, &quot;line-height&quot;, &quot;1&quot;);<br /> codexLink.addEventListener(&quot;mouseover&quot;, function() { this.style.setProperty(&quot;color&quot;, &quot;#2a2218&quot;, &quot;important&quot;); });<br /> codexLink.addEventListener(&quot;mouseout&quot;, function() { this.style.setProperty(&quot;color&quot;, &quot;#6b5e4e&quot;, &quot;important&quot;); });<br /> <br /> nav.appendChild(codexLink);<br /> left.appendChild(logo);<br /> left.appendChild(nav);<br /> <br /> var right = document.createElement(&quot;div&quot;);<br /> sp(right, &quot;display&quot;, &quot;flex&quot;);<br /> sp(right, &quot;align-items&quot;, &quot;center&quot;);<br /> <br /> if (user &amp;&amp; user.email) {<br /> var profile = document.createElement(&quot;div&quot;);<br /> sp(profile, &quot;position&quot;, &quot;relative&quot;);<br /> <br /> var avatar = document.createElement(&quot;div&quot;);<br /> avatar.textContent = user.email.slice(0, 1).toUpperCase();<br /> sp(avatar, &quot;width&quot;, &quot;32px&quot;);<br /> sp(avatar, &quot;height&quot;, &quot;32px&quot;);<br /> sp(avatar, &quot;border-radius&quot;, &quot;50%&quot;);<br /> sp(avatar, &quot;background&quot;, &quot;#e2d9c8&quot;);<br /> sp(avatar, &quot;border&quot;, &quot;1px solid #c8b99a&quot;);<br /> sp(avatar, &quot;display&quot;, &quot;flex&quot;);<br /> sp(avatar, &quot;align-items&quot;, &quot;center&quot;);<br /> sp(avatar, &quot;justify-content&quot;, &quot;center&quot;);<br /> sp(avatar, &quot;cursor&quot;, &quot;pointer&quot;);<br /> sp(avatar, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(avatar, &quot;font-size&quot;, &quot;0.75rem&quot;);<br /> sp(avatar, &quot;font-weight&quot;, &quot;500&quot;);<br /> sp(avatar, &quot;color&quot;, &quot;#2a2218&quot;);<br /> sp(avatar, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> avatar.addEventListener(&quot;mouseover&quot;, function() { this.style.setProperty(&quot;border-color&quot;, &quot;#c8a060&quot;, &quot;important&quot;); });<br /> avatar.addEventListener(&quot;mouseout&quot;, function() { this.style.setProperty(&quot;border-color&quot;, &quot;#c8b99a&quot;, &quot;important&quot;); });<br /> <br /> var dropdown = document.createElement(&quot;div&quot;);<br /> sp(dropdown, &quot;display&quot;, &quot;none&quot;);<br /> sp(dropdown, &quot;position&quot;, &quot;absolute&quot;);<br /> sp(dropdown, &quot;top&quot;, &quot;calc(100% + 8px)&quot;);<br /> sp(dropdown, &quot;right&quot;, &quot;0&quot;);<br /> sp(dropdown, &quot;background&quot;, &quot;#f9f6f0&quot;);<br /> sp(dropdown, &quot;border&quot;, &quot;1px solid #e2d9c8&quot;);<br /> sp(dropdown, &quot;min-width&quot;, &quot;180px&quot;);<br /> sp(dropdown, &quot;padding&quot;, &quot;0.5rem 0&quot;);<br /> sp(dropdown, &quot;box-shadow&quot;, &quot;0 4px 16px rgba(0,0,0,0.06)&quot;);<br /> sp(dropdown, &quot;z-index&quot;, &quot;10000&quot;);<br /> sp(dropdown, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> <br /> var emailDiv = document.createElement(&quot;div&quot;);<br /> emailDiv.textContent = user.email;<br /> sp(emailDiv, &quot;padding&quot;, &quot;0.5rem 1rem 0.75rem&quot;);<br /> sp(emailDiv, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(emailDiv, &quot;font-size&quot;, &quot;0.875rem&quot;);<br /> sp(emailDiv, &quot;font-style&quot;, &quot;italic&quot;);<br /> sp(emailDiv, &quot;color&quot;, &quot;#6b5e4e&quot;);<br /> sp(emailDiv, &quot;border-bottom&quot;, &quot;1px solid #e2d9c8&quot;);<br /> sp(emailDiv, &quot;margin-bottom&quot;, &quot;0.25rem&quot;);<br /> sp(emailDiv, &quot;word-break&quot;, &quot;break-all&quot;);<br /> <br /> var profileLink = document.createElement(&quot;a&quot;);<br /> profileLink.href = &quot;https://erakh.com/profile&quot;;<br /> profileLink.textContent = &quot;Profile&quot;;<br /> sp(profileLink, &quot;display&quot;, &quot;block&quot;);<br /> sp(profileLink, &quot;width&quot;, &quot;100%&quot;);<br /> sp(profileLink, &quot;padding&quot;, &quot;0.5rem 1rem&quot;);<br /> sp(profileLink, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(profileLink, &quot;font-size&quot;, &quot;0.8125rem&quot;);<br /> sp(profileLink, &quot;color&quot;, &quot;#2a2218&quot;);<br /> sp(profileLink, &quot;text-decoration&quot;, &quot;none&quot;);<br /> sp(profileLink, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> profileLink.addEventListener(&quot;mouseover&quot;, function() { this.style.setProperty(&quot;background&quot;, &quot;#f0ebe0&quot;, &quot;important&quot;); });<br /> profileLink.addEventListener(&quot;mouseout&quot;, function() { this.style.setProperty(&quot;background&quot;, &quot;transparent&quot;, &quot;important&quot;); });<br /> <br /> var signOutBtn = document.createElement(&quot;button&quot;);<br /> signOutBtn.textContent = &quot;Sign out&quot;;<br /> sp(signOutBtn, &quot;display&quot;, &quot;block&quot;);<br /> sp(signOutBtn, &quot;width&quot;, &quot;100%&quot;);<br /> sp(signOutBtn, &quot;padding&quot;, &quot;0.5rem 1rem&quot;);<br /> sp(signOutBtn, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(signOutBtn, &quot;font-size&quot;, &quot;0.8125rem&quot;);<br /> sp(signOutBtn, &quot;color&quot;, &quot;#a04040&quot;);<br /> sp(signOutBtn, &quot;text-align&quot;, &quot;left&quot;);<br /> sp(signOutBtn, &quot;background&quot;, &quot;transparent&quot;);<br /> sp(signOutBtn, &quot;border&quot;, &quot;none&quot;);<br /> sp(signOutBtn, &quot;cursor&quot;, &quot;pointer&quot;);<br /> sp(signOutBtn, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> signOutBtn.addEventListener(&quot;mouseover&quot;, function() { this.style.setProperty(&quot;background&quot;, &quot;#f0ebe0&quot;, &quot;important&quot;); });<br /> signOutBtn.addEventListener(&quot;mouseout&quot;, function() { this.style.setProperty(&quot;background&quot;, &quot;transparent&quot;, &quot;important&quot;); });<br /> <br /> signOutBtn.addEventListener(&quot;click&quot;, function () {<br /> fetch(&quot;https://erakh.com/api/auth/logout&quot;, { method: &quot;POST&quot;, credentials: &quot;include&quot; })<br /> .then(function () { window.location.href = &quot;https://erakh.com&quot;; });<br /> });<br /> <br /> dropdown.appendChild(emailDiv);<br /> dropdown.appendChild(profileLink);<br /> dropdown.appendChild(signOutBtn);<br /> <br /> avatar.addEventListener(&quot;click&quot;, function () {<br /> var isOpen = dropdown.style.display === &quot;none&quot;;<br /> dropdown.style.display = isOpen ? &quot;block&quot; : &quot;none&quot;;<br /> });<br /> document.addEventListener(&quot;click&quot;, function (e) {<br /> var inside = profile.contains(e.target);<br /> if (inside === false) dropdown.style.display = &quot;none&quot;;<br /> });<br /> <br /> profile.appendChild(avatar);<br /> profile.appendChild(dropdown);<br /> right.appendChild(profile);<br /> <br /> } else {<br /> var loginBtn = document.createElement(&quot;a&quot;);<br /> loginBtn.href = &quot;https://erakh.com/login?redirect=&quot; + encodeURIComponent(window.location.href);<br /> loginBtn.textContent = &quot;Sign in&quot;;<br /> sp(loginBtn, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(loginBtn, &quot;font-size&quot;, &quot;0.8125rem&quot;);<br /> sp(loginBtn, &quot;font-weight&quot;, &quot;500&quot;);<br /> sp(loginBtn, &quot;color&quot;, &quot;#2a2218&quot;);<br /> sp(loginBtn, &quot;text-decoration&quot;, &quot;none&quot;);<br /> sp(loginBtn, &quot;padding&quot;, &quot;0.4rem 1rem&quot;);<br /> sp(loginBtn, &quot;border&quot;, &quot;1px solid #c8b99a&quot;);<br /> sp(loginBtn, &quot;background&quot;, &quot;transparent&quot;);<br /> sp(loginBtn, &quot;cursor&quot;, &quot;pointer&quot;);<br /> sp(loginBtn, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> loginBtn.addEventListener(&quot;mouseover&quot;, function() {<br /> this.style.setProperty(&quot;border-color&quot;, &quot;#c8a060&quot;, &quot;important&quot;);<br /> this.style.setProperty(&quot;background&quot;, &quot;#f0ebe0&quot;, &quot;important&quot;);<br /> });<br /> loginBtn.addEventListener(&quot;mouseout&quot;, function() {<br /> this.style.setProperty(&quot;border-color&quot;, &quot;#c8b99a&quot;, &quot;important&quot;);<br /> this.style.setProperty(&quot;background&quot;, &quot;transparent&quot;, &quot;important&quot;);<br /> });<br /> right.appendChild(loginBtn);<br /> }<br /> <br /> header.appendChild(left);<br /> header.appendChild(right);<br /> document.body.insertBefore(header, document.body.firstChild);<br /> })();</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.js&diff=16 2026-04-11T17:46:34Z

<p>Juoh: header style sync with erakh.com</p> <hr /> <div>(function () {<br /> var fontLink = document.createElement(&quot;link&quot;);<br /> fontLink.rel = &quot;stylesheet&quot;;<br /> fontLink.href = &quot;https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&amp;display=swap&quot;;<br /> document.head.insertBefore(fontLink, document.head.firstChild);<br /> <br /> function getCookie(name) {<br /> var match = document.cookie.match(new RegExp(&quot;(?:^|; )&quot; + name + &quot;=([^;]*)&quot;));<br /> return match ? decodeURIComponent(match[1]) : null;<br /> }<br /> <br /> var user = null;<br /> try {<br /> var raw = getCookie(&quot;erakh_user&quot;);<br /> if (raw) user = JSON.parse(raw);<br /> } catch (e) {}<br /> <br /> function sp(el, prop, val) {<br /> el.style.setProperty(prop, val, &quot;important&quot;);<br /> }<br /> <br /> var header = document.createElement(&quot;header&quot;);<br /> sp(header, &quot;position&quot;, &quot;fixed&quot;);<br /> sp(header, &quot;top&quot;, &quot;0&quot;);<br /> sp(header, &quot;left&quot;, &quot;0&quot;);<br /> sp(header, &quot;right&quot;, &quot;0&quot;);<br /> sp(header, &quot;z-index&quot;, &quot;9999&quot;);<br /> sp(header, &quot;width&quot;, &quot;100%&quot;);<br /> sp(header, &quot;background&quot;, &quot;#f9f6f0&quot;);<br /> sp(header, &quot;border-bottom&quot;, &quot;1px solid #e2d9c8&quot;);<br /> sp(header, &quot;display&quot;, &quot;flex&quot;);<br /> sp(header, &quot;align-items&quot;, &quot;center&quot;);<br /> sp(header, &quot;justify-content&quot;, &quot;space-between&quot;);<br /> sp(header, &quot;padding&quot;, &quot;0 2rem&quot;);<br /> sp(header, &quot;height&quot;, &quot;56px&quot;);<br /> sp(header, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> <br /> var left = document.createElement(&quot;div&quot;);<br /> sp(left, &quot;display&quot;, &quot;flex&quot;);<br /> sp(left, &quot;align-items&quot;, &quot;center&quot;);<br /> sp(left, &quot;gap&quot;, &quot;1.75rem&quot;);<br /> <br /> var logo = document.createElement(&quot;a&quot;);<br /> logo.href = &quot;https://erakh.com&quot;;<br /> logo.textContent = &quot;Erakh Archive&quot;;<br /> sp(logo, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(logo, &quot;font-size&quot;, &quot;1.125rem&quot;);<br /> sp(logo, &quot;font-weight&quot;, &quot;500&quot;);<br /> sp(logo, &quot;color&quot;, &quot;#2a2218&quot;);<br /> sp(logo, &quot;text-decoration&quot;, &quot;none&quot;);<br /> sp(logo, &quot;letter-spacing&quot;, &quot;0.05em&quot;);<br /> sp(logo, &quot;text-transform&quot;, &quot;none&quot;);<br /> sp(logo, &quot;font-variant&quot;, &quot;normal&quot;);<br /> sp(logo, &quot;font-variant-caps&quot;, &quot;normal&quot;);<br /> sp(logo, &quot;line-height&quot;, &quot;1&quot;);<br /> <br /> var nav = document.createElement(&quot;nav&quot;);<br /> sp(nav, &quot;display&quot;, &quot;flex&quot;);<br /> sp(nav, &quot;align-items&quot;, &quot;center&quot;);<br /> sp(nav, &quot;gap&quot;, &quot;1.5rem&quot;);<br /> <br /> var codexLink = document.createElement(&quot;a&quot;);<br /> codexLink.href = &quot;https://codex.erakh.com&quot;;<br /> codexLink.textContent = &quot;Codex&quot;;<br /> sp(codexLink, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(codexLink, &quot;font-size&quot;, &quot;1rem&quot;);<br /> sp(codexLink, &quot;color&quot;, &quot;#6b5e4e&quot;);<br /> sp(codexLink, &quot;text-decoration&quot;, &quot;none&quot;);<br /> sp(codexLink, &quot;text-transform&quot;, &quot;none&quot;);<br /> sp(codexLink, &quot;font-variant&quot;, &quot;normal&quot;);<br /> sp(codexLink, &quot;line-height&quot;, &quot;1&quot;);<br /> codexLink.addEventListener(&quot;mouseover&quot;, function() { this.style.setProperty(&quot;color&quot;, &quot;#2a2218&quot;, &quot;important&quot;); });<br /> codexLink.addEventListener(&quot;mouseout&quot;, function() { this.style.setProperty(&quot;color&quot;, &quot;#6b5e4e&quot;, &quot;important&quot;); });<br /> <br /> nav.appendChild(codexLink);<br /> left.appendChild(logo);<br /> left.appendChild(nav);<br /> <br /> var right = document.createElement(&quot;div&quot;);<br /> sp(right, &quot;display&quot;, &quot;flex&quot;);<br /> sp(right, &quot;align-items&quot;, &quot;center&quot;);<br /> <br /> if (user &amp;&amp; user.email) {<br /> var profile = document.createElement(&quot;div&quot;);<br /> sp(profile, &quot;position&quot;, &quot;relative&quot;);<br /> <br /> var avatar = document.createElement(&quot;div&quot;);<br /> avatar.textContent = user.email.slice(0, 1).toUpperCase();<br /> sp(avatar, &quot;width&quot;, &quot;32px&quot;);<br /> sp(avatar, &quot;height&quot;, &quot;32px&quot;);<br /> sp(avatar, &quot;border-radius&quot;, &quot;50%&quot;);<br /> sp(avatar, &quot;background&quot;, &quot;#e2d9c8&quot;);<br /> sp(avatar, &quot;border&quot;, &quot;1px solid #c8b99a&quot;);<br /> sp(avatar, &quot;display&quot;, &quot;flex&quot;);<br /> sp(avatar, &quot;align-items&quot;, &quot;center&quot;);<br /> sp(avatar, &quot;justify-content&quot;, &quot;center&quot;);<br /> sp(avatar, &quot;cursor&quot;, &quot;pointer&quot;);<br /> sp(avatar, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(avatar, &quot;font-size&quot;, &quot;0.75rem&quot;);<br /> sp(avatar, &quot;font-weight&quot;, &quot;500&quot;);<br /> sp(avatar, &quot;color&quot;, &quot;#2a2218&quot;);<br /> sp(avatar, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> avatar.addEventListener(&quot;mouseover&quot;, function() { this.style.setProperty(&quot;border-color&quot;, &quot;#c8a060&quot;, &quot;important&quot;); });<br /> avatar.addEventListener(&quot;mouseout&quot;, function() { this.style.setProperty(&quot;border-color&quot;, &quot;#c8b99a&quot;, &quot;important&quot;); });<br /> <br /> var dropdown = document.createElement(&quot;div&quot;);<br /> sp(dropdown, &quot;display&quot;, &quot;none&quot;);<br /> sp(dropdown, &quot;position&quot;, &quot;absolute&quot;);<br /> sp(dropdown, &quot;top&quot;, &quot;calc(100% + 8px)&quot;);<br /> sp(dropdown, &quot;right&quot;, &quot;0&quot;);<br /> sp(dropdown, &quot;background&quot;, &quot;#f9f6f0&quot;);<br /> sp(dropdown, &quot;border&quot;, &quot;1px solid #e2d9c8&quot;);<br /> sp(dropdown, &quot;min-width&quot;, &quot;180px&quot;);<br /> sp(dropdown, &quot;padding&quot;, &quot;0.5rem 0&quot;);<br /> sp(dropdown, &quot;box-shadow&quot;, &quot;0 4px 16px rgba(0,0,0,0.06)&quot;);<br /> sp(dropdown, &quot;z-index&quot;, &quot;10000&quot;);<br /> sp(dropdown, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> <br /> var emailDiv = document.createElement(&quot;div&quot;);<br /> emailDiv.textContent = user.email;<br /> sp(emailDiv, &quot;padding&quot;, &quot;0.5rem 1rem 0.75rem&quot;);<br /> sp(emailDiv, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(emailDiv, &quot;font-size&quot;, &quot;0.875rem&quot;);<br /> sp(emailDiv, &quot;font-style&quot;, &quot;italic&quot;);<br /> sp(emailDiv, &quot;color&quot;, &quot;#6b5e4e&quot;);<br /> sp(emailDiv, &quot;border-bottom&quot;, &quot;1px solid #e2d9c8&quot;);<br /> sp(emailDiv, &quot;margin-bottom&quot;, &quot;0.25rem&quot;);<br /> sp(emailDiv, &quot;word-break&quot;, &quot;break-all&quot;);<br /> <br /> var profileLink = document.createElement(&quot;a&quot;);<br /> profileLink.href = &quot;https://erakh.com/profile&quot;;<br /> profileLink.textContent = &quot;Profile&quot;;<br /> sp(profileLink, &quot;display&quot;, &quot;block&quot;);<br /> sp(profileLink, &quot;width&quot;, &quot;100%&quot;);<br /> sp(profileLink, &quot;padding&quot;, &quot;0.5rem 1rem&quot;);<br /> sp(profileLink, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(profileLink, &quot;font-size&quot;, &quot;0.8125rem&quot;);<br /> sp(profileLink, &quot;color&quot;, &quot;#2a2218&quot;);<br /> sp(profileLink, &quot;text-decoration&quot;, &quot;none&quot;);<br /> sp(profileLink, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> profileLink.addEventListener(&quot;mouseover&quot;, function() { this.style.setProperty(&quot;background&quot;, &quot;#f0ebe0&quot;, &quot;important&quot;); });<br /> profileLink.addEventListener(&quot;mouseout&quot;, function() { this.style.setProperty(&quot;background&quot;, &quot;transparent&quot;, &quot;important&quot;); });<br /> <br /> var signOutBtn = document.createElement(&quot;button&quot;);<br /> signOutBtn.textContent = &quot;Sign out&quot;;<br /> sp(signOutBtn, &quot;display&quot;, &quot;block&quot;);<br /> sp(signOutBtn, &quot;width&quot;, &quot;100%&quot;);<br /> sp(signOutBtn, &quot;padding&quot;, &quot;0.5rem 1rem&quot;);<br /> sp(signOutBtn, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(signOutBtn, &quot;font-size&quot;, &quot;0.8125rem&quot;);<br /> sp(signOutBtn, &quot;color&quot;, &quot;#a04040&quot;);<br /> sp(signOutBtn, &quot;text-align&quot;, &quot;left&quot;);<br /> sp(signOutBtn, &quot;background&quot;, &quot;transparent&quot;);<br /> sp(signOutBtn, &quot;border&quot;, &quot;none&quot;);<br /> sp(signOutBtn, &quot;cursor&quot;, &quot;pointer&quot;);<br /> sp(signOutBtn, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> signOutBtn.addEventListener(&quot;mouseover&quot;, function() { this.style.setProperty(&quot;background&quot;, &quot;#f0ebe0&quot;, &quot;important&quot;); });<br /> signOutBtn.addEventListener(&quot;mouseout&quot;, function() { this.style.setProperty(&quot;background&quot;, &quot;transparent&quot;, &quot;important&quot;); });<br /> <br /> signOutBtn.addEventListener(&quot;click&quot;, function () {<br /> fetch(&quot;https://erakh.com/api/auth/logout&quot;, { method: &quot;POST&quot;, credentials: &quot;include&quot; })<br /> .then(function () { window.location.href = &quot;https://erakh.com&quot;; });<br /> });<br /> <br /> dropdown.appendChild(emailDiv);<br /> dropdown.appendChild(profileLink);<br /> dropdown.appendChild(signOutBtn);<br /> <br /> avatar.addEventListener(&quot;click&quot;, function () {<br /> var isOpen = dropdown.style.display === &quot;none&quot;;<br /> dropdown.style.display = isOpen ? &quot;block&quot; : &quot;none&quot;;<br /> });<br /> document.addEventListener(&quot;click&quot;, function (e) {<br /> var inside = profile.contains(e.target);<br /> if (inside === false) dropdown.style.display = &quot;none&quot;;<br /> });<br /> <br /> profile.appendChild(avatar);<br /> profile.appendChild(dropdown);<br /> right.appendChild(profile);<br /> <br /> } else {<br /> var loginBtn = document.createElement(&quot;a&quot;);<br /> loginBtn.href = &quot;https://erakh.com/login?redirect=&quot; + encodeURIComponent(window.location.href);<br /> loginBtn.textContent = &quot;Sign in&quot;;<br /> sp(loginBtn, &quot;font-family&quot;, &quot;Inter, sans-serif&quot;);<br /> sp(loginBtn, &quot;font-size&quot;, &quot;0.8125rem&quot;);<br /> sp(loginBtn, &quot;font-weight&quot;, &quot;500&quot;);<br /> sp(loginBtn, &quot;color&quot;, &quot;#2a2218&quot;);<br /> sp(loginBtn, &quot;text-decoration&quot;, &quot;none&quot;);<br /> sp(loginBtn, &quot;padding&quot;, &quot;0.4rem 1rem&quot;);<br /> sp(loginBtn, &quot;border&quot;, &quot;1px solid #c8b99a&quot;);<br /> sp(loginBtn, &quot;background&quot;, &quot;transparent&quot;);<br /> sp(loginBtn, &quot;cursor&quot;, &quot;pointer&quot;);<br /> sp(loginBtn, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> sp(loginBtn, &quot;line-height&quot;, &quot;1&quot;);<br /> loginBtn.addEventListener(&quot;mouseover&quot;, function() {<br /> this.style.setProperty(&quot;border-color&quot;, &quot;#c8a060&quot;, &quot;important&quot;);<br /> this.style.setProperty(&quot;background&quot;, &quot;#f0ebe0&quot;, &quot;important&quot;);<br /> });<br /> loginBtn.addEventListener(&quot;mouseout&quot;, function() {<br /> this.style.setProperty(&quot;border-color&quot;, &quot;#c8b99a&quot;, &quot;important&quot;);<br /> this.style.setProperty(&quot;background&quot;, &quot;transparent&quot;, &quot;important&quot;);<br /> });<br /> right.appendChild(loginBtn);<br /> }<br /> <br /> header.appendChild(left);<br /> header.appendChild(right);<br /> document.body.insertBefore(header, document.body.firstChild);<br /> })();</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.js&diff=15 2026-04-09T03:48:30Z

<p>Juoh: </p> <hr /> <div>(function () {<br /> /* --- Google Fonts 강제 로드 --- */<br /> var fontLink = document.createElement(&quot;link&quot;);<br /> fontLink.rel = &quot;stylesheet&quot;;<br /> fontLink.href = &quot;https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&amp;display=swap&quot;;<br /> document.head.insertBefore(fontLink, document.head.firstChild);<br /> <br /> /* --- 쿠키 읽기 --- */<br /> function getCookie(name) {<br /> var match = document.cookie.match(new RegExp(&quot;(?:^|; )&quot; + name + &quot;=([^;]*)&quot;));<br /> return match ? decodeURIComponent(match[1]) : null;<br /> }<br /> <br /> /* --- 유저 정보 파싱 --- */<br /> var user = null;<br /> try {<br /> var raw = getCookie(&quot;erakh_user&quot;);<br /> if (raw) user = JSON.parse(raw);<br /> } catch (e) {}<br /> <br /> /* --- 인라인 스타일 헬퍼 (important) --- */<br /> function sp(el, prop, val) {<br /> el.style.setProperty(prop, val, &quot;important&quot;);<br /> }<br /> <br /> /* --- 헤더 --- */<br /> var header = document.createElement(&quot;header&quot;);<br /> sp(header, &quot;position&quot;, &quot;fixed&quot;);<br /> sp(header, &quot;top&quot;, &quot;0&quot;);<br /> sp(header, &quot;left&quot;, &quot;0&quot;);<br /> sp(header, &quot;right&quot;, &quot;0&quot;);<br /> sp(header, &quot;z-index&quot;, &quot;9999&quot;);<br /> sp(header, &quot;width&quot;, &quot;100%&quot;);<br /> sp(header, &quot;background&quot;, &quot;#f9f6f0&quot;);<br /> sp(header, &quot;border-bottom&quot;, &quot;1px solid #e2d9c8&quot;);<br /> sp(header, &quot;display&quot;, &quot;flex&quot;);<br /> sp(header, &quot;align-items&quot;, &quot;center&quot;);<br /> sp(header, &quot;justify-content&quot;, &quot;space-between&quot;);<br /> sp(header, &quot;padding&quot;, &quot;0 2rem&quot;);<br /> sp(header, &quot;height&quot;, &quot;56px&quot;);<br /> sp(header, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> <br /> /* --- 좌측 --- */<br /> var left = document.createElement(&quot;div&quot;);<br /> sp(left, &quot;display&quot;, &quot;flex&quot;);<br /> sp(left, &quot;align-items&quot;, &quot;center&quot;);<br /> sp(left, &quot;gap&quot;, &quot;1.75rem&quot;);<br /> <br /> var logo = document.createElement(&quot;a&quot;);<br /> logo.href = &quot;https://erakh.com&quot;;<br /> logo.textContent = &quot;Erakh Archive&quot;;<br /> sp(logo, &quot;font-family&quot;, &quot;'Inter', sans-serif&quot;);<br /> sp(logo, &quot;font-size&quot;, &quot;1.125rem&quot;);<br /> sp(logo, &quot;font-weight&quot;, &quot;500&quot;);<br /> sp(logo, &quot;color&quot;, &quot;#2a2218&quot;);<br /> sp(logo, &quot;text-decoration&quot;, &quot;none&quot;);<br /> sp(logo, &quot;letter-spacing&quot;, &quot;-0.01em&quot;);<br /> sp(logo, &quot;text-transform&quot;, &quot;none&quot;);<br /> sp(logo, &quot;font-variant&quot;, &quot;normal&quot;);<br /> sp(logo, &quot;font-variant-caps&quot;, &quot;normal&quot;);<br /> sp(logo, &quot;line-height&quot;, &quot;1&quot;);<br /> <br /> var nav = document.createElement(&quot;nav&quot;);<br /> sp(nav, &quot;display&quot;, &quot;flex&quot;);<br /> sp(nav, &quot;align-items&quot;, &quot;center&quot;);<br /> sp(nav, &quot;gap&quot;, &quot;1.5rem&quot;);<br /> <br /> var codexLink = document.createElement(&quot;a&quot;);<br /> codexLink.href = &quot;https://codex.erakh.com&quot;;<br /> codexLink.textContent = &quot;Codex&quot;;<br /> sp(codexLink, &quot;font-family&quot;, &quot;'Inter', sans-serif&quot;);<br /> sp(codexLink, &quot;font-size&quot;, &quot;1rem&quot;);<br /> sp(codexLink, &quot;color&quot;, &quot;#6b5e4e&quot;);<br /> sp(codexLink, &quot;text-decoration&quot;, &quot;none&quot;);<br /> sp(codexLink, &quot;text-transform&quot;, &quot;none&quot;);<br /> sp(codexLink, &quot;font-variant&quot;, &quot;normal&quot;);<br /> sp(codexLink, &quot;line-height&quot;, &quot;1&quot;);<br /> codexLink.addEventListener(&quot;mouseover&quot;, function() { this.style.setProperty(&quot;color&quot;, &quot;#2a2218&quot;, &quot;important&quot;); });<br /> codexLink.addEventListener(&quot;mouseout&quot;, function() { this.style.setProperty(&quot;color&quot;, &quot;#6b5e4e&quot;, &quot;important&quot;); });<br /> <br /> nav.appendChild(codexLink);<br /> left.appendChild(logo);<br /> left.appendChild(nav);<br /> <br /> /* --- 우측 --- */<br /> var right = document.createElement(&quot;div&quot;);<br /> sp(right, &quot;display&quot;, &quot;flex&quot;);<br /> sp(right, &quot;align-items&quot;, &quot;center&quot;);<br /> <br /> if (user &amp;&amp; user.email) {<br /> /* 로그인 — 아바타 + 드롭다운 */<br /> var profile = document.createElement(&quot;div&quot;);<br /> sp(profile, &quot;position&quot;, &quot;relative&quot;);<br /> <br /> var avatar = document.createElement(&quot;div&quot;);<br /> avatar.textContent = user.email.slice(0, 1).toUpperCase();<br /> sp(avatar, &quot;width&quot;, &quot;32px&quot;);<br /> sp(avatar, &quot;height&quot;, &quot;32px&quot;);<br /> sp(avatar, &quot;border-radius&quot;, &quot;50%&quot;);<br /> sp(avatar, &quot;background&quot;, &quot;#e2d9c8&quot;);<br /> sp(avatar, &quot;border&quot;, &quot;1px solid #c8b99a&quot;);<br /> sp(avatar, &quot;display&quot;, &quot;flex&quot;);<br /> sp(avatar, &quot;align-items&quot;, &quot;center&quot;);<br /> sp(avatar, &quot;justify-content&quot;, &quot;center&quot;);<br /> sp(avatar, &quot;cursor&quot;, &quot;pointer&quot;);<br /> sp(avatar, &quot;font-family&quot;, &quot;'Inter', sans-serif&quot;);<br /> sp(avatar, &quot;font-size&quot;, &quot;0.75rem&quot;);<br /> sp(avatar, &quot;font-weight&quot;, &quot;500&quot;);<br /> sp(avatar, &quot;color&quot;, &quot;#2a2218&quot;);<br /> sp(avatar, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> <br /> var dropdown = document.createElement(&quot;div&quot;);<br /> sp(dropdown, &quot;display&quot;, &quot;none&quot;);<br /> sp(dropdown, &quot;position&quot;, &quot;absolute&quot;);<br /> sp(dropdown, &quot;top&quot;, &quot;calc(100% + 8px)&quot;);<br /> sp(dropdown, &quot;right&quot;, &quot;0&quot;);<br /> sp(dropdown, &quot;background&quot;, &quot;#f9f6f0&quot;);<br /> sp(dropdown, &quot;border&quot;, &quot;1px solid #e2d9c8&quot;);<br /> sp(dropdown, &quot;min-width&quot;, &quot;180px&quot;);<br /> sp(dropdown, &quot;padding&quot;, &quot;0.5rem 0&quot;);<br /> sp(dropdown, &quot;box-shadow&quot;, &quot;0 4px 16px rgba(0,0,0,0.06)&quot;);<br /> sp(dropdown, &quot;z-index&quot;, &quot;10000&quot;);<br /> sp(dropdown, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> <br /> var emailDiv = document.createElement(&quot;div&quot;);<br /> emailDiv.textContent = user.email;<br /> sp(emailDiv, &quot;padding&quot;, &quot;0.5rem 1rem 0.75rem&quot;);<br /> sp(emailDiv, &quot;font-family&quot;, &quot;'Inter', sans-serif&quot;);<br /> sp(emailDiv, &quot;font-size&quot;, &quot;0.8125rem&quot;);<br /> sp(emailDiv, &quot;color&quot;, &quot;#6b5e4e&quot;);<br /> sp(emailDiv, &quot;border-bottom&quot;, &quot;1px solid #e2d9c8&quot;);<br /> sp(emailDiv, &quot;margin-bottom&quot;, &quot;0.25rem&quot;);<br /> sp(emailDiv, &quot;word-break&quot;, &quot;break-all&quot;);<br /> <br /> var profileLink = document.createElement(&quot;a&quot;);<br /> profileLink.href = &quot;https://erakh.com/profile&quot;;<br /> profileLink.textContent = &quot;Profile&quot;;<br /> sp(profileLink, &quot;display&quot;, &quot;block&quot;);<br /> sp(profileLink, &quot;width&quot;, &quot;100%&quot;);<br /> sp(profileLink, &quot;padding&quot;, &quot;0.5rem 1rem&quot;);<br /> sp(profileLink, &quot;font-family&quot;, &quot;'Inter', sans-serif&quot;);<br /> sp(profileLink, &quot;font-size&quot;, &quot;0.8125rem&quot;);<br /> sp(profileLink, &quot;color&quot;, &quot;#2a2218&quot;);<br /> sp(profileLink, &quot;text-decoration&quot;, &quot;none&quot;);<br /> sp(profileLink, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> <br /> var signOutBtn = document.createElement(&quot;button&quot;);<br /> signOutBtn.textContent = &quot;Sign out&quot;;<br /> sp(signOutBtn, &quot;display&quot;, &quot;block&quot;);<br /> sp(signOutBtn, &quot;width&quot;, &quot;100%&quot;);<br /> sp(signOutBtn, &quot;padding&quot;, &quot;0.5rem 1rem&quot;);<br /> sp(signOutBtn, &quot;font-family&quot;, &quot;'Inter', sans-serif&quot;);<br /> sp(signOutBtn, &quot;font-size&quot;, &quot;0.8125rem&quot;);<br /> sp(signOutBtn, &quot;color&quot;, &quot;#a04040&quot;);<br /> sp(signOutBtn, &quot;text-align&quot;, &quot;left&quot;);<br /> sp(signOutBtn, &quot;background&quot;, &quot;transparent&quot;);<br /> sp(signOutBtn, &quot;border&quot;, &quot;none&quot;);<br /> sp(signOutBtn, &quot;cursor&quot;, &quot;pointer&quot;);<br /> sp(signOutBtn, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> <br /> signOutBtn.addEventListener(&quot;click&quot;, function () {<br /> fetch(&quot;https://erakh.com/api/auth/logout&quot;, { method: &quot;POST&quot;, credentials: &quot;include&quot; })<br /> .then(function () { window.location.href = &quot;https://erakh.com&quot;; });<br /> });<br /> <br /> dropdown.appendChild(emailDiv);<br /> dropdown.appendChild(profileLink);<br /> dropdown.appendChild(signOutBtn);<br /> <br /> avatar.addEventListener(&quot;click&quot;, function () {<br /> dropdown.style.display = dropdown.style.display === &quot;none&quot; ? &quot;block&quot; : &quot;none&quot;;<br /> });<br /> document.addEventListener(&quot;click&quot;, function (e) {<br /> if (!profile.contains(e.target)) dropdown.style.display = &quot;none&quot;;<br /> });<br /> <br /> profile.appendChild(avatar);<br /> profile.appendChild(dropdown);<br /> right.appendChild(profile);<br /> <br /> } else {<br /> /* 비로그인 — Sign in */<br /> var loginBtn = document.createElement(&quot;a&quot;);<br /> loginBtn.href = &quot;https://erakh.com/login?redirect=&quot; + encodeURIComponent(window.location.href);<br /> loginBtn.textContent = &quot;Sign in&quot;;<br /> sp(loginBtn, &quot;font-family&quot;, &quot;'Inter', sans-serif&quot;);<br /> sp(loginBtn, &quot;font-size&quot;, &quot;0.8125rem&quot;);<br /> sp(loginBtn, &quot;font-weight&quot;, &quot;500&quot;);<br /> sp(loginBtn, &quot;color&quot;, &quot;#2a2218&quot;);<br /> sp(loginBtn, &quot;text-decoration&quot;, &quot;none&quot;);<br /> sp(loginBtn, &quot;padding&quot;, &quot;0.4rem 1rem&quot;);<br /> sp(loginBtn, &quot;border&quot;, &quot;1px solid #c8b99a&quot;);<br /> sp(loginBtn, &quot;background&quot;, &quot;transparent&quot;);<br /> sp(loginBtn, &quot;cursor&quot;, &quot;pointer&quot;);<br /> sp(loginBtn, &quot;box-sizing&quot;, &quot;border-box&quot;);<br /> sp(loginBtn, &quot;line-height&quot;, &quot;1&quot;);<br /> loginBtn.addEventListener(&quot;mouseover&quot;, function() {<br /> this.style.setProperty(&quot;border-color&quot;, &quot;#c8a060&quot;, &quot;important&quot;);<br /> this.style.setProperty(&quot;background&quot;, &quot;#f0ebe0&quot;, &quot;important&quot;);<br /> });<br /> loginBtn.addEventListener(&quot;mouseout&quot;, function() {<br /> this.style.setProperty(&quot;border-color&quot;, &quot;#c8b99a&quot;, &quot;important&quot;);<br /> this.style.setProperty(&quot;background&quot;, &quot;transparent&quot;, &quot;important&quot;);<br /> });<br /> right.appendChild(loginBtn);<br /> }<br /> <br /> header.appendChild(left);<br /> header.appendChild(right);<br /> document.body.insertBefore(header, document.body.firstChild);<br /> })();</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.js&diff=14 2026-04-09T03:47:15Z

<p>Juoh: </p> <hr /> <div>(function () {<br /> /* --- Google Fonts 강제 로드 --- */<br /> var fontLink = document.createElement(&quot;link&quot;);<br /> fontLink.rel = &quot;stylesheet&quot;;<br /> fontLink.href = &quot;https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&amp;display=swap&quot;;<br /> document.head.insertBefore(fontLink, document.head.firstChild);<br /> <br /> /* --- 쿠키 읽기 --- */<br /> function getCookie(name) {<br /> var match = document.cookie.match(new RegExp(&quot;(?:^|; )&quot; + name + &quot;=([^;]*)&quot;));<br /> return match ? decodeURIComponent(match[1]) : null;<br /> }<br /> <br /> /* --- 유저 정보 파싱 --- */<br /> var user = null;<br /> try {<br /> var raw = getCookie(&quot;erakh_user&quot;);<br /> if (raw) user = JSON.parse(raw);<br /> } catch (e) {}<br /> <br /> /* --- 인라인 스타일 헬퍼 --- */<br /> function s(el, styles) {<br /> Object.keys(styles).forEach(function(k) { el.style[k] = styles[k]; });<br /> }<br /> <br /> /* --- 헤더 --- */<br /> var header = document.createElement(&quot;header&quot;);<br /> s(header, {<br /> position: &quot;fixed&quot;,<br /> top: &quot;0&quot;,<br /> left: &quot;0&quot;,<br /> right: &quot;0&quot;,<br /> zIndex: &quot;9999&quot;,<br /> width: &quot;100%&quot;,<br /> background: &quot;#f9f6f0&quot;,<br /> borderBottom: &quot;1px solid #e2d9c8&quot;,<br /> display: &quot;flex&quot;,<br /> alignItems: &quot;center&quot;,<br /> justifyContent: &quot;space-between&quot;,<br /> padding: &quot;0 2rem&quot;,<br /> height: &quot;56px&quot;,<br /> boxSizing: &quot;border-box&quot;<br /> });<br /> <br /> /* --- 좌측 --- */<br /> var left = document.createElement(&quot;div&quot;);<br /> s(left, {<br /> display: &quot;flex&quot;,<br /> alignItems: &quot;center&quot;,<br /> gap: &quot;1.75rem&quot;<br /> });<br /> <br /> var logo = document.createElement(&quot;a&quot;);<br /> logo.href = &quot;https://erakh.com&quot;;<br /> logo.textContent = &quot;Erakh Archive&quot;;<br /> logo.style.setProperty(&quot;font-family&quot;, &quot;'Inter', sans-serif&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-size&quot;, &quot;1.125rem&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-weight&quot;, &quot;500&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;color&quot;, &quot;#2a2218&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;text-decoration&quot;, &quot;none&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;letter-spacing&quot;, &quot;0.05em&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;text-transform&quot;, &quot;none&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-variant&quot;, &quot;normal&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-variant-caps&quot;, &quot;normal&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-feature-settings&quot;, &quot;normal&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;line-height&quot;, &quot;1&quot;, &quot;important&quot;);<br /> <br /> var nav = document.createElement(&quot;nav&quot;);<br /> s(nav, { display: &quot;flex&quot;, alignItems: &quot;center&quot;, gap: &quot;1.5rem&quot; });<br /> <br /> var codexLink = document.createElement(&quot;a&quot;);<br /> codexLink.href = &quot;https://codex.erakh.com&quot;;<br /> codexLink.textContent = &quot;Codex&quot;;<br /> s(codexLink, {<br /> fontFamily: &quot;'EB Garamond', serif&quot;,<br /> fontSize: &quot;1rem&quot;,<br /> color: &quot;#6b5e4e&quot;,<br /> textDecoration: &quot;none&quot;,<br /> textTransform: &quot;none&quot;,<br /> fontVariant: &quot;normal&quot;,<br /> lineHeight: &quot;1&quot;<br /> });<br /> codexLink.addEventListener(&quot;mouseover&quot;, function() { this.style.color = &quot;#2a2218&quot;; });<br /> codexLink.addEventListener(&quot;mouseout&quot;, function() { this.style.color = &quot;#6b5e4e&quot;; });<br /> <br /> nav.appendChild(codexLink);<br /> left.appendChild(logo);<br /> left.appendChild(nav);<br /> <br /> /* --- 우측 --- */<br /> var right = document.createElement(&quot;div&quot;);<br /> s(right, { display: &quot;flex&quot;, alignItems: &quot;center&quot; });<br /> <br /> if (user &amp;&amp; user.email) {<br /> /* 로그인 — 아바타 + 드롭다운 */<br /> var profile = document.createElement(&quot;div&quot;);<br /> s(profile, { position: &quot;relative&quot; });<br /> <br /> var avatar = document.createElement(&quot;div&quot;);<br /> avatar.textContent = user.email.slice(0, 1).toUpperCase();<br /> s(avatar, {<br /> width: &quot;32px&quot;,<br /> height: &quot;32px&quot;,<br /> borderRadius: &quot;50%&quot;,<br /> background: &quot;#e2d9c8&quot;,<br /> border: &quot;1px solid #c8b99a&quot;,<br /> display: &quot;flex&quot;,<br /> alignItems: &quot;center&quot;,<br /> justifyContent: &quot;center&quot;,<br /> cursor: &quot;pointer&quot;,<br /> fontFamily: &quot;'Cinzel', serif&quot;,<br /> fontSize: &quot;0.75rem&quot;,<br /> color: &quot;#2a2218&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> fontVariant: &quot;normal&quot;,<br /> textTransform: &quot;none&quot;<br /> });<br /> <br /> var dropdown = document.createElement(&quot;div&quot;);<br /> s(dropdown, {<br /> display: &quot;none&quot;,<br /> position: &quot;absolute&quot;,<br /> top: &quot;calc(100% + 8px)&quot;,<br /> right: &quot;0&quot;,<br /> background: &quot;#f9f6f0&quot;,<br /> border: &quot;1px solid #e2d9c8&quot;,<br /> minWidth: &quot;180px&quot;,<br /> padding: &quot;0.5rem 0&quot;,<br /> boxShadow: &quot;0 4px 16px rgba(0,0,0,0.06)&quot;,<br /> zIndex: &quot;10000&quot;,<br /> boxSizing: &quot;border-box&quot;<br /> });<br /> <br /> var emailDiv = document.createElement(&quot;div&quot;);<br /> emailDiv.textContent = user.email;<br /> s(emailDiv, {<br /> padding: &quot;0.5rem 1rem 0.75rem&quot;,<br /> fontFamily: &quot;'EB Garamond', serif&quot;,<br /> fontSize: &quot;0.875rem&quot;,<br /> color: &quot;#6b5e4e&quot;,<br /> borderBottom: &quot;1px solid #e2d9c8&quot;,<br /> marginBottom: &quot;0.25rem&quot;,<br /> fontStyle: &quot;italic&quot;,<br /> wordBreak: &quot;break-all&quot;<br /> });<br /> <br /> var profileLink = document.createElement(&quot;a&quot;);<br /> profileLink.href = &quot;https://erakh.com/profile&quot;;<br /> profileLink.textContent = &quot;Profile&quot;;<br /> s(profileLink, {<br /> display: &quot;block&quot;,<br /> width: &quot;100%&quot;,<br /> padding: &quot;0.5rem 1rem&quot;,<br /> fontFamily: &quot;'Inter', sans-serif&quot;,<br /> fontSize: &quot;0.8125rem&quot;,<br /> color: &quot;#2a2218&quot;,<br /> textDecoration: &quot;none&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> textTransform: &quot;none&quot;<br /> });<br /> <br /> var signOutBtn = document.createElement(&quot;button&quot;);<br /> signOutBtn.textContent = &quot;Sign out&quot;;<br /> s(signOutBtn, {<br /> display: &quot;block&quot;,<br /> width: &quot;100%&quot;,<br /> padding: &quot;0.5rem 1rem&quot;,<br /> fontFamily: &quot;'Inter', sans-serif&quot;,<br /> fontSize: &quot;0.8125rem&quot;,<br /> color: &quot;#a04040&quot;,<br /> textAlign: &quot;left&quot;,<br /> background: &quot;transparent&quot;,<br /> border: &quot;none&quot;,<br /> cursor: &quot;pointer&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> textTransform: &quot;none&quot;<br /> });<br /> signOutBtn.addEventListener(&quot;click&quot;, function () {<br /> fetch(&quot;https://erakh.com/api/auth/logout&quot;, { method: &quot;POST&quot;, credentials: &quot;include&quot; })<br /> .then(function () { window.location.href = &quot;https://erakh.com&quot;; });<br /> });<br /> <br /> dropdown.appendChild(emailDiv);<br /> dropdown.appendChild(profileLink);<br /> dropdown.appendChild(signOutBtn);<br /> <br /> avatar.addEventListener(&quot;click&quot;, function () {<br /> dropdown.style.display = dropdown.style.display === &quot;none&quot; ? &quot;block&quot; : &quot;none&quot;;<br /> });<br /> document.addEventListener(&quot;click&quot;, function (e) {<br /> if (!profile.contains(e.target)) dropdown.style.display = &quot;none&quot;;<br /> });<br /> <br /> profile.appendChild(avatar);<br /> profile.appendChild(dropdown);<br /> right.appendChild(profile);<br /> <br /> } else {<br /> /* 비로그인 — Sign in */<br /> var loginBtn = document.createElement(&quot;a&quot;);<br /> loginBtn.href = &quot;https://erakh.com/login?redirect=&quot; + encodeURIComponent(window.location.href);<br /> loginBtn.textContent = &quot;Sign in&quot;;<br /> s(loginBtn, {<br /> fontFamily: &quot;'Inter', sans-serif&quot;,<br /> fontSize: &quot;0.8125rem&quot;,<br /> fontWeight: &quot;500&quot;,<br /> color: &quot;#2a2218&quot;,<br /> textDecoration: &quot;none&quot;,<br /> padding: &quot;0.4rem 1rem&quot;,<br /> border: &quot;1px solid #c8b99a&quot;,<br /> background: &quot;transparent&quot;,<br /> cursor: &quot;pointer&quot;,<br /> textTransform: &quot;none&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> lineHeight: &quot;1&quot;<br /> });<br /> loginBtn.addEventListener(&quot;mouseover&quot;, function() {<br /> this.style.borderColor = &quot;#c8a060&quot;;<br /> this.style.background = &quot;#f0ebe0&quot;;<br /> });<br /> loginBtn.addEventListener(&quot;mouseout&quot;, function() {<br /> this.style.borderColor = &quot;#c8b99a&quot;;<br /> this.style.background = &quot;transparent&quot;;<br /> });<br /> right.appendChild(loginBtn);<br /> }<br /> <br /> header.appendChild(left);<br /> header.appendChild(right);<br /> document.body.insertBefore(header, document.body.firstChild);<br /> })();</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.js&diff=13 2026-04-09T03:45:02Z

<p>Juoh: </p> <hr /> <div>(function () {<br /> /* --- Google Fonts 강제 로드 --- */<br /> var fontLink = document.createElement(&quot;link&quot;);<br /> fontLink.rel = &quot;stylesheet&quot;;<br /> fontLink.href = &quot;https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&amp;display=swap&quot;;<br /> document.head.insertBefore(fontLink, document.head.firstChild);<br /> <br /> /* --- 쿠키 읽기 --- */<br /> function getCookie(name) {<br /> var match = document.cookie.match(new RegExp(&quot;(?:^|; )&quot; + name + &quot;=([^;]*)&quot;));<br /> return match ? decodeURIComponent(match[1]) : null;<br /> }<br /> <br /> /* --- 유저 정보 파싱 --- */<br /> var user = null;<br /> try {<br /> var raw = getCookie(&quot;erakh_user&quot;);<br /> if (raw) user = JSON.parse(raw);<br /> } catch (e) {}<br /> <br /> /* --- 인라인 스타일 헬퍼 --- */<br /> function s(el, styles) {<br /> Object.keys(styles).forEach(function(k) { el.style[k] = styles[k]; });<br /> }<br /> <br /> /* --- 헤더 --- */<br /> var header = document.createElement(&quot;header&quot;);<br /> s(header, {<br /> position: &quot;fixed&quot;,<br /> top: &quot;0&quot;,<br /> left: &quot;0&quot;,<br /> right: &quot;0&quot;,<br /> zIndex: &quot;9999&quot;,<br /> width: &quot;100%&quot;,<br /> background: &quot;#f9f6f0&quot;,<br /> borderBottom: &quot;1px solid #e2d9c8&quot;,<br /> display: &quot;flex&quot;,<br /> alignItems: &quot;center&quot;,<br /> justifyContent: &quot;space-between&quot;,<br /> padding: &quot;0 2rem&quot;,<br /> height: &quot;56px&quot;,<br /> boxSizing: &quot;border-box&quot;<br /> });<br /> <br /> /* --- 좌측 --- */<br /> var left = document.createElement(&quot;div&quot;);<br /> s(left, {<br /> display: &quot;flex&quot;,<br /> alignItems: &quot;center&quot;,<br /> gap: &quot;1.75rem&quot;<br /> });<br /> <br /> var logo = document.createElement(&quot;a&quot;);<br /> logo.href = &quot;https://erakh.com&quot;;<br /> logo.textContent = &quot;Erakh Archive&quot;;<br /> logo.style.setProperty(&quot;font-family&quot;, &quot;'Cinzel', serif&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-size&quot;, &quot;1.125rem&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-weight&quot;, &quot;500&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;color&quot;, &quot;#2a2218&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;text-decoration&quot;, &quot;none&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;letter-spacing&quot;, &quot;0.05em&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;text-transform&quot;, &quot;none&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-variant&quot;, &quot;normal&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-variant-caps&quot;, &quot;normal&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-feature-settings&quot;, &quot;normal&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;line-height&quot;, &quot;1&quot;, &quot;important&quot;);<br /> <br /> var nav = document.createElement(&quot;nav&quot;);<br /> s(nav, { display: &quot;flex&quot;, alignItems: &quot;center&quot;, gap: &quot;1.5rem&quot; });<br /> <br /> var codexLink = document.createElement(&quot;a&quot;);<br /> codexLink.href = &quot;https://codex.erakh.com&quot;;<br /> codexLink.textContent = &quot;Codex&quot;;<br /> s(codexLink, {<br /> fontFamily: &quot;'EB Garamond', serif&quot;,<br /> fontSize: &quot;1rem&quot;,<br /> color: &quot;#6b5e4e&quot;,<br /> textDecoration: &quot;none&quot;,<br /> textTransform: &quot;none&quot;,<br /> fontVariant: &quot;normal&quot;,<br /> lineHeight: &quot;1&quot;<br /> });<br /> codexLink.addEventListener(&quot;mouseover&quot;, function() { this.style.color = &quot;#2a2218&quot;; });<br /> codexLink.addEventListener(&quot;mouseout&quot;, function() { this.style.color = &quot;#6b5e4e&quot;; });<br /> <br /> nav.appendChild(codexLink);<br /> left.appendChild(logo);<br /> left.appendChild(nav);<br /> <br /> /* --- 우측 --- */<br /> var right = document.createElement(&quot;div&quot;);<br /> s(right, { display: &quot;flex&quot;, alignItems: &quot;center&quot; });<br /> <br /> if (user &amp;&amp; user.email) {<br /> /* 로그인 — 아바타 + 드롭다운 */<br /> var profile = document.createElement(&quot;div&quot;);<br /> s(profile, { position: &quot;relative&quot; });<br /> <br /> var avatar = document.createElement(&quot;div&quot;);<br /> avatar.textContent = user.email.slice(0, 1).toUpperCase();<br /> s(avatar, {<br /> width: &quot;32px&quot;,<br /> height: &quot;32px&quot;,<br /> borderRadius: &quot;50%&quot;,<br /> background: &quot;#e2d9c8&quot;,<br /> border: &quot;1px solid #c8b99a&quot;,<br /> display: &quot;flex&quot;,<br /> alignItems: &quot;center&quot;,<br /> justifyContent: &quot;center&quot;,<br /> cursor: &quot;pointer&quot;,<br /> fontFamily: &quot;'Cinzel', serif&quot;,<br /> fontSize: &quot;0.75rem&quot;,<br /> color: &quot;#2a2218&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> fontVariant: &quot;normal&quot;,<br /> textTransform: &quot;none&quot;<br /> });<br /> <br /> var dropdown = document.createElement(&quot;div&quot;);<br /> s(dropdown, {<br /> display: &quot;none&quot;,<br /> position: &quot;absolute&quot;,<br /> top: &quot;calc(100% + 8px)&quot;,<br /> right: &quot;0&quot;,<br /> background: &quot;#f9f6f0&quot;,<br /> border: &quot;1px solid #e2d9c8&quot;,<br /> minWidth: &quot;180px&quot;,<br /> padding: &quot;0.5rem 0&quot;,<br /> boxShadow: &quot;0 4px 16px rgba(0,0,0,0.06)&quot;,<br /> zIndex: &quot;10000&quot;,<br /> boxSizing: &quot;border-box&quot;<br /> });<br /> <br /> var emailDiv = document.createElement(&quot;div&quot;);<br /> emailDiv.textContent = user.email;<br /> s(emailDiv, {<br /> padding: &quot;0.5rem 1rem 0.75rem&quot;,<br /> fontFamily: &quot;'EB Garamond', serif&quot;,<br /> fontSize: &quot;0.875rem&quot;,<br /> color: &quot;#6b5e4e&quot;,<br /> borderBottom: &quot;1px solid #e2d9c8&quot;,<br /> marginBottom: &quot;0.25rem&quot;,<br /> fontStyle: &quot;italic&quot;,<br /> wordBreak: &quot;break-all&quot;<br /> });<br /> <br /> var profileLink = document.createElement(&quot;a&quot;);<br /> profileLink.href = &quot;https://erakh.com/profile&quot;;<br /> profileLink.textContent = &quot;Profile&quot;;<br /> s(profileLink, {<br /> display: &quot;block&quot;,<br /> width: &quot;100%&quot;,<br /> padding: &quot;0.5rem 1rem&quot;,<br /> fontFamily: &quot;'Inter', sans-serif&quot;,<br /> fontSize: &quot;0.8125rem&quot;,<br /> color: &quot;#2a2218&quot;,<br /> textDecoration: &quot;none&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> textTransform: &quot;none&quot;<br /> });<br /> <br /> var signOutBtn = document.createElement(&quot;button&quot;);<br /> signOutBtn.textContent = &quot;Sign out&quot;;<br /> s(signOutBtn, {<br /> display: &quot;block&quot;,<br /> width: &quot;100%&quot;,<br /> padding: &quot;0.5rem 1rem&quot;,<br /> fontFamily: &quot;'Inter', sans-serif&quot;,<br /> fontSize: &quot;0.8125rem&quot;,<br /> color: &quot;#a04040&quot;,<br /> textAlign: &quot;left&quot;,<br /> background: &quot;transparent&quot;,<br /> border: &quot;none&quot;,<br /> cursor: &quot;pointer&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> textTransform: &quot;none&quot;<br /> });<br /> signOutBtn.addEventListener(&quot;click&quot;, function () {<br /> fetch(&quot;https://erakh.com/api/auth/logout&quot;, { method: &quot;POST&quot;, credentials: &quot;include&quot; })<br /> .then(function () { window.location.href = &quot;https://erakh.com&quot;; });<br /> });<br /> <br /> dropdown.appendChild(emailDiv);<br /> dropdown.appendChild(profileLink);<br /> dropdown.appendChild(signOutBtn);<br /> <br /> avatar.addEventListener(&quot;click&quot;, function () {<br /> dropdown.style.display = dropdown.style.display === &quot;none&quot; ? &quot;block&quot; : &quot;none&quot;;<br /> });<br /> document.addEventListener(&quot;click&quot;, function (e) {<br /> if (!profile.contains(e.target)) dropdown.style.display = &quot;none&quot;;<br /> });<br /> <br /> profile.appendChild(avatar);<br /> profile.appendChild(dropdown);<br /> right.appendChild(profile);<br /> <br /> } else {<br /> /* 비로그인 — Sign in */<br /> var loginBtn = document.createElement(&quot;a&quot;);<br /> loginBtn.href = &quot;https://erakh.com/login?redirect=&quot; + encodeURIComponent(window.location.href);<br /> loginBtn.textContent = &quot;Sign in&quot;;<br /> s(loginBtn, {<br /> fontFamily: &quot;'Inter', sans-serif&quot;,<br /> fontSize: &quot;0.8125rem&quot;,<br /> fontWeight: &quot;500&quot;,<br /> color: &quot;#2a2218&quot;,<br /> textDecoration: &quot;none&quot;,<br /> padding: &quot;0.4rem 1rem&quot;,<br /> border: &quot;1px solid #c8b99a&quot;,<br /> background: &quot;transparent&quot;,<br /> cursor: &quot;pointer&quot;,<br /> textTransform: &quot;none&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> lineHeight: &quot;1&quot;<br /> });<br /> loginBtn.addEventListener(&quot;mouseover&quot;, function() {<br /> this.style.borderColor = &quot;#c8a060&quot;;<br /> this.style.background = &quot;#f0ebe0&quot;;<br /> });<br /> loginBtn.addEventListener(&quot;mouseout&quot;, function() {<br /> this.style.borderColor = &quot;#c8b99a&quot;;<br /> this.style.background = &quot;transparent&quot;;<br /> });<br /> right.appendChild(loginBtn);<br /> }<br /> <br /> header.appendChild(left);<br /> header.appendChild(right);<br /> document.body.insertBefore(header, document.body.firstChild);<br /> })();</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.css&diff=12 2026-04-09T03:44:33Z

<p>Juoh: </p> <hr /> <div>@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&amp;display=swap');<br /> <br /> /* =============================================<br /> ERAKH CODEX — Common.css<br /> ============================================= */<br /> <br /> :root {<br /> --bg: #f9f6f0;<br /> --beige-1: #f0ebe0;<br /> --beige-2: #e2d9c8;<br /> --beige-3: #c8b99a;<br /> --beige-4: #a89070;<br /> --gold: #c8a060;<br /> --gold-dark: #a07840;<br /> --ink: #2a2218;<br /> --ink-soft: #6b5e4e;<br /> --ink-muted: #9c8e80;<br /> --surface: #ffffff;<br /> }<br /> <br /> /* === Base === */<br /> body {<br /> background-color: var(--bg) !important;<br /> color: var(--ink) !important;<br /> font-family: 'Inter', sans-serif !important;<br /> font-size: 16px !important;<br /> line-height: 1.7 !important;<br /> padding-top: 56px !important;<br /> }<br /> <br /> /* === 제목 === */<br /> h1, h2, h3, h4, h5, h6,<br /> .firstHeading, #firstHeading {<br /> font-family: 'Inter', sans-serif !important;<br /> color: var(--ink) !important;<br /> font-weight: 600 !important;<br /> letter-spacing: -0.01em !important;<br /> }<br /> <br /> /* === 링크 — 본문만 === */<br /> #bodyContent a,<br /> #bodyContent a:visited,<br /> #footer a {<br /> color: var(--gold-dark) !important;<br /> text-decoration: none !important;<br /> }<br /> #bodyContent a:hover,<br /> #footer a:hover {<br /> color: var(--gold) !important;<br /> text-decoration: underline !important;<br /> }<br /> <br /> /* === Vector UI 전부 숨김 === */<br /> #mw-head,<br /> #mw-panel,<br /> #p-logo,<br /> #mw-navigation,<br /> #mw-head-base,<br /> #mw-page-base {<br /> display: none !important;<br /> }<br /> <br /> /* === 본문 영역 === */<br /> #content,<br /> .mw-body {<br /> margin: 0 auto !important;<br /> max-width: 860px !important;<br /> padding: 2rem 2rem 4rem !important;<br /> background: var(--bg) !important;<br /> border: none !important;<br /> box-shadow: none !important;<br /> outline: none !important;<br /> }<br /> <br /> .mw-body-content {<br /> border: none !important;<br /> outline: none !important;<br /> }<br /> <br /> #bodyContent {<br /> margin-top: 1.5rem !important;<br /> }<br /> <br /> /* === 푸터 === */<br /> #footer {<br /> background-color: var(--beige-1) !important;<br /> border-top: 1px solid var(--beige-2) !important;<br /> color: var(--ink-muted) !important;<br /> font-family: 'Inter', sans-serif !important;<br /> font-size: 13px !important;<br /> }<br /> <br /> /* === 위키테이블 === */<br /> table.wikitable {<br /> background-color: var(--surface) !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> table.wikitable th {<br /> background-color: var(--beige-1) !important;<br /> color: var(--ink) !important;<br /> font-family: 'Inter', sans-serif !important;<br /> font-weight: 600 !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> table.wikitable td {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* === 구분선 === */<br /> hr {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* === 카테고리 === */<br /> #catlinks {<br /> background-color: var(--beige-1) !important;<br /> border: 1px solid var(--beige-2) !important;<br /> border-radius: 4px !important;<br /> font-family: 'Inter', sans-serif !important;<br /> color: var(--ink-soft) !important;<br /> }</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.js&diff=11 2026-04-09T03:08:21Z

<p>Juoh: </p> <hr /> <div>(function () {<br /> /* --- Google Fonts 강제 로드 --- */<br /> var fontLink = document.createElement(&quot;link&quot;);<br /> fontLink.rel = &quot;stylesheet&quot;;<br /> fontLink.href = &quot;https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&amp;family=EB+Garamond:ital,wght@0,400;0,500;1,400&amp;family=Inter:wght@400;500&amp;display=swap&quot;;<br /> document.head.insertBefore(fontLink, document.head.firstChild);<br /> <br /> /* --- 쿠키 읽기 --- */<br /> function getCookie(name) {<br /> var match = document.cookie.match(new RegExp(&quot;(?:^|; )&quot; + name + &quot;=([^;]*)&quot;));<br /> return match ? decodeURIComponent(match[1]) : null;<br /> }<br /> <br /> /* --- 유저 정보 파싱 --- */<br /> var user = null;<br /> try {<br /> var raw = getCookie(&quot;erakh_user&quot;);<br /> if (raw) user = JSON.parse(raw);<br /> } catch (e) {}<br /> <br /> /* --- 인라인 스타일 헬퍼 --- */<br /> function s(el, styles) {<br /> Object.keys(styles).forEach(function(k) { el.style[k] = styles[k]; });<br /> }<br /> <br /> /* --- 헤더 --- */<br /> var header = document.createElement(&quot;header&quot;);<br /> s(header, {<br /> position: &quot;fixed&quot;,<br /> top: &quot;0&quot;,<br /> left: &quot;0&quot;,<br /> right: &quot;0&quot;,<br /> zIndex: &quot;9999&quot;,<br /> width: &quot;100%&quot;,<br /> background: &quot;#f9f6f0&quot;,<br /> borderBottom: &quot;1px solid #e2d9c8&quot;,<br /> display: &quot;flex&quot;,<br /> alignItems: &quot;center&quot;,<br /> justifyContent: &quot;space-between&quot;,<br /> padding: &quot;0 2rem&quot;,<br /> height: &quot;56px&quot;,<br /> boxSizing: &quot;border-box&quot;<br /> });<br /> <br /> /* --- 좌측 --- */<br /> var left = document.createElement(&quot;div&quot;);<br /> s(left, {<br /> display: &quot;flex&quot;,<br /> alignItems: &quot;center&quot;,<br /> gap: &quot;1.75rem&quot;<br /> });<br /> <br /> var logo = document.createElement(&quot;a&quot;);<br /> logo.href = &quot;https://erakh.com&quot;;<br /> logo.textContent = &quot;Erakh Archive&quot;;<br /> logo.style.setProperty(&quot;font-family&quot;, &quot;'Cinzel', serif&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-size&quot;, &quot;1.125rem&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-weight&quot;, &quot;500&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;color&quot;, &quot;#2a2218&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;text-decoration&quot;, &quot;none&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;letter-spacing&quot;, &quot;0.05em&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;text-transform&quot;, &quot;none&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-variant&quot;, &quot;normal&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-variant-caps&quot;, &quot;normal&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;font-feature-settings&quot;, &quot;normal&quot;, &quot;important&quot;);<br /> logo.style.setProperty(&quot;line-height&quot;, &quot;1&quot;, &quot;important&quot;);<br /> <br /> var nav = document.createElement(&quot;nav&quot;);<br /> s(nav, { display: &quot;flex&quot;, alignItems: &quot;center&quot;, gap: &quot;1.5rem&quot; });<br /> <br /> var codexLink = document.createElement(&quot;a&quot;);<br /> codexLink.href = &quot;https://codex.erakh.com&quot;;<br /> codexLink.textContent = &quot;Codex&quot;;<br /> s(codexLink, {<br /> fontFamily: &quot;'EB Garamond', serif&quot;,<br /> fontSize: &quot;1rem&quot;,<br /> color: &quot;#6b5e4e&quot;,<br /> textDecoration: &quot;none&quot;,<br /> textTransform: &quot;none&quot;,<br /> fontVariant: &quot;normal&quot;,<br /> lineHeight: &quot;1&quot;<br /> });<br /> codexLink.addEventListener(&quot;mouseover&quot;, function() { this.style.color = &quot;#2a2218&quot;; });<br /> codexLink.addEventListener(&quot;mouseout&quot;, function() { this.style.color = &quot;#6b5e4e&quot;; });<br /> <br /> nav.appendChild(codexLink);<br /> left.appendChild(logo);<br /> left.appendChild(nav);<br /> <br /> /* --- 우측 --- */<br /> var right = document.createElement(&quot;div&quot;);<br /> s(right, { display: &quot;flex&quot;, alignItems: &quot;center&quot; });<br /> <br /> if (user &amp;&amp; user.email) {<br /> /* 로그인 — 아바타 + 드롭다운 */<br /> var profile = document.createElement(&quot;div&quot;);<br /> s(profile, { position: &quot;relative&quot; });<br /> <br /> var avatar = document.createElement(&quot;div&quot;);<br /> avatar.textContent = user.email.slice(0, 1).toUpperCase();<br /> s(avatar, {<br /> width: &quot;32px&quot;,<br /> height: &quot;32px&quot;,<br /> borderRadius: &quot;50%&quot;,<br /> background: &quot;#e2d9c8&quot;,<br /> border: &quot;1px solid #c8b99a&quot;,<br /> display: &quot;flex&quot;,<br /> alignItems: &quot;center&quot;,<br /> justifyContent: &quot;center&quot;,<br /> cursor: &quot;pointer&quot;,<br /> fontFamily: &quot;'Cinzel', serif&quot;,<br /> fontSize: &quot;0.75rem&quot;,<br /> color: &quot;#2a2218&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> fontVariant: &quot;normal&quot;,<br /> textTransform: &quot;none&quot;<br /> });<br /> <br /> var dropdown = document.createElement(&quot;div&quot;);<br /> s(dropdown, {<br /> display: &quot;none&quot;,<br /> position: &quot;absolute&quot;,<br /> top: &quot;calc(100% + 8px)&quot;,<br /> right: &quot;0&quot;,<br /> background: &quot;#f9f6f0&quot;,<br /> border: &quot;1px solid #e2d9c8&quot;,<br /> minWidth: &quot;180px&quot;,<br /> padding: &quot;0.5rem 0&quot;,<br /> boxShadow: &quot;0 4px 16px rgba(0,0,0,0.06)&quot;,<br /> zIndex: &quot;10000&quot;,<br /> boxSizing: &quot;border-box&quot;<br /> });<br /> <br /> var emailDiv = document.createElement(&quot;div&quot;);<br /> emailDiv.textContent = user.email;<br /> s(emailDiv, {<br /> padding: &quot;0.5rem 1rem 0.75rem&quot;,<br /> fontFamily: &quot;'EB Garamond', serif&quot;,<br /> fontSize: &quot;0.875rem&quot;,<br /> color: &quot;#6b5e4e&quot;,<br /> borderBottom: &quot;1px solid #e2d9c8&quot;,<br /> marginBottom: &quot;0.25rem&quot;,<br /> fontStyle: &quot;italic&quot;,<br /> wordBreak: &quot;break-all&quot;<br /> });<br /> <br /> var profileLink = document.createElement(&quot;a&quot;);<br /> profileLink.href = &quot;https://erakh.com/profile&quot;;<br /> profileLink.textContent = &quot;Profile&quot;;<br /> s(profileLink, {<br /> display: &quot;block&quot;,<br /> width: &quot;100%&quot;,<br /> padding: &quot;0.5rem 1rem&quot;,<br /> fontFamily: &quot;'Inter', sans-serif&quot;,<br /> fontSize: &quot;0.8125rem&quot;,<br /> color: &quot;#2a2218&quot;,<br /> textDecoration: &quot;none&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> textTransform: &quot;none&quot;<br /> });<br /> <br /> var signOutBtn = document.createElement(&quot;button&quot;);<br /> signOutBtn.textContent = &quot;Sign out&quot;;<br /> s(signOutBtn, {<br /> display: &quot;block&quot;,<br /> width: &quot;100%&quot;,<br /> padding: &quot;0.5rem 1rem&quot;,<br /> fontFamily: &quot;'Inter', sans-serif&quot;,<br /> fontSize: &quot;0.8125rem&quot;,<br /> color: &quot;#a04040&quot;,<br /> textAlign: &quot;left&quot;,<br /> background: &quot;transparent&quot;,<br /> border: &quot;none&quot;,<br /> cursor: &quot;pointer&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> textTransform: &quot;none&quot;<br /> });<br /> signOutBtn.addEventListener(&quot;click&quot;, function () {<br /> fetch(&quot;https://erakh.com/api/auth/logout&quot;, { method: &quot;POST&quot;, credentials: &quot;include&quot; })<br /> .then(function () { window.location.href = &quot;https://erakh.com&quot;; });<br /> });<br /> <br /> dropdown.appendChild(emailDiv);<br /> dropdown.appendChild(profileLink);<br /> dropdown.appendChild(signOutBtn);<br /> <br /> avatar.addEventListener(&quot;click&quot;, function () {<br /> dropdown.style.display = dropdown.style.display === &quot;none&quot; ? &quot;block&quot; : &quot;none&quot;;<br /> });<br /> document.addEventListener(&quot;click&quot;, function (e) {<br /> if (!profile.contains(e.target)) dropdown.style.display = &quot;none&quot;;<br /> });<br /> <br /> profile.appendChild(avatar);<br /> profile.appendChild(dropdown);<br /> right.appendChild(profile);<br /> <br /> } else {<br /> /* 비로그인 — Sign in */<br /> var loginBtn = document.createElement(&quot;a&quot;);<br /> loginBtn.href = &quot;https://erakh.com/login?redirect=&quot; + encodeURIComponent(window.location.href);<br /> loginBtn.textContent = &quot;Sign in&quot;;<br /> s(loginBtn, {<br /> fontFamily: &quot;'Inter', sans-serif&quot;,<br /> fontSize: &quot;0.8125rem&quot;,<br /> fontWeight: &quot;500&quot;,<br /> color: &quot;#2a2218&quot;,<br /> textDecoration: &quot;none&quot;,<br /> padding: &quot;0.4rem 1rem&quot;,<br /> border: &quot;1px solid #c8b99a&quot;,<br /> background: &quot;transparent&quot;,<br /> cursor: &quot;pointer&quot;,<br /> textTransform: &quot;none&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> lineHeight: &quot;1&quot;<br /> });<br /> loginBtn.addEventListener(&quot;mouseover&quot;, function() {<br /> this.style.borderColor = &quot;#c8a060&quot;;<br /> this.style.background = &quot;#f0ebe0&quot;;<br /> });<br /> loginBtn.addEventListener(&quot;mouseout&quot;, function() {<br /> this.style.borderColor = &quot;#c8b99a&quot;;<br /> this.style.background = &quot;transparent&quot;;<br /> });<br /> right.appendChild(loginBtn);<br /> }<br /> <br /> header.appendChild(left);<br /> header.appendChild(right);<br /> document.body.insertBefore(header, document.body.firstChild);<br /> })();</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.css&diff=10 2026-04-09T03:06:55Z

<p>Juoh: </p> <hr /> <div>@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&amp;family=EB+Garamond:ital,wght@0,400;0,500;1,400&amp;display=swap');<br /> <br /> /* =============================================<br /> ERAKH CODEX — Common.css<br /> ============================================= */<br /> <br /> :root {<br /> --bg: #f9f6f0;<br /> --beige-1: #f0ebe0;<br /> --beige-2: #e2d9c8;<br /> --beige-3: #c8b99a;<br /> --beige-4: #a89070;<br /> --gold: #c8a060;<br /> --gold-dark: #a07840;<br /> --ink: #2a2218;<br /> --ink-soft: #6b5e4e;<br /> --ink-muted: #9c8e80;<br /> --surface: #ffffff;<br /> }<br /> <br /> /* === Base === */<br /> body {<br /> background-color: var(--bg) !important;<br /> color: var(--ink) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 18px !important;<br /> line-height: 1.7 !important;<br /> padding-top: 56px !important;<br /> }<br /> <br /> /* === 제목 === */<br /> h1, h2, h3, h4, h5, h6,<br /> .firstHeading, #firstHeading {<br /> font-family: 'Cinzel', serif !important;<br /> color: var(--ink) !important;<br /> font-weight: 500 !important;<br /> letter-spacing: 0.02em !important;<br /> }<br /> <br /> /* === 링크 — 헤더 제외 === */<br /> #bodyContent a,<br /> #bodyContent a:visited,<br /> #footer a {<br /> color: var(--gold-dark) !important;<br /> text-decoration: none !important;<br /> }<br /> #bodyContent a:hover,<br /> #footer a:hover {<br /> color: var(--gold) !important;<br /> text-decoration: underline !important;<br /> }<br /> <br /> /* === Vector UI 전부 숨김 === */<br /> #mw-head,<br /> #mw-panel,<br /> #p-logo,<br /> #mw-navigation,<br /> #mw-head-base,<br /> #mw-page-base {<br /> display: none !important;<br /> }<br /> <br /> /* === 본문 영역 === */<br /> #content,<br /> .mw-body {<br /> margin: 0 auto !important;<br /> margin-left: auto !important;<br /> max-width: 860px !important;<br /> padding: 2rem 2rem 4rem !important;<br /> background: var(--bg) !important;<br /> border: none !important;<br /> box-shadow: none !important;<br /> outline: none !important;<br /> }<br /> <br /> .mw-body-content {<br /> border: none !important;<br /> outline: none !important;<br /> }<br /> <br /> #bodyContent {<br /> margin-top: 1.5rem !important;<br /> }<br /> <br /> /* === 푸터 === */<br /> #footer {<br /> background-color: var(--beige-1) !important;<br /> border-top: 1px solid var(--beige-2) !important;<br /> color: var(--ink-muted) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 14px !important;<br /> }<br /> <br /> /* === 위키테이블 === */<br /> table.wikitable {<br /> background-color: var(--surface) !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> table.wikitable th {<br /> background-color: var(--beige-1) !important;<br /> color: var(--ink) !important;<br /> font-family: 'Cinzel', serif !important;<br /> font-weight: 500 !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> table.wikitable td {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* === 구분선 === */<br /> hr {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* === 카테고리 === */<br /> #catlinks {<br /> background-color: var(--beige-1) !important;<br /> border: 1px solid var(--beige-2) !important;<br /> border-radius: 4px !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> color: var(--ink-soft) !important;<br /> }</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.css&diff=9 2026-04-09T02:50:35Z

<p>Juoh: </p> <hr /> <div>@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&amp;family=EB+Garamond:ital,wght@0,400;0,500;1,400&amp;display=swap');<br /> <br /> /* =============================================<br /> ERAKH CODEX — Common.css<br /> erakh.com 디자인 시스템 기준 (라이트 모드)<br /> ============================================= */<br /> <br /> :root {<br /> --bg: #f9f6f0;<br /> --beige-1: #f0ebe0;<br /> --beige-2: #e2d9c8;<br /> --beige-3: #c8b99a;<br /> --beige-4: #a89070;<br /> --gold: #c8a060;<br /> --gold-dark: #a07840;<br /> --ink: #2a2218;<br /> --ink-soft: #6b5e4e;<br /> --ink-muted: #9c8e80;<br /> --surface: #ffffff;<br /> }<br /> <br /> /* === Base === */<br /> body {<br /> background-color: var(--bg) !important;<br /> color: var(--ink) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 18px !important;<br /> line-height: 1.7 !important;<br /> }<br /> <br /> /* === 제목 === */<br /> h1, h2, h3, h4, h5, h6,<br /> .firstHeading, #firstHeading {<br /> font-family: 'Cinzel', serif !important;<br /> color: var(--ink) !important;<br /> font-weight: 500 !important;<br /> letter-spacing: 0.02em !important;<br /> }<br /> <br /> /* === 링크 === */<br /> a, a:visited {<br /> color: var(--gold-dark) !important;<br /> text-decoration: none !important;<br /> }<br /> a:hover {<br /> color: var(--gold) !important;<br /> text-decoration: underline !important;<br /> }<br /> <br /> /* === 페이지 배경 === */<br /> #mw-page-base,<br /> #mw-head-base {<br /> background-color: var(--beige-1) !important;<br /> }<br /> <br /> /* === 본문 영역 === */<br /> #content,<br /> .mw-body {<br /> background-color: var(--bg) !important;<br /> border: none !important;<br /> color: var(--ink) !important;<br /> box-shadow: none !important;<br /> }<br /> <br /> /* === 사이드바 === */<br /> #mw-panel {<br /> background-color: transparent !important;<br /> }<br /> <br /> .vector-menu-portal h3,<br /> #p-navigation h3,<br /> #p-tb h3 {<br /> font-family: 'Cinzel', serif !important;<br /> font-size: 10px !important;<br /> letter-spacing: 0.12em !important;<br /> text-transform: uppercase !important;<br /> color: var(--ink-muted) !important;<br /> border-bottom: 1px solid var(--beige-2) !important;<br /> padding-bottom: 4px !important;<br /> }<br /> <br /> .vector-menu-portal ul li a,<br /> #p-navigation ul li a,<br /> #p-tb ul li a {<br /> color: var(--ink-soft) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 16px !important;<br /> }<br /> <br /> .vector-menu-portal ul li a:hover,<br /> #p-navigation ul li a:hover,<br /> #p-tb ul li a:hover {<br /> color: var(--gold) !important;<br /> }<br /> <br /> /* === 헤더 / 탭 === */<br /> #mw-head {<br /> background-color: var(--beige-1) !important;<br /> }<br /> <br /> .vector-menu-tabs a,<br /> #p-namespaces ul li a,<br /> #p-views ul li a {<br /> font-family: 'Cinzel', serif !important;<br /> font-size: 12px !important;<br /> letter-spacing: 0.05em !important;<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> li.selected a {<br /> color: var(--ink) !important;<br /> }<br /> <br /> /* === 검색창 === */<br /> #searchInput {<br /> background-color: var(--beige-1) !important;<br /> border: 1px solid var(--beige-3) !important;<br /> color: var(--ink) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> border-radius: 4px !important;<br /> }<br /> <br /> /* === 카테고리 === */<br /> #catlinks {<br /> background-color: var(--beige-1) !important;<br /> border: 1px solid var(--beige-2) !important;<br /> border-radius: 4px !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> /* === 푸터 === */<br /> #footer {<br /> background-color: var(--beige-1) !important;<br /> border-top: 1px solid var(--beige-2) !important;<br /> color: var(--ink-muted) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 14px !important;<br /> }<br /> <br /> #footer a {<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> /* === 위키테이블 === */<br /> table.wikitable {<br /> background-color: var(--surface) !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> table.wikitable th {<br /> background-color: var(--beige-1) !important;<br /> color: var(--ink) !important;<br /> font-family: 'Cinzel', serif !important;<br /> font-weight: 500 !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> table.wikitable td {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* === 구분선 === */<br /> hr {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* =============================================<br /> LAYOUT — 기본 Vector UI 제거 + 풀width<br /> ============================================= */<br /> <br /> /* 기존 헤더/사이드바/로고 전부 숨김 */<br /> #mw-head,<br /> #mw-panel,<br /> #p-logo,<br /> #mw-navigation,<br /> #mw-head-base,<br /> #mw-page-base {<br /> display: none !important;<br /> }<br /> <br /> /* 본문 풀width */<br /> #mw-page-base { display: none !important; }<br /> <br /> #content,<br /> .mw-body {<br /> margin-left: 0 !important;<br /> margin-top: 0 !important;<br /> border-left: none !important;<br /> border-right: none !important;<br /> border-top: none !important;<br /> max-width: 860px !important;<br /> margin: 0 auto !important;<br /> padding: 2rem 2rem 4rem !important;<br /> background: var(--surface) !important;<br /> }<br /> <br /> #bodyContent {<br /> margin-top: 1.5rem !important;<br /> }<br /> <br /> /* 전체 페이지 배경 */<br /> body {<br /> padding-top: 56px !important;<br /> }<br /> <br /> /* === 헤더 예외 처리 === */<br /> .erakh-logo,<br /> .erakh-logo:visited {<br /> color: var(--ink, #2a2218) !important;<br /> text-transform: none !important;<br /> font-variant: normal !important;<br /> }<br /> <br /> .erakh-nav a,<br /> .erakh-nav a:visited {<br /> color: var(--ink-soft, #6b5e4e) !important;<br /> text-transform: none !important;<br /> }<br /> <br /> .erakh-nav a:hover {<br /> color: var(--ink, #2a2218) !important;<br /> }<br /> <br /> .erakh-header {<br /> overflow: visible !important;<br /> }<br /> <br /> .erakh-login-btn,<br /> .erakh-login-btn:visited {<br /> color: var(--ink, #2a2218) !important;<br /> text-transform: none !important;<br /> }<br /> <br /> /* 본문 좌측 border 제거 */<br /> #content,<br /> .mw-body,<br /> .mw-body-content {<br /> border: none !important;<br /> outline: none !important;<br /> }<br /> <br /> /* 헤더 로고 font-variant 강제 초기화 */<br /> .erakh-logo,<br /> .erakh-logo * {<br /> font-variant: normal !important;<br /> font-variant-caps: normal !important;<br /> font-feature-settings: normal !important;<br /> -webkit-font-feature-settings: normal !important;<br /> text-transform: none !important;<br /> }</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.css&diff=8 2026-04-09T02:49:23Z

<p>Juoh: </p> <hr /> <div>@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&amp;family=EB+Garamond:ital,wght@0,400;0,500;1,400&amp;display=swap');<br /> <br /> /* =============================================<br /> ERAKH CODEX — Common.css<br /> erakh.com 디자인 시스템 기준 (라이트 모드)<br /> ============================================= */<br /> <br /> :root {<br /> --bg: #f9f6f0;<br /> --beige-1: #f0ebe0;<br /> --beige-2: #e2d9c8;<br /> --beige-3: #c8b99a;<br /> --beige-4: #a89070;<br /> --gold: #c8a060;<br /> --gold-dark: #a07840;<br /> --ink: #2a2218;<br /> --ink-soft: #6b5e4e;<br /> --ink-muted: #9c8e80;<br /> --surface: #ffffff;<br /> }<br /> <br /> /* === Base === */<br /> body {<br /> background-color: var(--bg) !important;<br /> color: var(--ink) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 18px !important;<br /> line-height: 1.7 !important;<br /> }<br /> <br /> /* === 제목 === */<br /> h1, h2, h3, h4, h5, h6,<br /> .firstHeading, #firstHeading {<br /> font-family: 'Cinzel', serif !important;<br /> color: var(--ink) !important;<br /> font-weight: 500 !important;<br /> letter-spacing: 0.02em !important;<br /> }<br /> <br /> /* === 링크 === */<br /> a, a:visited {<br /> color: var(--gold-dark) !important;<br /> text-decoration: none !important;<br /> }<br /> a:hover {<br /> color: var(--gold) !important;<br /> text-decoration: underline !important;<br /> }<br /> <br /> /* === 페이지 배경 === */<br /> #mw-page-base,<br /> #mw-head-base {<br /> background-color: var(--beige-1) !important;<br /> }<br /> <br /> /* === 본문 영역 === */<br /> #content,<br /> .mw-body {<br /> background-color: var(--bg) !important;<br /> border: none !important;<br /> color: var(--ink) !important;<br /> box-shadow: none !important;<br /> }<br /> <br /> /* === 사이드바 === */<br /> #mw-panel {<br /> background-color: transparent !important;<br /> }<br /> <br /> .vector-menu-portal h3,<br /> #p-navigation h3,<br /> #p-tb h3 {<br /> font-family: 'Cinzel', serif !important;<br /> font-size: 10px !important;<br /> letter-spacing: 0.12em !important;<br /> text-transform: uppercase !important;<br /> color: var(--ink-muted) !important;<br /> border-bottom: 1px solid var(--beige-2) !important;<br /> padding-bottom: 4px !important;<br /> }<br /> <br /> .vector-menu-portal ul li a,<br /> #p-navigation ul li a,<br /> #p-tb ul li a {<br /> color: var(--ink-soft) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 16px !important;<br /> }<br /> <br /> .vector-menu-portal ul li a:hover,<br /> #p-navigation ul li a:hover,<br /> #p-tb ul li a:hover {<br /> color: var(--gold) !important;<br /> }<br /> <br /> /* === 헤더 / 탭 === */<br /> #mw-head {<br /> background-color: var(--beige-1) !important;<br /> }<br /> <br /> .vector-menu-tabs a,<br /> #p-namespaces ul li a,<br /> #p-views ul li a {<br /> font-family: 'Cinzel', serif !important;<br /> font-size: 12px !important;<br /> letter-spacing: 0.05em !important;<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> li.selected a {<br /> color: var(--ink) !important;<br /> }<br /> <br /> /* === 검색창 === */<br /> #searchInput {<br /> background-color: var(--beige-1) !important;<br /> border: 1px solid var(--beige-3) !important;<br /> color: var(--ink) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> border-radius: 4px !important;<br /> }<br /> <br /> /* === 카테고리 === */<br /> #catlinks {<br /> background-color: var(--beige-1) !important;<br /> border: 1px solid var(--beige-2) !important;<br /> border-radius: 4px !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> /* === 푸터 === */<br /> #footer {<br /> background-color: var(--beige-1) !important;<br /> border-top: 1px solid var(--beige-2) !important;<br /> color: var(--ink-muted) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 14px !important;<br /> }<br /> <br /> #footer a {<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> /* === 위키테이블 === */<br /> table.wikitable {<br /> background-color: var(--surface) !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> table.wikitable th {<br /> background-color: var(--beige-1) !important;<br /> color: var(--ink) !important;<br /> font-family: 'Cinzel', serif !important;<br /> font-weight: 500 !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> table.wikitable td {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* === 구분선 === */<br /> hr {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* =============================================<br /> LAYOUT — 기본 Vector UI 제거 + 풀width<br /> ============================================= */<br /> <br /> /* 기존 헤더/사이드바/로고 전부 숨김 */<br /> #mw-head,<br /> #mw-panel,<br /> #p-logo,<br /> #mw-navigation,<br /> #mw-head-base,<br /> #mw-page-base {<br /> display: none !important;<br /> }<br /> <br /> /* 본문 풀width */<br /> #mw-page-base { display: none !important; }<br /> <br /> #content,<br /> .mw-body {<br /> margin-left: 0 !important;<br /> margin-top: 0 !important;<br /> border-left: none !important;<br /> border-right: none !important;<br /> border-top: none !important;<br /> max-width: 860px !important;<br /> margin: 0 auto !important;<br /> padding: 2rem 2rem 4rem !important;<br /> background: var(--surface) !important;<br /> }<br /> <br /> #bodyContent {<br /> margin-top: 1.5rem !important;<br /> }<br /> <br /> /* 전체 페이지 배경 */<br /> body {<br /> padding-top: 56px !important;<br /> }<br /> <br /> /* === 헤더 예외 처리 === */<br /> .erakh-logo,<br /> .erakh-logo:visited {<br /> color: var(--ink, #2a2218) !important;<br /> text-transform: none !important;<br /> font-variant: normal !important;<br /> }<br /> <br /> .erakh-nav a,<br /> .erakh-nav a:visited {<br /> color: var(--ink-soft, #6b5e4e) !important;<br /> text-transform: none !important;<br /> }<br /> <br /> .erakh-nav a:hover {<br /> color: var(--ink, #2a2218) !important;<br /> }<br /> <br /> .erakh-header {<br /> overflow: visible !important;<br /> }<br /> <br /> .erakh-login-btn,<br /> .erakh-login-btn:visited {<br /> color: var(--ink, #2a2218) !important;<br /> text-transform: none !important;<br /> }</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.js&diff=7 2026-04-09T02:34:41Z

<p>Juoh: </p> <hr /> <div>(function () {<br /> /* --- Google Fonts 강제 로드 --- */<br /> var fontLink = document.createElement(&quot;link&quot;);<br /> fontLink.rel = &quot;stylesheet&quot;;<br /> fontLink.href = &quot;https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&amp;family=EB+Garamond:ital,wght@0,400;0,500;1,400&amp;family=Inter:wght@400;500&amp;display=swap&quot;;<br /> document.head.insertBefore(fontLink, document.head.firstChild);<br /> <br /> /* --- 쿠키 읽기 --- */<br /> function getCookie(name) {<br /> var match = document.cookie.match(new RegExp(&quot;(?:^|; )&quot; + name + &quot;=([^;]*)&quot;));<br /> return match ? decodeURIComponent(match[1]) : null;<br /> }<br /> <br /> /* --- 유저 정보 파싱 --- */<br /> var user = null;<br /> try {<br /> var raw = getCookie(&quot;erakh_user&quot;);<br /> if (raw) user = JSON.parse(raw);<br /> } catch (e) {}<br /> <br /> /* --- 인라인 스타일 헬퍼 --- */<br /> function s(el, styles) {<br /> Object.keys(styles).forEach(function(k) { el.style[k] = styles[k]; });<br /> }<br /> <br /> /* --- 헤더 --- */<br /> var header = document.createElement(&quot;header&quot;);<br /> s(header, {<br /> position: &quot;fixed&quot;,<br /> top: &quot;0&quot;,<br /> left: &quot;0&quot;,<br /> right: &quot;0&quot;,<br /> zIndex: &quot;9999&quot;,<br /> width: &quot;100%&quot;,<br /> background: &quot;#f9f6f0&quot;,<br /> borderBottom: &quot;1px solid #e2d9c8&quot;,<br /> display: &quot;flex&quot;,<br /> alignItems: &quot;center&quot;,<br /> justifyContent: &quot;space-between&quot;,<br /> padding: &quot;0 2rem&quot;,<br /> height: &quot;56px&quot;,<br /> boxSizing: &quot;border-box&quot;<br /> });<br /> <br /> /* --- 좌측 --- */<br /> var left = document.createElement(&quot;div&quot;);<br /> s(left, {<br /> display: &quot;flex&quot;,<br /> alignItems: &quot;center&quot;,<br /> gap: &quot;1.75rem&quot;<br /> });<br /> <br /> var logo = document.createElement(&quot;a&quot;);<br /> logo.href = &quot;https://erakh.com&quot;;<br /> logo.textContent = &quot;Erakh Archive&quot;;<br /> s(logo, {<br /> fontFamily: &quot;'Cinzel', serif&quot;,<br /> fontSize: &quot;1.125rem&quot;,<br /> fontWeight: &quot;500&quot;,<br /> color: &quot;#2a2218&quot;,<br /> textDecoration: &quot;none&quot;,<br /> letterSpacing: &quot;0.05em&quot;,<br /> textTransform: &quot;none&quot;,<br /> fontVariant: &quot;normal&quot;,<br /> fontVariantCaps: &quot;normal&quot;,<br /> lineHeight: &quot;1&quot;<br /> });<br /> <br /> var nav = document.createElement(&quot;nav&quot;);<br /> s(nav, { display: &quot;flex&quot;, alignItems: &quot;center&quot;, gap: &quot;1.5rem&quot; });<br /> <br /> var codexLink = document.createElement(&quot;a&quot;);<br /> codexLink.href = &quot;https://codex.erakh.com&quot;;<br /> codexLink.textContent = &quot;Codex&quot;;<br /> s(codexLink, {<br /> fontFamily: &quot;'EB Garamond', serif&quot;,<br /> fontSize: &quot;1rem&quot;,<br /> color: &quot;#6b5e4e&quot;,<br /> textDecoration: &quot;none&quot;,<br /> textTransform: &quot;none&quot;,<br /> fontVariant: &quot;normal&quot;,<br /> lineHeight: &quot;1&quot;<br /> });<br /> codexLink.addEventListener(&quot;mouseover&quot;, function() { this.style.color = &quot;#2a2218&quot;; });<br /> codexLink.addEventListener(&quot;mouseout&quot;, function() { this.style.color = &quot;#6b5e4e&quot;; });<br /> <br /> nav.appendChild(codexLink);<br /> left.appendChild(logo);<br /> left.appendChild(nav);<br /> <br /> /* --- 우측 --- */<br /> var right = document.createElement(&quot;div&quot;);<br /> s(right, { display: &quot;flex&quot;, alignItems: &quot;center&quot; });<br /> <br /> if (user &amp;&amp; user.email) {<br /> /* 로그인 — 아바타 + 드롭다운 */<br /> var profile = document.createElement(&quot;div&quot;);<br /> s(profile, { position: &quot;relative&quot; });<br /> <br /> var avatar = document.createElement(&quot;div&quot;);<br /> avatar.textContent = user.email.slice(0, 1).toUpperCase();<br /> s(avatar, {<br /> width: &quot;32px&quot;,<br /> height: &quot;32px&quot;,<br /> borderRadius: &quot;50%&quot;,<br /> background: &quot;#e2d9c8&quot;,<br /> border: &quot;1px solid #c8b99a&quot;,<br /> display: &quot;flex&quot;,<br /> alignItems: &quot;center&quot;,<br /> justifyContent: &quot;center&quot;,<br /> cursor: &quot;pointer&quot;,<br /> fontFamily: &quot;'Cinzel', serif&quot;,<br /> fontSize: &quot;0.75rem&quot;,<br /> color: &quot;#2a2218&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> fontVariant: &quot;normal&quot;,<br /> textTransform: &quot;none&quot;<br /> });<br /> <br /> var dropdown = document.createElement(&quot;div&quot;);<br /> s(dropdown, {<br /> display: &quot;none&quot;,<br /> position: &quot;absolute&quot;,<br /> top: &quot;calc(100% + 8px)&quot;,<br /> right: &quot;0&quot;,<br /> background: &quot;#f9f6f0&quot;,<br /> border: &quot;1px solid #e2d9c8&quot;,<br /> minWidth: &quot;180px&quot;,<br /> padding: &quot;0.5rem 0&quot;,<br /> boxShadow: &quot;0 4px 16px rgba(0,0,0,0.06)&quot;,<br /> zIndex: &quot;10000&quot;,<br /> boxSizing: &quot;border-box&quot;<br /> });<br /> <br /> var emailDiv = document.createElement(&quot;div&quot;);<br /> emailDiv.textContent = user.email;<br /> s(emailDiv, {<br /> padding: &quot;0.5rem 1rem 0.75rem&quot;,<br /> fontFamily: &quot;'EB Garamond', serif&quot;,<br /> fontSize: &quot;0.875rem&quot;,<br /> color: &quot;#6b5e4e&quot;,<br /> borderBottom: &quot;1px solid #e2d9c8&quot;,<br /> marginBottom: &quot;0.25rem&quot;,<br /> fontStyle: &quot;italic&quot;,<br /> wordBreak: &quot;break-all&quot;<br /> });<br /> <br /> var profileLink = document.createElement(&quot;a&quot;);<br /> profileLink.href = &quot;https://erakh.com/profile&quot;;<br /> profileLink.textContent = &quot;Profile&quot;;<br /> s(profileLink, {<br /> display: &quot;block&quot;,<br /> width: &quot;100%&quot;,<br /> padding: &quot;0.5rem 1rem&quot;,<br /> fontFamily: &quot;'Inter', sans-serif&quot;,<br /> fontSize: &quot;0.8125rem&quot;,<br /> color: &quot;#2a2218&quot;,<br /> textDecoration: &quot;none&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> textTransform: &quot;none&quot;<br /> });<br /> <br /> var signOutBtn = document.createElement(&quot;button&quot;);<br /> signOutBtn.textContent = &quot;Sign out&quot;;<br /> s(signOutBtn, {<br /> display: &quot;block&quot;,<br /> width: &quot;100%&quot;,<br /> padding: &quot;0.5rem 1rem&quot;,<br /> fontFamily: &quot;'Inter', sans-serif&quot;,<br /> fontSize: &quot;0.8125rem&quot;,<br /> color: &quot;#a04040&quot;,<br /> textAlign: &quot;left&quot;,<br /> background: &quot;transparent&quot;,<br /> border: &quot;none&quot;,<br /> cursor: &quot;pointer&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> textTransform: &quot;none&quot;<br /> });<br /> signOutBtn.addEventListener(&quot;click&quot;, function () {<br /> fetch(&quot;https://erakh.com/api/auth/logout&quot;, { method: &quot;POST&quot;, credentials: &quot;include&quot; })<br /> .then(function () { window.location.href = &quot;https://erakh.com&quot;; });<br /> });<br /> <br /> dropdown.appendChild(emailDiv);<br /> dropdown.appendChild(profileLink);<br /> dropdown.appendChild(signOutBtn);<br /> <br /> avatar.addEventListener(&quot;click&quot;, function () {<br /> dropdown.style.display = dropdown.style.display === &quot;none&quot; ? &quot;block&quot; : &quot;none&quot;;<br /> });<br /> document.addEventListener(&quot;click&quot;, function (e) {<br /> if (!profile.contains(e.target)) dropdown.style.display = &quot;none&quot;;<br /> });<br /> <br /> profile.appendChild(avatar);<br /> profile.appendChild(dropdown);<br /> right.appendChild(profile);<br /> <br /> } else {<br /> /* 비로그인 — Sign in */<br /> var loginBtn = document.createElement(&quot;a&quot;);<br /> loginBtn.href = &quot;https://erakh.com/login?redirect=&quot; + encodeURIComponent(window.location.href);<br /> loginBtn.textContent = &quot;Sign in&quot;;<br /> s(loginBtn, {<br /> fontFamily: &quot;'Inter', sans-serif&quot;,<br /> fontSize: &quot;0.8125rem&quot;,<br /> fontWeight: &quot;500&quot;,<br /> color: &quot;#2a2218&quot;,<br /> textDecoration: &quot;none&quot;,<br /> padding: &quot;0.4rem 1rem&quot;,<br /> border: &quot;1px solid #c8b99a&quot;,<br /> background: &quot;transparent&quot;,<br /> cursor: &quot;pointer&quot;,<br /> textTransform: &quot;none&quot;,<br /> boxSizing: &quot;border-box&quot;,<br /> lineHeight: &quot;1&quot;<br /> });<br /> loginBtn.addEventListener(&quot;mouseover&quot;, function() {<br /> this.style.borderColor = &quot;#c8a060&quot;;<br /> this.style.background = &quot;#f0ebe0&quot;;<br /> });<br /> loginBtn.addEventListener(&quot;mouseout&quot;, function() {<br /> this.style.borderColor = &quot;#c8b99a&quot;;<br /> this.style.background = &quot;transparent&quot;;<br /> });<br /> right.appendChild(loginBtn);<br /> }<br /> <br /> header.appendChild(left);<br /> header.appendChild(right);<br /> document.body.insertBefore(header, document.body.firstChild);<br /> })();</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.js&diff=6 2026-04-09T02:32:20Z

<p>Juoh: </p> <hr /> <div>/* =============================================<br /> ERAKH HEADER — MediaWiki:Common.js<br /> erakh.com Header.tsx와 동일한 디자인/역할<br /> ============================================= */<br /> <br /> (function () {<br /> /* --- 쿠키 읽기 --- */<br /> function getCookie(name) {<br /> var match = document.cookie.match(new RegExp(&quot;(?:^|; )&quot; + name + &quot;=([^;]*)&quot;));<br /> return match ? decodeURIComponent(match[1]) : null;<br /> }<br /> <br /> /* --- 유저 정보 파싱 --- */<br /> var user = null;<br /> try {<br /> var raw = getCookie(&quot;erakh_user&quot;);<br /> if (raw) user = JSON.parse(raw);<br /> } catch (e) {}<br /> <br /> /* --- CSS 주입 --- */<br /> var style = document.createElement(&quot;style&quot;);<br /> style.textContent = `<br /> .erakh-header {<br /> position: fixed;<br /> top: 0;<br /> left: 0;<br /> right: 0;<br /> z-index: 9999;<br /> width: 100%;<br /> background: var(--bg, #f9f6f0);<br /> border-bottom: 1px solid var(--beige-2, #e2d9c8);<br /> display: flex;<br /> align-items: center;<br /> justify-content: space-between;<br /> padding: 0 2rem;<br /> height: 56px;<br /> }<br /> .erakh-header-left {<br /> display: flex;<br /> align-items: center;<br /> gap: 1.75rem;<br /> }<br /> .erakh-logo {<br /> font-family: 'Cinzel', serif;<br /> font-size: 1.125rem;<br /> font-weight: 500;<br /> color: var(--ink, #2a2218);<br /> text-decoration: none;<br /> letter-spacing: 0.05em;<br /> }<br /> .erakh-nav a {<br /> font-family: 'EB Garamond', serif;<br /> font-size: 1rem;<br /> color: var(--ink-soft, #6b5e4e);<br /> text-decoration: none;<br /> transition: color 0.15s;<br /> }<br /> .erakh-nav a:hover {<br /> color: var(--ink, #2a2218);<br /> }<br /> .erakh-nav a.active {<br /> color: var(--ink, #2a2218);<br /> }<br /> .erakh-login-btn {<br /> font-family: 'Inter', sans-serif;<br /> font-size: 0.8125rem;<br /> font-weight: 500;<br /> color: var(--ink, #2a2218);<br /> text-decoration: none;<br /> padding: 0.4rem 1rem;<br /> border: 1px solid var(--beige-3, #c8b99a);<br /> background: transparent;<br /> transition: border-color 0.15s, background 0.15s;<br /> cursor: pointer;<br /> }<br /> .erakh-login-btn:hover {<br /> border-color: var(--gold, #c8a060);<br /> background: var(--beige-1, #f0ebe0);<br /> }<br /> .erakh-profile {<br /> position: relative;<br /> }<br /> .erakh-avatar {<br /> width: 32px;<br /> height: 32px;<br /> border-radius: 50%;<br /> background: var(--beige-2, #e2d9c8);<br /> border: 1px solid var(--beige-3, #c8b99a);<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> cursor: pointer;<br /> font-family: 'Cinzel', serif;<br /> font-size: 0.75rem;<br /> color: var(--ink, #2a2218);<br /> transition: border-color 0.15s;<br /> }<br /> .erakh-avatar:hover {<br /> border-color: var(--gold, #c8a060);<br /> }<br /> .erakh-dropdown {<br /> position: absolute;<br /> top: calc(100% + 8px);<br /> right: 0;<br /> background: var(--bg, #f9f6f0);<br /> border: 1px solid var(--beige-2, #e2d9c8);<br /> min-width: 180px;<br /> padding: 0.5rem 0;<br /> box-shadow: 0 4px 16px rgba(0,0,0,0.06);<br /> }<br /> .erakh-dropdown-email {<br /> padding: 0.5rem 1rem 0.75rem;<br /> font-family: 'EB Garamond', serif;<br /> font-size: 0.875rem;<br /> color: var(--ink-soft, #6b5e4e);<br /> border-bottom: 1px solid var(--beige-2, #e2d9c8);<br /> margin-bottom: 0.25rem;<br /> font-style: italic;<br /> word-break: break-all;<br /> }<br /> .erakh-dropdown-item {<br /> display: block;<br /> width: 100%;<br /> padding: 0.5rem 1rem;<br /> font-family: 'Inter', sans-serif;<br /> font-size: 0.8125rem;<br /> color: var(--ink, #2a2218);<br /> text-align: left;<br /> background: transparent;<br /> border: none;<br /> cursor: pointer;<br /> text-decoration: none;<br /> transition: background 0.1s;<br /> box-sizing: border-box;<br /> }<br /> .erakh-dropdown-item:hover {<br /> background: var(--beige-1, #f0ebe0);<br /> }<br /> .erakh-dropdown-item.danger {<br /> color: #a04040;<br /> }<br /> `;<br /> document.head.appendChild(style);<br /> <br /> /* --- 헤더 HTML 생성 --- */<br /> var header = document.createElement(&quot;header&quot;);<br /> header.className = &quot;erakh-header&quot;;<br /> <br /> /* 좌측 */<br /> var left = document.createElement(&quot;div&quot;);<br /> left.className = &quot;erakh-header-left&quot;;<br /> <br /> var logo = document.createElement(&quot;a&quot;);<br /> logo.href = &quot;https://erakh.com&quot;;<br /> logo.className = &quot;erakh-logo&quot;;<br /> logo.textContent = &quot;Erakh Archive&quot;;<br /> logo.style.cssText = &quot;font-family:'Cinzel',serif !important;font-size:1.125rem !important;font-weight:500 !important;color:#2a2218 !important;text-decoration:none !important;letter-spacing:0.05em !important;text-transform:none !important;font-variant:normal !important;font-variant-caps:normal !important;&quot;;<br /> <br /> var nav = document.createElement(&quot;nav&quot;);<br /> nav.className = &quot;erakh-nav&quot;;<br /> var codexLink = document.createElement(&quot;a&quot;);<br /> codexLink.href = &quot;https://codex.erakh.com&quot;;<br /> codexLink.textContent = &quot;Codex&quot;;<br /> codexLink.className = &quot;active&quot;;<br /> nav.appendChild(codexLink);<br /> <br /> left.appendChild(logo);<br /> left.appendChild(nav);<br /> <br /> /* 우측 */<br /> var right = document.createElement(&quot;div&quot;);<br /> <br /> if (user &amp;&amp; user.email) {<br /> /* 로그인 상태 — 아바타 + 드롭다운 */<br /> var profile = document.createElement(&quot;div&quot;);<br /> profile.className = &quot;erakh-profile&quot;;<br /> <br /> var avatar = document.createElement(&quot;div&quot;);<br /> avatar.className = &quot;erakh-avatar&quot;;<br /> avatar.textContent = user.email.slice(0, 1).toUpperCase();<br /> <br /> var dropdown = document.createElement(&quot;div&quot;);<br /> dropdown.className = &quot;erakh-dropdown&quot;;<br /> dropdown.style.display = &quot;none&quot;;<br /> <br /> var emailDiv = document.createElement(&quot;div&quot;);<br /> emailDiv.className = &quot;erakh-dropdown-email&quot;;<br /> emailDiv.textContent = user.email;<br /> <br /> var profileLink = document.createElement(&quot;a&quot;);<br /> profileLink.href = &quot;https://erakh.com/profile&quot;;<br /> profileLink.className = &quot;erakh-dropdown-item&quot;;<br /> profileLink.textContent = &quot;Profile&quot;;<br /> <br /> var signOutBtn = document.createElement(&quot;button&quot;);<br /> signOutBtn.className = &quot;erakh-dropdown-item danger&quot;;<br /> signOutBtn.textContent = &quot;Sign out&quot;;<br /> signOutBtn.addEventListener(&quot;click&quot;, function () {<br /> fetch(&quot;https://erakh.com/api/auth/logout&quot;, { method: &quot;POST&quot;, credentials: &quot;include&quot; })<br /> .then(function () {<br /> window.location.href = &quot;https://erakh.com&quot;;<br /> });<br /> });<br /> <br /> dropdown.appendChild(emailDiv);<br /> dropdown.appendChild(profileLink);<br /> dropdown.appendChild(signOutBtn);<br /> <br /> avatar.addEventListener(&quot;click&quot;, function () {<br /> dropdown.style.display = dropdown.style.display === &quot;none&quot; ? &quot;block&quot; : &quot;none&quot;;<br /> });<br /> <br /> document.addEventListener(&quot;click&quot;, function (e) {<br /> if (!profile.contains(e.target)) {<br /> dropdown.style.display = &quot;none&quot;;<br /> }<br /> });<br /> <br /> profile.appendChild(avatar);<br /> profile.appendChild(dropdown);<br /> right.appendChild(profile);<br /> <br /> } else {<br /> /* 비로그인 상태 — Sign in 버튼 */<br /> var loginBtn = document.createElement(&quot;a&quot;);<br /> loginBtn.href = &quot;https://erakh.com/login?redirect=&quot; + encodeURIComponent(window.location.href);<br /> loginBtn.className = &quot;erakh-login-btn&quot;;<br /> loginBtn.textContent = &quot;Sign in&quot;;<br /> right.appendChild(loginBtn);<br /> }<br /> <br /> header.appendChild(left);<br /> header.appendChild(right);<br /> document.body.insertBefore(header, document.body.firstChild);<br /> })();</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.css&diff=5 2026-04-09T02:29:11Z

<p>Juoh: </p> <hr /> <div>@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&amp;family=EB+Garamond:ital,wght@0,400;0,500;1,400&amp;display=swap');<br /> <br /> /* =============================================<br /> ERAKH CODEX — Common.css<br /> erakh.com 디자인 시스템 기준 (라이트 모드)<br /> ============================================= */<br /> <br /> :root {<br /> --bg: #f9f6f0;<br /> --beige-1: #f0ebe0;<br /> --beige-2: #e2d9c8;<br /> --beige-3: #c8b99a;<br /> --beige-4: #a89070;<br /> --gold: #c8a060;<br /> --gold-dark: #a07840;<br /> --ink: #2a2218;<br /> --ink-soft: #6b5e4e;<br /> --ink-muted: #9c8e80;<br /> --surface: #ffffff;<br /> }<br /> <br /> /* === Base === */<br /> body {<br /> background-color: var(--bg) !important;<br /> color: var(--ink) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 18px !important;<br /> line-height: 1.7 !important;<br /> }<br /> <br /> /* === 제목 === */<br /> h1, h2, h3, h4, h5, h6,<br /> .firstHeading, #firstHeading {<br /> font-family: 'Cinzel', serif !important;<br /> color: var(--ink) !important;<br /> font-weight: 500 !important;<br /> letter-spacing: 0.02em !important;<br /> }<br /> <br /> /* === 링크 === */<br /> a, a:visited {<br /> color: var(--gold-dark) !important;<br /> text-decoration: none !important;<br /> }<br /> a:hover {<br /> color: var(--gold) !important;<br /> text-decoration: underline !important;<br /> }<br /> <br /> /* === 페이지 배경 === */<br /> #mw-page-base,<br /> #mw-head-base {<br /> background-color: var(--beige-1) !important;<br /> }<br /> <br /> /* === 본문 영역 === */<br /> #content,<br /> .mw-body {<br /> background-color: var(--surface) !important;<br /> border: 1px solid var(--beige-2) !important;<br /> color: var(--ink) !important;<br /> }<br /> <br /> /* === 사이드바 === */<br /> #mw-panel {<br /> background-color: transparent !important;<br /> }<br /> <br /> .vector-menu-portal h3,<br /> #p-navigation h3,<br /> #p-tb h3 {<br /> font-family: 'Cinzel', serif !important;<br /> font-size: 10px !important;<br /> letter-spacing: 0.12em !important;<br /> text-transform: uppercase !important;<br /> color: var(--ink-muted) !important;<br /> border-bottom: 1px solid var(--beige-2) !important;<br /> padding-bottom: 4px !important;<br /> }<br /> <br /> .vector-menu-portal ul li a,<br /> #p-navigation ul li a,<br /> #p-tb ul li a {<br /> color: var(--ink-soft) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 16px !important;<br /> }<br /> <br /> .vector-menu-portal ul li a:hover,<br /> #p-navigation ul li a:hover,<br /> #p-tb ul li a:hover {<br /> color: var(--gold) !important;<br /> }<br /> <br /> /* === 헤더 / 탭 === */<br /> #mw-head {<br /> background-color: var(--beige-1) !important;<br /> }<br /> <br /> .vector-menu-tabs a,<br /> #p-namespaces ul li a,<br /> #p-views ul li a {<br /> font-family: 'Cinzel', serif !important;<br /> font-size: 12px !important;<br /> letter-spacing: 0.05em !important;<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> li.selected a {<br /> color: var(--ink) !important;<br /> }<br /> <br /> /* === 검색창 === */<br /> #searchInput {<br /> background-color: var(--beige-1) !important;<br /> border: 1px solid var(--beige-3) !important;<br /> color: var(--ink) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> border-radius: 4px !important;<br /> }<br /> <br /> /* === 카테고리 === */<br /> #catlinks {<br /> background-color: var(--beige-1) !important;<br /> border: 1px solid var(--beige-2) !important;<br /> border-radius: 4px !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> /* === 푸터 === */<br /> #footer {<br /> background-color: var(--beige-1) !important;<br /> border-top: 1px solid var(--beige-2) !important;<br /> color: var(--ink-muted) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 14px !important;<br /> }<br /> <br /> #footer a {<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> /* === 위키테이블 === */<br /> table.wikitable {<br /> background-color: var(--surface) !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> table.wikitable th {<br /> background-color: var(--beige-1) !important;<br /> color: var(--ink) !important;<br /> font-family: 'Cinzel', serif !important;<br /> font-weight: 500 !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> table.wikitable td {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* === 구분선 === */<br /> hr {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* =============================================<br /> LAYOUT — 기본 Vector UI 제거 + 풀width<br /> ============================================= */<br /> <br /> /* 기존 헤더/사이드바/로고 전부 숨김 */<br /> #mw-head,<br /> #mw-panel,<br /> #p-logo,<br /> #mw-navigation,<br /> #mw-head-base,<br /> #mw-page-base {<br /> display: none !important;<br /> }<br /> <br /> /* 본문 풀width */<br /> #mw-page-base { display: none !important; }<br /> <br /> #content,<br /> .mw-body {<br /> margin-left: 0 !important;<br /> margin-top: 0 !important;<br /> border-left: none !important;<br /> border-right: none !important;<br /> border-top: none !important;<br /> max-width: 860px !important;<br /> margin: 0 auto !important;<br /> padding: 2rem 2rem 4rem !important;<br /> background: var(--surface) !important;<br /> }<br /> <br /> #bodyContent {<br /> margin-top: 1.5rem !important;<br /> }<br /> <br /> /* 전체 페이지 배경 */<br /> body {<br /> padding-top: 56px !important;<br /> }<br /> <br /> /* === 헤더 예외 처리 === */<br /> .erakh-logo,<br /> .erakh-logo:visited {<br /> color: var(--ink, #2a2218) !important;<br /> text-transform: none !important;<br /> font-variant: normal !important;<br /> }<br /> <br /> .erakh-nav a,<br /> .erakh-nav a:visited {<br /> color: var(--ink-soft, #6b5e4e) !important;<br /> text-transform: none !important;<br /> }<br /> <br /> .erakh-nav a:hover {<br /> color: var(--ink, #2a2218) !important;<br /> }<br /> <br /> .erakh-header {<br /> overflow: visible !important;<br /> }<br /> <br /> .erakh-login-btn,<br /> .erakh-login-btn:visited {<br /> color: var(--ink, #2a2218) !important;<br /> text-transform: none !important;<br /> }</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.js&diff=4 2026-04-09T02:22:52Z

<p>Juoh: Erakh header injection</p> <hr /> <div>/* =============================================<br /> ERAKH HEADER — MediaWiki:Common.js<br /> erakh.com Header.tsx와 동일한 디자인/역할<br /> ============================================= */<br /> <br /> (function () {<br /> /* --- 쿠키 읽기 --- */<br /> function getCookie(name) {<br /> var match = document.cookie.match(new RegExp(&quot;(?:^|; )&quot; + name + &quot;=([^;]*)&quot;));<br /> return match ? decodeURIComponent(match[1]) : null;<br /> }<br /> <br /> /* --- 유저 정보 파싱 --- */<br /> var user = null;<br /> try {<br /> var raw = getCookie(&quot;erakh_user&quot;);<br /> if (raw) user = JSON.parse(raw);<br /> } catch (e) {}<br /> <br /> /* --- CSS 주입 --- */<br /> var style = document.createElement(&quot;style&quot;);<br /> style.textContent = `<br /> .erakh-header {<br /> position: fixed;<br /> top: 0;<br /> left: 0;<br /> right: 0;<br /> z-index: 9999;<br /> width: 100%;<br /> background: var(--bg, #f9f6f0);<br /> border-bottom: 1px solid var(--beige-2, #e2d9c8);<br /> display: flex;<br /> align-items: center;<br /> justify-content: space-between;<br /> padding: 0 2rem;<br /> height: 56px;<br /> }<br /> .erakh-header-left {<br /> display: flex;<br /> align-items: center;<br /> gap: 1.75rem;<br /> }<br /> .erakh-logo {<br /> font-family: 'Cinzel', serif;<br /> font-size: 1.125rem;<br /> font-weight: 500;<br /> color: var(--ink, #2a2218);<br /> text-decoration: none;<br /> letter-spacing: 0.05em;<br /> }<br /> .erakh-nav a {<br /> font-family: 'EB Garamond', serif;<br /> font-size: 1rem;<br /> color: var(--ink-soft, #6b5e4e);<br /> text-decoration: none;<br /> transition: color 0.15s;<br /> }<br /> .erakh-nav a:hover {<br /> color: var(--ink, #2a2218);<br /> }<br /> .erakh-nav a.active {<br /> color: var(--ink, #2a2218);<br /> }<br /> .erakh-login-btn {<br /> font-family: 'Inter', sans-serif;<br /> font-size: 0.8125rem;<br /> font-weight: 500;<br /> color: var(--ink, #2a2218);<br /> text-decoration: none;<br /> padding: 0.4rem 1rem;<br /> border: 1px solid var(--beige-3, #c8b99a);<br /> background: transparent;<br /> transition: border-color 0.15s, background 0.15s;<br /> cursor: pointer;<br /> }<br /> .erakh-login-btn:hover {<br /> border-color: var(--gold, #c8a060);<br /> background: var(--beige-1, #f0ebe0);<br /> }<br /> .erakh-profile {<br /> position: relative;<br /> }<br /> .erakh-avatar {<br /> width: 32px;<br /> height: 32px;<br /> border-radius: 50%;<br /> background: var(--beige-2, #e2d9c8);<br /> border: 1px solid var(--beige-3, #c8b99a);<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> cursor: pointer;<br /> font-family: 'Cinzel', serif;<br /> font-size: 0.75rem;<br /> color: var(--ink, #2a2218);<br /> transition: border-color 0.15s;<br /> }<br /> .erakh-avatar:hover {<br /> border-color: var(--gold, #c8a060);<br /> }<br /> .erakh-dropdown {<br /> position: absolute;<br /> top: calc(100% + 8px);<br /> right: 0;<br /> background: var(--bg, #f9f6f0);<br /> border: 1px solid var(--beige-2, #e2d9c8);<br /> min-width: 180px;<br /> padding: 0.5rem 0;<br /> box-shadow: 0 4px 16px rgba(0,0,0,0.06);<br /> }<br /> .erakh-dropdown-email {<br /> padding: 0.5rem 1rem 0.75rem;<br /> font-family: 'EB Garamond', serif;<br /> font-size: 0.875rem;<br /> color: var(--ink-soft, #6b5e4e);<br /> border-bottom: 1px solid var(--beige-2, #e2d9c8);<br /> margin-bottom: 0.25rem;<br /> font-style: italic;<br /> word-break: break-all;<br /> }<br /> .erakh-dropdown-item {<br /> display: block;<br /> width: 100%;<br /> padding: 0.5rem 1rem;<br /> font-family: 'Inter', sans-serif;<br /> font-size: 0.8125rem;<br /> color: var(--ink, #2a2218);<br /> text-align: left;<br /> background: transparent;<br /> border: none;<br /> cursor: pointer;<br /> text-decoration: none;<br /> transition: background 0.1s;<br /> box-sizing: border-box;<br /> }<br /> .erakh-dropdown-item:hover {<br /> background: var(--beige-1, #f0ebe0);<br /> }<br /> .erakh-dropdown-item.danger {<br /> color: #a04040;<br /> }<br /> `;<br /> document.head.appendChild(style);<br /> <br /> /* --- 헤더 HTML 생성 --- */<br /> var header = document.createElement(&quot;header&quot;);<br /> header.className = &quot;erakh-header&quot;;<br /> <br /> /* 좌측 */<br /> var left = document.createElement(&quot;div&quot;);<br /> left.className = &quot;erakh-header-left&quot;;<br /> <br /> var logo = document.createElement(&quot;a&quot;);<br /> logo.href = &quot;https://erakh.com&quot;;<br /> logo.className = &quot;erakh-logo&quot;;<br /> logo.textContent = &quot;Erakh Archive&quot;;<br /> <br /> var nav = document.createElement(&quot;nav&quot;);<br /> nav.className = &quot;erakh-nav&quot;;<br /> var codexLink = document.createElement(&quot;a&quot;);<br /> codexLink.href = &quot;https://codex.erakh.com&quot;;<br /> codexLink.textContent = &quot;Codex&quot;;<br /> codexLink.className = &quot;active&quot;;<br /> nav.appendChild(codexLink);<br /> <br /> left.appendChild(logo);<br /> left.appendChild(nav);<br /> <br /> /* 우측 */<br /> var right = document.createElement(&quot;div&quot;);<br /> <br /> if (user &amp;&amp; user.email) {<br /> /* 로그인 상태 — 아바타 + 드롭다운 */<br /> var profile = document.createElement(&quot;div&quot;);<br /> profile.className = &quot;erakh-profile&quot;;<br /> <br /> var avatar = document.createElement(&quot;div&quot;);<br /> avatar.className = &quot;erakh-avatar&quot;;<br /> avatar.textContent = user.email.slice(0, 1).toUpperCase();<br /> <br /> var dropdown = document.createElement(&quot;div&quot;);<br /> dropdown.className = &quot;erakh-dropdown&quot;;<br /> dropdown.style.display = &quot;none&quot;;<br /> <br /> var emailDiv = document.createElement(&quot;div&quot;);<br /> emailDiv.className = &quot;erakh-dropdown-email&quot;;<br /> emailDiv.textContent = user.email;<br /> <br /> var profileLink = document.createElement(&quot;a&quot;);<br /> profileLink.href = &quot;https://erakh.com/profile&quot;;<br /> profileLink.className = &quot;erakh-dropdown-item&quot;;<br /> profileLink.textContent = &quot;Profile&quot;;<br /> <br /> var signOutBtn = document.createElement(&quot;button&quot;);<br /> signOutBtn.className = &quot;erakh-dropdown-item danger&quot;;<br /> signOutBtn.textContent = &quot;Sign out&quot;;<br /> signOutBtn.addEventListener(&quot;click&quot;, function () {<br /> fetch(&quot;https://erakh.com/api/auth/logout&quot;, { method: &quot;POST&quot;, credentials: &quot;include&quot; })<br /> .then(function () {<br /> window.location.href = &quot;https://erakh.com&quot;;<br /> });<br /> });<br /> <br /> dropdown.appendChild(emailDiv);<br /> dropdown.appendChild(profileLink);<br /> dropdown.appendChild(signOutBtn);<br /> <br /> avatar.addEventListener(&quot;click&quot;, function () {<br /> dropdown.style.display = dropdown.style.display === &quot;none&quot; ? &quot;block&quot; : &quot;none&quot;;<br /> });<br /> <br /> document.addEventListener(&quot;click&quot;, function (e) {<br /> if (!profile.contains(e.target)) {<br /> dropdown.style.display = &quot;none&quot;;<br /> }<br /> });<br /> <br /> profile.appendChild(avatar);<br /> profile.appendChild(dropdown);<br /> right.appendChild(profile);<br /> <br /> } else {<br /> /* 비로그인 상태 — Sign in 버튼 */<br /> var loginBtn = document.createElement(&quot;a&quot;);<br /> loginBtn.href = &quot;https://erakh.com/login?redirect=&quot; + encodeURIComponent(window.location.href);<br /> loginBtn.className = &quot;erakh-login-btn&quot;;<br /> loginBtn.textContent = &quot;Sign in&quot;;<br /> right.appendChild(loginBtn);<br /> }<br /> <br /> header.appendChild(left);<br /> header.appendChild(right);<br /> document.body.insertBefore(header, document.body.firstChild);<br /> })();</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.css&diff=3 2026-04-09T02:21:47Z

<p>Juoh: </p> <hr /> <div>@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&amp;family=EB+Garamond:ital,wght@0,400;0,500;1,400&amp;display=swap');<br /> <br /> /* =============================================<br /> ERAKH CODEX — Common.css<br /> erakh.com 디자인 시스템 기준 (라이트 모드)<br /> ============================================= */<br /> <br /> :root {<br /> --bg: #f9f6f0;<br /> --beige-1: #f0ebe0;<br /> --beige-2: #e2d9c8;<br /> --beige-3: #c8b99a;<br /> --beige-4: #a89070;<br /> --gold: #c8a060;<br /> --gold-dark: #a07840;<br /> --ink: #2a2218;<br /> --ink-soft: #6b5e4e;<br /> --ink-muted: #9c8e80;<br /> --surface: #ffffff;<br /> }<br /> <br /> /* === Base === */<br /> body {<br /> background-color: var(--bg) !important;<br /> color: var(--ink) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 18px !important;<br /> line-height: 1.7 !important;<br /> }<br /> <br /> /* === 제목 === */<br /> h1, h2, h3, h4, h5, h6,<br /> .firstHeading, #firstHeading {<br /> font-family: 'Cinzel', serif !important;<br /> color: var(--ink) !important;<br /> font-weight: 500 !important;<br /> letter-spacing: 0.02em !important;<br /> }<br /> <br /> /* === 링크 === */<br /> a, a:visited {<br /> color: var(--gold-dark) !important;<br /> text-decoration: none !important;<br /> }<br /> a:hover {<br /> color: var(--gold) !important;<br /> text-decoration: underline !important;<br /> }<br /> <br /> /* === 페이지 배경 === */<br /> #mw-page-base,<br /> #mw-head-base {<br /> background-color: var(--beige-1) !important;<br /> }<br /> <br /> /* === 본문 영역 === */<br /> #content,<br /> .mw-body {<br /> background-color: var(--surface) !important;<br /> border: 1px solid var(--beige-2) !important;<br /> color: var(--ink) !important;<br /> }<br /> <br /> /* === 사이드바 === */<br /> #mw-panel {<br /> background-color: transparent !important;<br /> }<br /> <br /> .vector-menu-portal h3,<br /> #p-navigation h3,<br /> #p-tb h3 {<br /> font-family: 'Cinzel', serif !important;<br /> font-size: 10px !important;<br /> letter-spacing: 0.12em !important;<br /> text-transform: uppercase !important;<br /> color: var(--ink-muted) !important;<br /> border-bottom: 1px solid var(--beige-2) !important;<br /> padding-bottom: 4px !important;<br /> }<br /> <br /> .vector-menu-portal ul li a,<br /> #p-navigation ul li a,<br /> #p-tb ul li a {<br /> color: var(--ink-soft) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 16px !important;<br /> }<br /> <br /> .vector-menu-portal ul li a:hover,<br /> #p-navigation ul li a:hover,<br /> #p-tb ul li a:hover {<br /> color: var(--gold) !important;<br /> }<br /> <br /> /* === 헤더 / 탭 === */<br /> #mw-head {<br /> background-color: var(--beige-1) !important;<br /> }<br /> <br /> .vector-menu-tabs a,<br /> #p-namespaces ul li a,<br /> #p-views ul li a {<br /> font-family: 'Cinzel', serif !important;<br /> font-size: 12px !important;<br /> letter-spacing: 0.05em !important;<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> li.selected a {<br /> color: var(--ink) !important;<br /> }<br /> <br /> /* === 검색창 === */<br /> #searchInput {<br /> background-color: var(--beige-1) !important;<br /> border: 1px solid var(--beige-3) !important;<br /> color: var(--ink) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> border-radius: 4px !important;<br /> }<br /> <br /> /* === 카테고리 === */<br /> #catlinks {<br /> background-color: var(--beige-1) !important;<br /> border: 1px solid var(--beige-2) !important;<br /> border-radius: 4px !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> /* === 푸터 === */<br /> #footer {<br /> background-color: var(--beige-1) !important;<br /> border-top: 1px solid var(--beige-2) !important;<br /> color: var(--ink-muted) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 14px !important;<br /> }<br /> <br /> #footer a {<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> /* === 위키테이블 === */<br /> table.wikitable {<br /> background-color: var(--surface) !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> table.wikitable th {<br /> background-color: var(--beige-1) !important;<br /> color: var(--ink) !important;<br /> font-family: 'Cinzel', serif !important;<br /> font-weight: 500 !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> table.wikitable td {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* === 구분선 === */<br /> hr {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* =============================================<br /> LAYOUT — 기본 Vector UI 제거 + 풀width<br /> ============================================= */<br /> <br /> /* 기존 헤더/사이드바/로고 전부 숨김 */<br /> #mw-head,<br /> #mw-panel,<br /> #p-logo,<br /> #mw-navigation,<br /> #mw-head-base,<br /> #mw-page-base {<br /> display: none !important;<br /> }<br /> <br /> /* 본문 풀width */<br /> #mw-page-base { display: none !important; }<br /> <br /> #content,<br /> .mw-body {<br /> margin-left: 0 !important;<br /> margin-top: 0 !important;<br /> border-left: none !important;<br /> border-right: none !important;<br /> border-top: none !important;<br /> max-width: 860px !important;<br /> margin: 0 auto !important;<br /> padding: 2rem 2rem 4rem !important;<br /> background: var(--surface) !important;<br /> }<br /> <br /> #bodyContent {<br /> margin-top: 1.5rem !important;<br /> }<br /> <br /> /* 전체 페이지 배경 */<br /> body {<br /> padding-top: 56px !important;<br /> }</div>

Juoh https://codex.erakh.com/index.php?title=MediaWiki:Common.css&diff=2 2026-04-09T02:04:39Z

<p>Juoh: Erakh design system - light mode</p> <hr /> <div>@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&amp;family=EB+Garamond:ital,wght@0,400;0,500;1,400&amp;display=swap');<br /> <br /> /* =============================================<br /> ERAKH CODEX — Common.css<br /> erakh.com 디자인 시스템 기준 (라이트 모드)<br /> ============================================= */<br /> <br /> :root {<br /> --bg: #f9f6f0;<br /> --beige-1: #f0ebe0;<br /> --beige-2: #e2d9c8;<br /> --beige-3: #c8b99a;<br /> --beige-4: #a89070;<br /> --gold: #c8a060;<br /> --gold-dark: #a07840;<br /> --ink: #2a2218;<br /> --ink-soft: #6b5e4e;<br /> --ink-muted: #9c8e80;<br /> --surface: #ffffff;<br /> }<br /> <br /> /* === Base === */<br /> body {<br /> background-color: var(--bg) !important;<br /> color: var(--ink) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 18px !important;<br /> line-height: 1.7 !important;<br /> }<br /> <br /> /* === 제목 === */<br /> h1, h2, h3, h4, h5, h6,<br /> .firstHeading, #firstHeading {<br /> font-family: 'Cinzel', serif !important;<br /> color: var(--ink) !important;<br /> font-weight: 500 !important;<br /> letter-spacing: 0.02em !important;<br /> }<br /> <br /> /* === 링크 === */<br /> a, a:visited {<br /> color: var(--gold-dark) !important;<br /> text-decoration: none !important;<br /> }<br /> a:hover {<br /> color: var(--gold) !important;<br /> text-decoration: underline !important;<br /> }<br /> <br /> /* === 페이지 배경 === */<br /> #mw-page-base,<br /> #mw-head-base {<br /> background-color: var(--beige-1) !important;<br /> }<br /> <br /> /* === 본문 영역 === */<br /> #content,<br /> .mw-body {<br /> background-color: var(--surface) !important;<br /> border: 1px solid var(--beige-2) !important;<br /> color: var(--ink) !important;<br /> }<br /> <br /> /* === 사이드바 === */<br /> #mw-panel {<br /> background-color: transparent !important;<br /> }<br /> <br /> .vector-menu-portal h3,<br /> #p-navigation h3,<br /> #p-tb h3 {<br /> font-family: 'Cinzel', serif !important;<br /> font-size: 10px !important;<br /> letter-spacing: 0.12em !important;<br /> text-transform: uppercase !important;<br /> color: var(--ink-muted) !important;<br /> border-bottom: 1px solid var(--beige-2) !important;<br /> padding-bottom: 4px !important;<br /> }<br /> <br /> .vector-menu-portal ul li a,<br /> #p-navigation ul li a,<br /> #p-tb ul li a {<br /> color: var(--ink-soft) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 16px !important;<br /> }<br /> <br /> .vector-menu-portal ul li a:hover,<br /> #p-navigation ul li a:hover,<br /> #p-tb ul li a:hover {<br /> color: var(--gold) !important;<br /> }<br /> <br /> /* === 헤더 / 탭 === */<br /> #mw-head {<br /> background-color: var(--beige-1) !important;<br /> }<br /> <br /> .vector-menu-tabs a,<br /> #p-namespaces ul li a,<br /> #p-views ul li a {<br /> font-family: 'Cinzel', serif !important;<br /> font-size: 12px !important;<br /> letter-spacing: 0.05em !important;<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> li.selected a {<br /> color: var(--ink) !important;<br /> }<br /> <br /> /* === 검색창 === */<br /> #searchInput {<br /> background-color: var(--beige-1) !important;<br /> border: 1px solid var(--beige-3) !important;<br /> color: var(--ink) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> border-radius: 4px !important;<br /> }<br /> <br /> /* === 카테고리 === */<br /> #catlinks {<br /> background-color: var(--beige-1) !important;<br /> border: 1px solid var(--beige-2) !important;<br /> border-radius: 4px !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> /* === 푸터 === */<br /> #footer {<br /> background-color: var(--beige-1) !important;<br /> border-top: 1px solid var(--beige-2) !important;<br /> color: var(--ink-muted) !important;<br /> font-family: 'EB Garamond', Georgia, serif !important;<br /> font-size: 14px !important;<br /> }<br /> <br /> #footer a {<br /> color: var(--ink-soft) !important;<br /> }<br /> <br /> /* === 위키테이블 === */<br /> table.wikitable {<br /> background-color: var(--surface) !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> table.wikitable th {<br /> background-color: var(--beige-1) !important;<br /> color: var(--ink) !important;<br /> font-family: 'Cinzel', serif !important;<br /> font-weight: 500 !important;<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> table.wikitable td {<br /> border-color: var(--beige-2) !important;<br /> }<br /> <br /> /* === 구분선 === */<br /> hr {<br /> border-color: var(--beige-2) !important;<br /> }</div>

Juoh