https://ukernelperson.nya.je/api.php?action=feedcontributions&feedformat=atom&user=Ukernelperson μkernelperson's Trove - User contributions [en-gb] 2026-08-20T10:43:54Z User contributions MediaWiki 1.43.9 https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=79 MediaWiki:Citizen-footer-tagline 2026-08-11T10:13:08Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> &lt;!-- Identity --&gt;<br /> [[File:EnbyGQ.png|88px|link=https://badge.les.bi|alt=Enby and GenderQueer]]<br /> &lt;!-- Digital rights &amp; activism --&gt;<br /> [[File:Freespeech.gif|88px|link=https://www.eff.org/pages/blue-ribbon-campaign|alt=Free Speech]]<br /> [[File:Dbd.gif|88px|link=https://www.defectivebydesign.org/|alt=Defective by Design]]<br /> [[File:Nbai.png|88px|link=https://notbyai.fyi|alt=Written by humans not AI]]<br /> &lt;!-- Web culture &amp; community --&gt;<br /> [[File:IndieWeb.png|88px|link=https://indieweb.org|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|link=https://tildeverse.org|alt=Tildeverse]]<br /> [[File:Atabook.gif|88px|link=https://ukernelperson.atabook.org|alt=Atabook]]<br /> &lt;!-- Free software &amp; tools --&gt;<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Ubuntu.png|88px|link=https://releases.ubuntu.com/jammy/|alt=Ubuntu]]<br /> [[File:Vim.gif|88px|link=https://www.vim.org|alt=Vim]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=78 MediaWiki:Citizen-footer-tagline 2026-08-11T10:12:20Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> <br /> &lt;!-- Identity --&gt;<br /> [[File:EnbyGQ.png|88px|link=https://badge.les.bi|alt=Enby and GenderQueer]]<br /> &lt;!-- Digital rights &amp; activism --&gt;<br /> [[File:Freespeech.gif|88px|link=https://www.eff.org/pages/blue-ribbon-campaign|alt=Free Speech]]<br /> [[File:Dbd.gif|88px|link=https://www.defectivebydesign.org/|alt=Defective by Design]]<br /> [[File:Nbai.png|88px|link=https://notbyai.fyi|alt=Written by humans not AI]]<br /> &lt;!-- Web culture &amp; community --&gt;<br /> [[File:IndieWeb.png|88px|link=https://indieweb.org|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|link=https://tildeverse.org|alt=Tildeverse]]<br /> [[File:Atabook.gif|88px|link=https://ukernelperson.atabook.org|alt=Atabook]]<br /> &lt;!-- Free software &amp; tools --&gt;<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Ubuntu.png|88px|link=https://releases.ubuntu.com/jammy/|alt=Ubuntu]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=77 MediaWiki:Citizen-footer-tagline 2026-08-11T10:11:52Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> <br /> &lt;!-- Identity --&gt;<br /> [[File:EnbyGQ.png|88px|link=https://badge.les.bi|alt=Enby and GenderQueer]]<br /> &lt;!-- Digital rights &amp; activism --&gt;<br /> [[File:Freespeech.gif|88px|link=https://www.eff.org/pages/blue-ribbon-campaign|alt=Free Speech]]<br /> [[File:Dbd.gif|88px|link=https://www.defectivebydesign.org/|alt=Defective by Design]]<br /> [[File:Nbai.png|88px|link=https://notbyai.fyi|alt=Written by humans not AI]]<br /> &lt;!-- Web culture &amp; community --&gt;<br /> [[File:IndieWeb.png|88px|link=https://indieweb.org|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|link=https://tildeverse.org|alt=Tildeverse]]<br /> [[File:Atabook.gif|88px|link=https://ukernelperson.atabook.org|alt=Atabook]]<br /> &lt;!-- Free software &amp; tools --&gt;<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Ubuntu.png|88px|link=https://releases.ubuntu.com/jammy/|alt=Ubuntu]]<br /> [[File:Vim.gif|88px|link=https://www.vim.org|alt=Vim]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=76 MediaWiki:Citizen-footer-tagline 2026-08-11T10:11:34Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> <br /> &lt;!-- Identity --&gt;<br /> [[File:EnbyGQ.png|88px|link=https://badge.les.bi|alt=Enby and GenderQueer]]<br /> <br /> &lt;!-- Digital rights &amp; activism --&gt;<br /> [[File:Freespeech.gif|88px|link=https://www.eff.org/pages/blue-ribbon-campaign|alt=Free Speech]]<br /> [[File:Dbd.gif|88px|link=https://www.defectivebydesign.org/|alt=Defective by Design]]<br /> [[File:Nbai.png|88px|link=https://notbyai.fyi|alt=Written by humans not AI]]<br /> <br /> &lt;!-- Web culture &amp; community --&gt;<br /> [[File:IndieWeb.png|88px|link=https://indieweb.org|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|link=https://tildeverse.org|alt=Tildeverse]]<br /> [[File:Atabook.gif|88px|link=https://ukernelperson.atabook.org|alt=Atabook]]<br /> <br /> &lt;!-- Free software &amp; tools --&gt;<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Ubuntu.png|88px|link=https://releases.ubuntu.com/jammy/|alt=Ubuntu]]<br /> [[File:Vim.gif|88px|link=https://www.vim.org|alt=Vim]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=75 MediaWiki:Citizen-footer-tagline 2026-08-11T10:08:22Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Nbai.png|88px|link=https://notbyai.fyi|alt=Written by humans not AI]]<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Ubuntu.png|88px|link=https://releases.ubuntu.com/jammy/|88px|alt=Ubuntu]]<br /> [[File:IndieWeb.png|88px|link=https://indieweb.org|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|link=|link=https://tildeverse.org|alt=Tildeverse]]<br /> [[File:EnbyGQ.png|88px|link=https://badge.les.bi|alt=Enby and GenderQueer]]<br /> [[File:Freespeech.gif|88px|link=https://www.eff.org/pages/blue-ribbon-campaign|alt=Free Speech]]<br /> [[File:Vim.gif|88px|link=https://www.vim.org|alt=Vim]]<br /> [[File:Atabook.gif|88px|link=https://ukernelperson.atabook.org|alt=Atabook]]<br /> [[File:Dbd.gif|88px|link=https://www.defectivebydesign.org/|alt=Defective by Design]]<br /> [[File:Froggy.gif|88px|alt=froggy]]<br /> [[File:Email.gif|90x33px|link=mailto:ukernelperson@tilde.team|alt=Email for Suggestions]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=74 MediaWiki:Citizen-footer-tagline 2026-08-11T10:00:07Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Nbai.png|88px|link=https://notbyai.fyi|alt=Written by humans not AI]]<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Ubuntu.png|88px|link=https://releases.ubuntu.com/jammy/|88px|alt=Ubuntu]]<br /> [[File:IndieWeb.png|88px|link=https://indieweb.org|alt=Indie Web]]<br /> [[File:Eyes.gif|88px|alt=Eyes]]<br /> [[File:Tildeverse.png|88px|link=|link=https://tildeverse.org|alt=Tildeverse]]<br /> [[File:EnbyGQ.png|88px|link=https://badge.les.bi|alt=Enby and GenderQueer]]<br /> [[File:Freespeech.gif|88px|link=https://www.eff.org/pages/blue-ribbon-campaign|alt=Free Speech]]<br /> [[File:Vim.gif|88px|link=https://www.vim.org|alt=Vim]]<br /> [[File:Atabook.gif|88px|link=https://ukernelperson.atabook.org|alt=Atabook]]<br /> [[File:Dbd.gif|88px|link=https://www.defectivebydesign.org/|alt=Defective by Design]]<br /> [[File:Froggy.gif|88px|alt=froggy]]<br /> [[File:Email.gif|90x33px|link=mailto:ukernelperson@tilde.team|alt=Email for Suggestions]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:Froggy.gif&diff=73 File:Froggy.gif 2026-08-11T09:57:32Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=71 MediaWiki:Citizen-footer-tagline 2026-08-11T09:50:45Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Nbai.png|88px|link=https://notbyai.fyi|alt=Written by humans not AI]]<br /> [[File:Gnubanner.gif|88x33px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Ubuntu.png|88px|link=https://releases.ubuntu.com/jammy/|88px|alt=Ubuntu]]<br /> [[File:IndieWeb.png|88px|link=https://indieweb.org|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|link=|link=https://tildeverse.org|alt=Tildeverse]]<br /> [[File:EnbyGQ.png|88px|link=https://badge.les.bi|alt=Enby and GenderQueer]]<br /> [[File:Freespeech.gif|88px|link=https://www.eff.org/pages/blue-ribbon-campaign|alt=Free Speech]]<br /> [[File:Vim.gif|88px|link=https://www.vim.org|alt=Vim]]<br /> [[File:Atabook.gif|88px|link=https://ukernelperson.atabook.org|alt=Atabook]]<br /> [[File:Dbd.gif|88px|link=https://www.defectivebydesign.org/|alt=Defective by Design]]<br /> [[File:Email.gif|90px|link=mailto:harshabhattacharyya@disroot.org|alt=Email for Suggestions]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=70 MediaWiki:Citizen-footer-tagline 2026-08-11T09:49:15Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Nbai.png|88px|link=https://notbyai.fyi|alt=Written by humans not AI]]<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Ubuntu.png|88px|link=https://releases.ubuntu.com/jammy/|88px|alt=Ubuntu]]<br /> [[File:IndieWeb.png|88px|link=https://indieweb.org|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|link=|link=https://tildeverse.org|alt=Tildeverse]]<br /> [[File:EnbyGQ.png|88px|link=https://badge.les.bi|alt=Enby and GenderQueer]]<br /> [[File:Freespeech.gif|88px|link=https://www.eff.org/pages/blue-ribbon-campaign|alt=Free Speech]]<br /> [[File:Vim.gif|88px|link=https://www.vim.org|alt=Vim]]<br /> [[File:Atabook.gif|88px|link=https://ukernelperson.atabook.org|alt=Atabook]]<br /> [[File:Dbd.gif|88px|link=https://www.defectivebydesign.org/|alt=Defective by Design]]<br /> [[File:Email.gif|90px|link=mailto:harshabhattacharyya@disroot.org|alt=Email for Suggestions]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=69 MediaWiki:Citizen-footer-tagline 2026-08-11T09:47:53Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Nbai.png|88px|link=https://notbyai.fyi|alt=Written by humans not AI]]<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Ubuntu.png|88px|link=https://releases.ubuntu.com/jammy/|88px|alt=Ubuntu]]<br /> [[File:IndieWeb.png|88px|link=https://indieweb.org|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|link=|link=https://tildeverse.org|alt=Tildeverse]]<br /> [[File:EnbyGQ.png|88px|link=https://badge.les.bi|alt=Enby and GenderQueer]]<br /> [[File:Freespeech.gif|88px|link=https://www.eff.org/pages/blue-ribbon-campaign|alt=Free Speech]]<br /> [[File:Vim.gif|88px|link=https://www.vim.org|alt=Vim]]<br /> [[File:Atabook.gif|88px|link=https://ukernelperson.atabook.org|alt=Atabook]]<br /> [[File:Dbd.gif|88px|link=https://www.defectivebydesign.org/|alt=Defective by Design]]<br /> [[File:Email.gif|88px|link=mailto:harshabhattacharyya@disroot.org|alt=Email for Suggestions]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:Ubuntu.png&diff=68 File:Ubuntu.png 2026-08-11T09:41:15Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:Dbd.gif&diff=67 File:Dbd.gif 2026-08-11T09:40:53Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:Email.gif&diff=66 File:Email.gif 2026-08-11T09:40:35Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=Main_Page&diff=65 Main Page 2026-08-11T08:08:33Z <p>Ukernelperson: /* ukernelperson&#039;s Trove: My Personal Site */</p> <hr /> <div>= ukernelperson's Trove: My Personal Site =<br /> <br /> [[File:UnderC.gif|88px|center|alt=Under Construction]]<br /> <br /> I pledge to provide good maintenance &lt;small&gt;but the [[ukernelperson's_Trove:General_disclaimer|disclaimer]] still holds.&lt;/small&gt;<br /> <br /> &lt;poem style=&quot;font-style: italic;&quot;&gt;<br /> Thus my story endeth;<br /> The Natiya-thorn withereth,<br /> :et cetera, et cetera...<br /> &lt;/poem&gt;</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:UnderC.gif&diff=64 File:UnderC.gif 2026-08-11T08:05:54Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=Main_Page&diff=63 Main Page 2026-08-11T08:00:55Z <p>Ukernelperson: /* ukernelperson&#039;s Trove: My Personal Site */</p> <hr /> <div>= ukernelperson's Trove: My Personal Site =<br /> <br /> I pledge to provide good maintenance &lt;small&gt;but the [[ukernelperson's_Trove:General_disclaimer|disclaimer]] still holds.&lt;/small&gt;<br /> <br /> &lt;poem style=&quot;font-style: italic;&quot;&gt;<br /> Thus my story endeth;<br /> The Natiya-thorn withereth,<br /> :et cetera, et cetera...<br /> &lt;/poem&gt;</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=Main_Page&diff=62 Main Page 2026-08-11T08:00:08Z <p>Ukernelperson: /* ukernelperson&#039;s Trove: My Personal Site */</p> <hr /> <div>= ukernelperson's Trove: My Personal Site =<br /> <br /> I pledge to provide good maintenance &lt;small&gt;but the [[ukernelperson's_Trove:General_disclaimer|disclaimer]] still holds.&lt;/small&gt;<br /> <br /> &lt;poem&gt;<br /> Thus my story endeth;<br /> The Natiya-thorn withereth,<br /> :et cetera, et cetera...<br /> &lt;/poem&gt;</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=Main_Page&diff=61 Main Page 2026-08-11T07:15:59Z <p>Ukernelperson: /* ukernelperson&#039;s Trove: My Personal Site */</p> <hr /> <div>= ukernelperson's Trove: My Personal Site =<br /> <br /> I pledge to provide good maintenance &lt;small&gt;but the [[ukernelperson's_Trove:General_disclaimer|disclaimer]] still holds.&lt;/small&gt;<br /> <br /> Thus my story endeth,<br /> The Natiya-thorn withereth, et cetera, et cetera...</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Common.css&diff=60 MediaWiki:Common.css 2026-08-10T13:22:35Z <p>Ukernelperson: </p> <hr /> <div>/* CSS placed here will be applied to all skins */<br /> .mw-logo-icon {<br /> width: 85px !important; /* Adjust size */<br /> height: 85px !important;<br /> }<br /> .citizen-header__logo {<br /> display: none !important;<br /> }<br /> /* Hide top statistics counters (Pages, Files, Users, Admins) */<br /> .citizen-drawer__stats {<br /> display: none !important;<br /> }<br /> <br /> /* Hide Help about MediaWiki in the navigation drawer */<br /> .citizen-drawer #n-help,<br /> .citizen-drawer a[href*=&quot;Help:Contents&quot;] {<br /> display: none !important;<br /> }<br /> <br /> /* Hide Special Pages in the navigation drawer */<br /> .citizen-drawer #t-specialpages {<br /> display: none !important;<br /> }<br /> <br /> /* Remove white background from footer badges */<br /> .mw-footer li img,<br /> #footer-icons img,<br /> .footer-icons img {<br /> background: transparent !important;<br /> background-color: transparent !important;<br /> }<br /> <br /> #footer-info-lastmod {<br /> display: none;<br /> }<br /> <br /> /* Safely hide ONLY the top-right last modified block without touching the layout index */<br /> .citizen-page-meta-item.citizen-page-meta-item--last-modified {<br /> display: none !important;<br /> }</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Common.css&diff=59 MediaWiki:Common.css 2026-08-10T13:20:21Z <p>Ukernelperson: </p> <hr /> <div>/* CSS placed here will be applied to all skins */<br /> .mw-logo-icon {<br /> width: 85px !important; /* Adjust size */<br /> height: 85px !important;<br /> }<br /> .citizen-header__logo {<br /> display: none !important;<br /> }<br /> /* Hide top statistics counters (Pages, Files, Users, Admins) */<br /> .citizen-drawer__stats {<br /> display: none !important;<br /> }<br /> <br /> /* Hide Help about MediaWiki in the navigation drawer */<br /> .citizen-drawer #n-help,<br /> .citizen-drawer a[href*=&quot;Help:Contents&quot;] {<br /> display: none !important;<br /> }<br /> <br /> /* Hide Special Pages in the navigation drawer */<br /> .citizen-drawer #t-specialpages {<br /> display: none !important;<br /> }<br /> <br /> /* Remove white background from footer badges */<br /> .mw-footer li img,<br /> #footer-icons img,<br /> .footer-icons img {<br /> background: transparent !important;<br /> background-color: transparent !important;<br /> }<br /> <br /> #footer-info-lastmod {<br /> display: none;<br /> }<br /> <br /> /* Hide the last edited timestamp in the Citizen skin sidebar/right area */<br /> #citizen-sidebar-lastmod,<br /> .citizen-footer__info-lastmod {<br /> display: none !important;<br /> }</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=Main_Page&diff=58 Main Page 2026-08-09T12:48:31Z <p>Ukernelperson: </p> <hr /> <div>= ukernelperson's Trove: My Personal Site =<br /> <br /> I pledge to provide good maintenance &lt;small&gt;but the [[ukernelperson's_Trove:General_disclaimer|disclaimer]] still holds.&lt;/small&gt;</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=Main_Page&diff=57 Main Page 2026-08-09T12:48:18Z <p>Ukernelperson: </p> <hr /> <div>= ukernelperson's Trove: My Personal Site =<br /> <br /> I pledge to provide good maintenance&lt;small&gt;but the [[ukernelperson's_Trove:General_disclaimer|disclaimer]] still holds.&lt;/small&gt;</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=Main_Page&diff=56 Main Page 2026-08-09T12:47:54Z <p>Ukernelperson: </p> <hr /> <div>= ukernelperson's Trove: My Personal Site =<br /> <br /> I pledge to provide good maintenance&lt;sub&gt;but the [[ukernelperson's_Trove:General_disclaimer|disclaimer]] still holds.&lt;/sub&gt;</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=Main_Page&diff=55 Main Page 2026-08-09T12:40:50Z <p>Ukernelperson: Replaced content with &quot;= ukernelperson&#039;s Trove: My personal site =&quot;</p> <hr /> <div>= ukernelperson's Trove: My personal site =</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=54 MediaWiki:Citizen-footer-tagline 2026-08-09T05:19:09Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Nbai.png|88px|link=https://notbyai.fyi|alt=Written by humans not AI]]<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:IndieWeb.png|88px|link=https://indieweb.org|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|link=|link=https://tildeverse.org|alt=Tildeverse]]<br /> [[File:EnbyGQ.png|88px|link=https://badge.les.bi|alt=Enby and GenderQueer]]<br /> [[File:Freespeech.gif|88px|link=https://www.eff.org/pages/blue-ribbon-campaign|alt=Free Speech]]<br /> [[File:Vim.gif|88px|link=https://www.vim.org|alt=Vim]]<br /> [[File:Atabook.gif|88px|link=https://ukernelperson.atabook.org|alt=Atabook]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=53 MediaWiki:Citizen-footer-tagline 2026-08-09T05:16:24Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Nbai.png|88px|alt=Written by humans not AI]]<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:IndieWeb.png|88px|link=https://indieweb.org|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|link=|link=https://tildeverse.org|alt=Tildeverse]]<br /> [[File:EnbyGQ.png|88px|link=https://badge.les.bi|alt=Enby and GenderQueer]]<br /> [[File:Freespeech.gif|88px|link=https://www.eff.org/pages/blue-ribbon-campaign|alt=Free Speech]]<br /> [[File:Vim.gif|88px|link=https://www.vim.org|alt=Vim]]<br /> [[File:Atabook.gif|88px|link=https://ukernelperson.atabook.org|alt=Atabook]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=52 MediaWiki:Citizen-footer-tagline 2026-08-09T05:10:26Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Nbai.png|88px|alt=Written by humans not AI]]<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:IndieWeb.png|88px|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|alt=Tildeverse]]<br /> [[File:EnbyGQ.png|88px|alt=Enby and GenderQueer]]<br /> [[File:Freespeech.gif|88px|alt=Free Speech]]<br /> [[File:Vim.gif|88px|alt=Vim]]<br /> [[File:Atabook.gif|88px|alt=Atabook]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:Atabook.gif&diff=51 File:Atabook.gif 2026-08-09T05:07:39Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:Vim.gif&diff=50 File:Vim.gif 2026-08-09T05:07:13Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:Freespeech.gif&diff=49 File:Freespeech.gif 2026-08-09T05:06:57Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=48 MediaWiki:Citizen-footer-tagline 2026-08-08T14:51:59Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Nbai.png|88px|alt=Written by humans not AI]]<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:IndieWeb.png|88px|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|alt=Tildeverse]]<br /> [[File:EnbyGQ.png|88px|alt=Enby and GenderQueer]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:EnbyGQ.png&diff=47 File:EnbyGQ.png 2026-08-08T14:48:22Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=46 MediaWiki:Citizen-footer-tagline 2026-08-08T14:46:57Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Nbai.png|88px|alt=Written by humans not AI]]<br /> [[File:IndieWeb.png|88px|alt=Indie Web]]<br /> [[File:Tildeverse.png|88px|alt=Tildeverse]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=45 MediaWiki:Citizen-footer-tagline 2026-08-08T14:43:19Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Nbai.png|88px|alt=Written by humans not AI]]<br /> [[File:IndieWeb.png|88px|alt=Indie Web]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=44 MediaWiki:Citizen-footer-tagline 2026-08-08T14:42:12Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Gnubanner.gif|88px|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Nbai.png|88px|alt=Written by humans not AI]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=43 MediaWiki:Citizen-footer-tagline 2026-08-08T14:40:27Z <p>Ukernelperson: </p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;<br /> [[File:Gnubanner.png|link=https://gnu.org|alt=GNU 88x31 badge]]<br /> [[File:Nbai.png|alt=Written by humans not AI]]</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:Nbai.png&diff=42 File:Nbai.png 2026-08-08T14:36:45Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:Tildeverse.png&diff=41 File:Tildeverse.png 2026-08-08T14:34:59Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:IndieWeb.png&diff=40 File:IndieWeb.png 2026-08-08T14:34:36Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=File:Gnubanner.gif&diff=39 File:Gnubanner.gif 2026-08-08T14:34:06Z <p>Ukernelperson: </p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-tagline&diff=38 MediaWiki:Citizen-footer-tagline 2026-08-08T14:25:31Z <p>Ukernelperson: Created page with &quot;&lt;!-- alt=Our Wiki Logo --&gt;&quot;</p> <hr /> <div>&lt;!-- [[File:Your_Logo_Name.png|150px|link=Main Page|alt=Our Wiki Logo]] --&gt;</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen-footer-desc&diff=37 MediaWiki:Citizen-footer-desc 2026-08-08T12:53:36Z <p>Ukernelperson: Created page with &quot;Because fens don&#039;t need be quiet.&quot;</p> <hr /> <div>Because fens don't need be quiet.</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Common.css&diff=36 MediaWiki:Common.css 2026-08-08T12:38:09Z <p>Ukernelperson: </p> <hr /> <div>/* CSS placed here will be applied to all skins */<br /> .mw-logo-icon {<br /> width: 85px !important; /* Adjust size */<br /> height: 85px !important;<br /> }<br /> .citizen-header__logo {<br /> display: none !important;<br /> }<br /> /* Hide top statistics counters (Pages, Files, Users, Admins) */<br /> .citizen-drawer__stats {<br /> display: none !important;<br /> }<br /> <br /> /* Hide Help about MediaWiki in the navigation drawer */<br /> .citizen-drawer #n-help,<br /> .citizen-drawer a[href*=&quot;Help:Contents&quot;] {<br /> display: none !important;<br /> }<br /> <br /> /* Hide Special Pages in the navigation drawer */<br /> .citizen-drawer #t-specialpages {<br /> display: none !important;<br /> }<br /> <br /> /* Remove white background from footer badges */<br /> .mw-footer li img,<br /> #footer-icons img,<br /> .footer-icons img {<br /> background: transparent !important;<br /> background-color: transparent !important;<br /> }<br /> <br /> #footer-info-lastmod {<br /> display: none;<br /> }</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen.css&diff=35 MediaWiki:Citizen.css 2026-08-08T12:07:40Z <p>Ukernelperson: Blanked the page</p> <hr /> <div></div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen.css&diff=34 MediaWiki:Citizen.css 2026-08-08T12:05:49Z <p>Ukernelperson: </p> <hr /> <div>/**<br /> * MediaWiki:Citizen.css<br /> * Gruvbox dark palette applied directly to the Citizen skin.<br /> * - Headings: gothic font (Sorgath, self-hosted — see @font-face below)<br /> * - Code: Space Mono<br /> * No blur, no transparency, no transform tricks — solid colors only,<br /> * for reliable cross-browser behavior.<br /> */<br /> <br /> @import url('https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&amp;family=Space+Mono:wght@400;700&amp;display=swap');<br /> <br /> /* Sorgath must be self-hosted (not on Google Fonts). Fill in your uploaded<br /> URL below; until then this silently falls back to UnifrakturMaguntia. */<br /> @font-face {<br /> font-family: 'Sorgath';<br /> src: url('https://your-font-host.example/Sorgath.woff2') format('woff2');<br /> font-weight: 400;<br /> font-style: normal;<br /> font-display: swap;<br /> }<br /> <br /> /* ==========================================================================<br /> 1. GRUVBOX PALETTE (original, unmodified hex values)<br /> ========================================================================== */<br /> <br /> :root {<br /> --gb-bg0-hard: #1d2021;<br /> --gb-bg0: #282828;<br /> --gb-bg0-soft: #32302f;<br /> --gb-bg1: #3c3836;<br /> --gb-bg2: #504945;<br /> --gb-bg3: #665c54;<br /> --gb-bg4: #7c6f64;<br /> <br /> --gb-fg0: #fbf1c7;<br /> --gb-fg1: #ebdbb2;<br /> --gb-fg2: #d5c4a1;<br /> --gb-fg3: #bdae93;<br /> --gb-fg4: #a89984;<br /> <br /> --gb-red: #fb4934;<br /> --gb-green: #b8bb26;<br /> --gb-yellow: #fabd2f;<br /> --gb-blue: #83a598;<br /> --gb-purple: #d3869b;<br /> --gb-aqua: #8ec07c;<br /> --gb-orange: #fe8019;<br /> --gb-gray: #928374;<br /> <br /> --gb-font-gothic: 'Sorgath', 'UnifrakturMaguntia', 'Old English Text MT', serif;<br /> --gb-font-mono: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;<br /> }<br /> <br /> /* ==========================================================================<br /> 2. CITIZEN SKIN VARIABLES — mapped directly to Gruvbox, always dark<br /> ========================================================================== */<br /> <br /> html {<br /> --background-color-base: var(--gb-bg0);<br /> --background-color-neutral: var(--gb-bg0-soft);<br /> --background-color-neutral-subtle: var(--gb-bg1);<br /> --background-color-interactive: var(--gb-bg1);<br /> --background-color-interactive-subtle: var(--gb-bg0-soft);<br /> <br /> --color-base: var(--gb-fg1);<br /> --color-base--subtle: var(--gb-fg3);<br /> --color-emphasized: var(--gb-fg0);<br /> --color-subtle: var(--gb-fg4);<br /> --color-disabled: var(--gb-bg4);<br /> <br /> --color-link: var(--gb-blue);<br /> --color-link--hover: var(--gb-aqua);<br /> --color-link--visited: var(--gb-purple);<br /> --color-link-red: var(--gb-red);<br /> <br /> --border-color-base: var(--gb-bg3);<br /> --border-color-subtle: var(--gb-bg2);<br /> <br /> --background-color-progressive: var(--gb-blue);<br /> --color-progressive: var(--gb-blue);<br /> --background-color-destructive: var(--gb-red);<br /> --color-destructive: var(--gb-red);<br /> --background-color-warning: var(--gb-yellow);<br /> --background-color-success: var(--gb-green);<br /> <br /> --color-content-added: var(--gb-green);<br /> --color-content-removed: var(--gb-red);<br /> <br /> color-scheme: dark;<br /> }<br /> <br /> /* Hide the light/dark toggle since this theme is dark-only */<br /> .citizen-theme-toggle,<br /> #citizen-theme-toggle-form {<br /> display: none !important;<br /> }<br /> <br /> /* ==========================================================================<br /> 3. BASE APPLICATION<br /> ========================================================================== */<br /> <br /> body,<br /> .citizen-page,<br /> #mw-content-text {<br /> background-color: var(--background-color-base);<br /> color: var(--color-base);<br /> }<br /> <br /> a { color: var(--color-link); }<br /> a:visited { color: var(--color-link--visited); }<br /> a:hover { color: var(--color-link--hover); }<br /> a.new { color: var(--color-link-red); }<br /> <br /> .citizen-header,<br /> .citizen-header-container,<br /> #mw-panel,<br /> .citizen-footer,<br /> .citizen-sidebar {<br /> background-color: var(--background-color-neutral);<br /> border-color: var(--border-color-base);<br /> }<br /> <br /> .citizen-card,<br /> .mw-message-box,<br /> .infobox,<br /> table.wikitable {<br /> background-color: var(--background-color-neutral-subtle);<br /> border-color: var(--border-color-subtle);<br /> color: var(--color-base);<br /> }<br /> <br /> table.wikitable &gt; tr &gt; th,<br /> table.wikitable &gt; * &gt; tr &gt; th {<br /> background-color: var(--background-color-interactive);<br /> color: var(--color-emphasized);<br /> }<br /> <br /> .cdx-button,<br /> .citizen-button {<br /> background-color: var(--background-color-interactive);<br /> border-color: var(--border-color-base);<br /> color: var(--color-base);<br /> }<br /> .cdx-button--action-progressive,<br /> .citizen-button--primary {<br /> background-color: var(--background-color-progressive);<br /> color: var(--gb-fg0);<br /> }<br /> .cdx-button--action-destructive {<br /> background-color: var(--background-color-destructive);<br /> color: var(--gb-fg0);<br /> }<br /> <br /> .diff-addedline { background-color: color-mix(in srgb, var(--color-content-added) 20%, transparent); }<br /> .diff-deletedline { background-color: color-mix(in srgb, var(--color-content-removed) 20%, transparent); }<br /> <br /> /* ==========================================================================<br /> 4. TYPOGRAPHY — GOTHIC HEADINGS + YELLOW ACCENTS<br /> ========================================================================== */<br /> <br /> .mw-body h1,<br /> .mw-body h2,<br /> .mw-body h3,<br /> .mw-body h4,<br /> .mw-body h5,<br /> .mw-body h6,<br /> .citizen-page-header .mw-page-title,<br /> .citizen-sitename {<br /> font-family: var(--gb-font-gothic);<br /> font-weight: 400;<br /> letter-spacing: 0.02em;<br /> color: var(--color-emphasized);<br /> }<br /> <br /> .mw-body h1,<br /> .citizen-page-header .mw-page-title {<br /> font-size: 2.4em;<br /> border-bottom: 2px solid var(--gb-yellow);<br /> padding-bottom: 0.2em;<br /> }<br /> <br /> .mw-body h2 {<br /> font-size: 1.8em;<br /> border-bottom: 1px solid var(--gb-yellow);<br /> }<br /> <br /> .mw-body h3 { font-size: 1.4em; }<br /> .mw-body h4 { font-size: 1.15em; }<br /> <br /> ::selection {<br /> background-color: var(--gb-yellow);<br /> color: var(--gb-bg0-hard);<br /> }<br /> <br /> .mw-body blockquote {<br /> border-left: 3px solid var(--gb-yellow);<br /> padding-left: 1em;<br /> color: var(--color-base--subtle);<br /> }<br /> <br /> .citizen-menu__item--active &gt; a,<br /> li.selected a {<br /> color: var(--gb-yellow);<br /> font-weight: 700;<br /> }<br /> <br /> /* ==========================================================================<br /> 5. TYPOGRAPHY — SPACE MONO FOR CODE<br /> ========================================================================== */<br /> <br /> code,<br /> pre,<br /> kbd,<br /> samp,<br /> tt,<br /> .mw-code,<br /> textarea#wpTextbox1 {<br /> font-family: var(--gb-font-mono);<br /> }<br /> <br /> pre,<br /> .mw-highlight {<br /> background-color: var(--gb-bg0-hard);<br /> color: var(--gb-fg1);<br /> border: 1px solid var(--border-color-base);<br /> border-radius: 4px;<br /> padding: 0.75em 1em;<br /> overflow-x: auto;<br /> }<br /> <br /> code {<br /> background-color: var(--background-color-interactive-subtle);<br /> color: var(--gb-orange);<br /> padding: 0.1em 0.35em;<br /> border-radius: 3px;<br /> font-size: 0.9em;<br /> }<br /> <br /> .mw-highlight .k { color: var(--gb-red); }<br /> .mw-highlight .s,<br /> .mw-highlight .s2 { color: var(--gb-green); }<br /> .mw-highlight .c,<br /> .mw-highlight .c1 { color: var(--gb-fg4); font-style: italic; }<br /> .mw-highlight .nf { color: var(--gb-blue); }<br /> .mw-highlight .mi,<br /> .mw-highlight .mf { color: var(--gb-purple); }<br /> .mw-highlight .o { color: var(--gb-orange); }<br /> <br /> /* ==========================================================================<br /> 6. SCROLLBAR<br /> ========================================================================== */<br /> <br /> ::-webkit-scrollbar {<br /> width: 12px;<br /> height: 12px;<br /> }<br /> ::-webkit-scrollbar-track {<br /> background: var(--gb-bg0);<br /> }<br /> ::-webkit-scrollbar-thumb {<br /> background: var(--gb-bg3);<br /> border-radius: 6px;<br /> }</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen.css&diff=33 MediaWiki:Citizen.css 2026-08-08T11:52:42Z <p>Ukernelperson: </p> <hr /> <div>/**<br /> * MediaWiki:Citizen.css<br /> * Gruvbox-themed skin for the Citizen skin<br /> * - Palette: original Gruvbox (dark + light, hard/medium/soft contrast bg0 used)<br /> * - Headings: gothic (blackletter) display font<br /> * - Code/monospace: Space Mono<br /> *<br /> * Import fonts first (Google Fonts). If your wiki blocks external font<br /> * requests, self-host these instead and swap the @import for @font-face.<br /> */<br /> <br /> @import url('https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&amp;family=Space+Mono:wght@400;700&amp;display=swap');<br /> <br /> /* Sorgath is not on Google Fonts / a free CDN — it must be self-hosted.<br /> Upload the font file to your wiki (e.g. via Special:Upload) or another<br /> host you control, then point src at that URL. Until you fill this in,<br /> the stack below falls back to UnifrakturMaguntia. */<br /> @font-face {<br /> font-family: 'Sorgath';<br /> src: url('https://your-wiki-domain.example/path/to/Sorgath.woff2') format('woff2'),<br /> url('https://your-wiki-domain.example/path/to/Sorgath.otf') format('opentype');<br /> font-weight: 400;<br /> font-style: normal;<br /> font-display: swap;<br /> }<br /> <br /> /* ==========================================================================<br /> 1. GRUVBOX PALETTE (original, unmodified hex values from morhetz/gruvbox)<br /> ========================================================================== */<br /> <br /> :root {<br /> /* Dark mode - background */<br /> --gb-dark-bg0-hard: #1d2021;<br /> --gb-dark-bg0: #282828;<br /> --gb-dark-bg0-soft: #32302f;<br /> --gb-dark-bg1: #3c3836;<br /> --gb-dark-bg2: #504945;<br /> --gb-dark-bg3: #665c54;<br /> --gb-dark-bg4: #7c6f64;<br /> <br /> /* Dark mode - foreground */<br /> --gb-dark-fg0: #fbf1c7;<br /> --gb-dark-fg1: #ebdbb2;<br /> --gb-dark-fg2: #d5c4a1;<br /> --gb-dark-fg3: #bdae93;<br /> --gb-dark-fg4: #a89984;<br /> <br /> /* Light mode - background */<br /> --gb-light-bg0-hard: #f9f5d7;<br /> --gb-light-bg0: #fbf1c7;<br /> --gb-light-bg0-soft: #f2e5bc;<br /> --gb-light-bg1: #ebdbb2;<br /> --gb-light-bg2: #d5c4a1;<br /> --gb-light-bg3: #bdae93;<br /> --gb-light-bg4: #a89984;<br /> <br /> /* Light mode - foreground */<br /> --gb-light-fg0: #282828;<br /> --gb-light-fg1: #3c3836;<br /> --gb-light-fg2: #504945;<br /> --gb-light-fg3: #665c54;<br /> --gb-light-fg4: #7c6f64;<br /> <br /> /* Neutral accents (same value both modes, per original palette) */<br /> --gb-neutral-red: #cc241d;<br /> --gb-neutral-green: #98971a;<br /> --gb-neutral-yellow: #d79921;<br /> --gb-neutral-blue: #458588;<br /> --gb-neutral-purple: #b16286;<br /> --gb-neutral-aqua: #689d6a;<br /> --gb-neutral-orange: #d65d0e;<br /> --gb-neutral-gray: #928374;<br /> <br /> /* Bright accents (dark mode) */<br /> --gb-bright-red: #fb4934;<br /> --gb-bright-green: #b8bb26;<br /> --gb-bright-yellow: #fabd2f;<br /> --gb-bright-blue: #83a598;<br /> --gb-bright-purple: #d3869b;<br /> --gb-bright-aqua: #8ec07c;<br /> --gb-bright-orange: #fe8019;<br /> --gb-bright-gray: #928374;<br /> <br /> /* Faded accents (light mode) */<br /> --gb-faded-red: #9d0006;<br /> --gb-faded-green: #79740e;<br /> --gb-faded-yellow: #b57614;<br /> --gb-faded-blue: #076678;<br /> --gb-faded-purple: #8f3f71;<br /> --gb-faded-aqua: #427b58;<br /> --gb-faded-orange: #af3a03;<br /> --gb-faded-gray: #7c6f64;<br /> <br /> /* Fonts */<br /> --gb-font-gothic: 'Sorgath', 'UnifrakturMaguntia', 'Old English Text MT', 'Pfeffer Mediaeval', serif;<br /> --gb-font-mono: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;<br /> }<br /> <br /> /* ==========================================================================<br /> 2. CITIZEN SKIN — DARK MODE MAPPING<br /> ========================================================================== */<br /> <br /> html,<br /> html.skin-theme-clientpref-night,<br /> html.skin-theme-clientpref-day,<br /> html.skin-theme-clientpref-os {<br /> --background-color-base: var(--gb-dark-bg0);<br /> --background-color-neutral: var(--gb-dark-bg0-soft);<br /> --background-color-neutral-subtle: var(--gb-dark-bg1);<br /> --background-color-interactive: var(--gb-dark-bg1);<br /> --background-color-interactive-subtle: var(--gb-dark-bg0-soft);<br /> <br /> --color-base: var(--gb-dark-fg1);<br /> --color-base--subtle: var(--gb-dark-fg3);<br /> --color-emphasized: var(--gb-dark-fg0);<br /> --color-subtle: var(--gb-dark-fg4);<br /> --color-disabled: var(--gb-dark-bg4);<br /> <br /> --color-link: var(--gb-bright-blue);<br /> --color-link--hover: var(--gb-bright-aqua);<br /> --color-link--visited: var(--gb-bright-purple);<br /> --color-link-red: var(--gb-bright-red);<br /> <br /> --border-color-base: var(--gb-dark-bg3);<br /> --border-color-subtle: var(--gb-dark-bg2);<br /> <br /> --background-color-progressive: var(--gb-neutral-blue);<br /> --color-progressive: var(--gb-bright-blue);<br /> --background-color-destructive: var(--gb-neutral-red);<br /> --color-destructive: var(--gb-bright-red);<br /> --background-color-warning: var(--gb-neutral-yellow);<br /> --background-color-success: var(--gb-neutral-green);<br /> <br /> --color-content-added: var(--gb-bright-green);<br /> --color-content-removed: var(--gb-bright-red);<br /> <br /> color-scheme: dark;<br /> }<br /> <br /> /* ==========================================================================<br /> 3. LIGHT MODE — DISABLED (dark mode is forced site-wide, see §2)<br /> The light-mode variable block has been removed on purpose. The theme<br /> toggle is also hidden below so visitors can't flip back to light.<br /> ========================================================================== */<br /> <br /> .citizen-theme-toggle,<br /> #citizen-theme-toggle-form,<br /> [data-mw-loader-name*=&quot;theme.toggle&quot;] {<br /> display: none !important;<br /> }<br /> <br /> /* ==========================================================================<br /> 4. BASE APPLICATION<br /> ========================================================================== */<br /> <br /> body,<br /> .citizen-page,<br /> #mw-content-text {<br /> background-color: var(--background-color-base);<br /> color: var(--color-base);<br /> }<br /> <br /> a {<br /> color: var(--color-link);<br /> }<br /> a:visited {<br /> color: var(--color-link--visited);<br /> }<br /> a:hover {<br /> color: var(--color-link--hover);<br /> }<br /> a.new {<br /> color: var(--color-link-red);<br /> }<br /> <br /> /* Header / sidebar / footer surfaces */<br /> .citizen-header,<br /> .citizen-header-container,<br /> #mw-panel,<br /> .citizen-footer,<br /> .citizen-sidebar {<br /> background-color: var(--background-color-neutral);<br /> border-color: color-mix(in srgb, var(--border-color-base) 40%, transparent);<br /> }<br /> <br /> /* Cards, boxes, infoboxes */<br /> .citizen-card,<br /> .mw-message-box,<br /> .infobox,<br /> table.wikitable {<br /> background-color: var(--background-color-neutral-subtle);<br /> border-color: var(--border-color-subtle);<br /> color: var(--color-base);<br /> }<br /> <br /> table.wikitable &gt; tr &gt; th,<br /> table.wikitable &gt; * &gt; tr &gt; th {<br /> background-color: var(--background-color-interactive);<br /> color: var(--color-emphasized);<br /> }<br /> <br /> /* Buttons */<br /> .cdx-button,<br /> .citizen-button {<br /> background-color: var(--background-color-interactive);<br /> border-color: var(--border-color-base);<br /> color: var(--color-base);<br /> }<br /> .cdx-button--action-progressive,<br /> .citizen-button--primary {<br /> background-color: var(--background-color-progressive);<br /> color: var(--gb-dark-fg0);<br /> }<br /> .cdx-button--action-destructive {<br /> background-color: var(--background-color-destructive);<br /> color: var(--gb-dark-fg0);<br /> }<br /> <br /> /* diff colors */<br /> .diff-addedline {<br /> background-color: color-mix(in srgb, var(--color-content-added) 20%, transparent);<br /> }<br /> .diff-deletedline {<br /> background-color: color-mix(in srgb, var(--color-content-removed) 20%, transparent);<br /> }<br /> <br /> /* ==========================================================================<br /> 5. TYPOGRAPHY — GOTHIC HEADINGS<br /> ========================================================================== */<br /> <br /> .mw-body h1,<br /> .mw-body h2,<br /> .mw-body h3,<br /> .mw-body h4,<br /> .mw-body h5,<br /> .mw-body h6,<br /> .citizen-page-header .mw-page-title,<br /> .citizen-sitename {<br /> font-family: var(--gb-font-gothic);<br /> font-weight: 400;<br /> letter-spacing: 0.02em;<br /> color: var(--color-emphasized);<br /> }<br /> <br /> .mw-body h1,<br /> .citizen-page-header .mw-page-title {<br /> font-size: 2.4em;<br /> border-bottom: 2px solid var(--gb-bright-yellow);<br /> padding-bottom: 0.2em;<br /> }<br /> <br /> .mw-body h2 {<br /> font-size: 1.8em;<br /> border-bottom: 1px solid var(--gb-neutral-yellow);<br /> }<br /> <br /> /* Text selection - a Gruvbox signature */<br /> ::selection {<br /> background-color: var(--gb-bright-yellow);<br /> color: var(--gb-dark-bg0-hard);<br /> }<br /> <br /> /* Blockquotes get a yellow rail */<br /> .mw-body blockquote {<br /> border-left: 3px solid var(--gb-bright-yellow);<br /> padding-left: 1em;<br /> color: var(--color-base--subtle);<br /> }<br /> <br /> /* Active nav / tab state picks up yellow instead of the default blue */<br /> .citizen-menu__item--active &gt; a,<br /> .vector-tab-noicon.selected a,<br /> li.selected a {<br /> color: var(--gb-bright-yellow);<br /> font-weight: 700;<br /> }<br /> <br /> .mw-body h3 { font-size: 1.4em; }<br /> .mw-body h4 { font-size: 1.15em; }<br /> <br /> /* ==========================================================================<br /> 6. TYPOGRAPHY — SPACE MONO FOR CODE<br /> ========================================================================== */<br /> <br /> code,<br /> pre,<br /> kbd,<br /> samp,<br /> tt,<br /> .mw-code,<br /> .cdx-text-input__input.cdx-mono,<br /> textarea#wpTextbox1 {<br /> font-family: var(--gb-font-mono);<br /> }<br /> <br /> pre,<br /> .mw-highlight {<br /> background-color: var(--gb-dark-bg0-hard);<br /> color: var(--gb-dark-fg1);<br /> border: 1px solid var(--border-color-base);<br /> border-radius: 4px;<br /> padding: 0.75em 1em;<br /> overflow-x: auto;<br /> }<br /> <br /> code {<br /> background-color: var(--background-color-interactive-subtle);<br /> color: var(--gb-bright-orange);<br /> padding: 0.1em 0.35em;<br /> border-radius: 3px;<br /> font-size: 0.9em;<br /> }<br /> <br /> /* Syntax highlighting accents (if SyntaxHighlight/Pygments classes are present) */<br /> .mw-highlight .k { color: var(--gb-bright-red); } /* keyword */<br /> .mw-highlight .s,<br /> .mw-highlight .s2 { color: var(--gb-bright-green); } /* string */<br /> .mw-highlight .c,<br /> .mw-highlight .c1 { color: var(--gb-dark-fg4); font-style: italic; } /* comment */<br /> .mw-highlight .nf { color: var(--gb-bright-blue); } /* function name */<br /> .mw-highlight .mi,<br /> .mw-highlight .mf { color: var(--gb-bright-purple); } /* numbers */<br /> .mw-highlight .o { color: var(--gb-bright-orange); } /* operator */<br /> <br /> /* ==========================================================================<br /> 7. SCROLLBAR (dark mode nicety)<br /> ========================================================================== */<br /> <br /> ::-webkit-scrollbar {<br /> width: 12px;<br /> }<br /> ::-webkit-scrollbar-track {<br /> background: var(--gb-dark-bg0);<br /> }<br /> ::-webkit-scrollbar-thumb {<br /> background: var(--gb-dark-bg3);<br /> border-radius: 6px;<br /> }<br /> <br /> /* ==========================================================================<br /> 8. BLUR &amp; TRANSPARENCY (glassmorphism)<br /> ========================================================================== */<br /> <br /> body {<br /> /* subtle depth behind the glass panels — this gradient is deliberately<br /> large and soft so it reads as one continuous surface rather than a<br /> flat backdrop behind separate boxes */<br /> background-color: var(--gb-dark-bg0-hard);<br /> background-image:<br /> radial-gradient(ellipse 80% 60% at 15% 0%, color-mix(in srgb, var(--gb-neutral-blue) 14%, transparent) 0%, transparent 55%),<br /> radial-gradient(ellipse 70% 60% at 100% 100%, color-mix(in srgb, var(--gb-bright-yellow) 10%, transparent) 0%, transparent 55%),<br /> radial-gradient(ellipse 60% 50% at 50% 50%, color-mix(in srgb, var(--gb-bright-orange) 5%, transparent) 0%, transparent 60%);<br /> background-attachment: fixed;<br /> }<br /> <br /> /* Header, sidebar, footer, and cards all pull from the SAME gradient ramp<br /> (bg0-hard -&gt; bg0-soft -&gt; bg1) at low opacity, so adjoining panels share<br /> tone instead of butting up against each other as separate flat blocks.<br /> Borders are faded to near-invisible so the blur/gradient does the work<br /> of separating regions instead of a hard line. */<br /> .citizen-header,<br /> .citizen-header-container,<br /> #mw-panel,<br /> .citizen-sidebar,<br /> .citizen-footer,<br /> .citizen-page-header {<br /> background-image: linear-gradient(<br /> 180deg,<br /> color-mix(in srgb, var(--gb-dark-bg0-hard) 55%, transparent) 0%,<br /> color-mix(in srgb, var(--gb-dark-bg0-soft) 60%, transparent) 50%,<br /> color-mix(in srgb, var(--gb-dark-bg1) 55%, transparent) 100%<br /> );<br /> backdrop-filter: blur(14px) saturate(140%);<br /> -webkit-backdrop-filter: blur(14px) saturate(140%);<br /> border-color: color-mix(in srgb, var(--gb-dark-bg3) 25%, transparent);<br /> }<br /> <br /> .citizen-card,<br /> .mw-message-box,<br /> .infobox,<br /> table.wikitable,<br /> .cdx-card,<br /> .citizen-page-toc,<br /> #toc,<br /> .toc {<br /> background-image: linear-gradient(<br /> 145deg,<br /> color-mix(in srgb, var(--gb-dark-bg1) 45%, transparent) 0%,<br /> color-mix(in srgb, var(--gb-dark-bg0-soft) 50%, transparent) 100%<br /> );<br /> backdrop-filter: blur(10px) saturate(130%);<br /> -webkit-backdrop-filter: blur(10px) saturate(130%);<br /> border: 1px solid color-mix(in srgb, var(--gb-dark-bg3) 25%, transparent);<br /> }<br /> <br /> .cdx-button,<br /> .citizen-button,<br /> .cdx-text-input__input,<br /> .cdx-search-input__input {<br /> background-color: color-mix(in srgb, var(--gb-dark-bg1) 85%, transparent);<br /> border-color: color-mix(in srgb, var(--gb-dark-bg3) 70%, transparent);<br /> }<br /> <br /> /* Mobile bottom toolbar (settings + personal menu icons) must NOT use<br /> backdrop-filter — on Android Chrome, blurred fixed elements repaint per<br /> scroll frame and leave a ghosted duplicate behind. Solid-ish background<br /> instead. (No transform/translateZ here — that breaks position:sticky on<br /> the sidebar, which is why the sidebar broke last time.) */<br /> .citizen-personal-menu,<br /> .citizen-page-tools,<br /> #p-personal {<br /> backdrop-filter: none !important;<br /> -webkit-backdrop-filter: none !important;<br /> background-color: color-mix(in srgb, var(--gb-dark-bg0-soft) 92%, transparent);<br /> }<br /> <br /> @media (pointer: coarse) {<br /> /* Touch devices: blur-on-scroll ghosting is a widespread mobile Chrome/<br /> WebView bug, not just this skin. Kill backdrop-filter everywhere on<br /> touch and fall back to a mostly-opaque background so the frosted look<br /> degrades gracefully instead of smearing. */<br /> .citizen-header,<br /> .citizen-header-container,<br /> #mw-panel,<br /> .citizen-sidebar,<br /> .citizen-footer,<br /> .citizen-page-header,<br /> .citizen-card,<br /> .mw-message-box,<br /> .infobox,<br /> table.wikitable,<br /> .cdx-card,<br /> .citizen-page-toc,<br /> #toc,<br /> .toc,<br /> .citizen-dropdown-content,<br /> .cdx-menu,<br /> .citizen-typeahead-search__content,<br /> pre,<br /> .mw-highlight {<br /> backdrop-filter: none !important;<br /> -webkit-backdrop-filter: none !important;<br /> background-color: color-mix(in srgb, var(--gb-dark-bg0-soft) 95%, transparent);<br /> }<br /> }<br /> <br /> /* Code blocks stay solid (no blur) on purpose — a blurred element with its<br /> own internal horizontal scroll (overflow-x: auto) is the same class of<br /> mobile-compositor bug that caused ghosting earlier, but manifests as<br /> broken/unresponsive horizontal scrolling instead. A solid terminal-like<br /> background also just reads better for code anyway. *//* Dropdowns / popovers benefit most from a strong blur since they float over content */<br /> .citizen-dropdown-content,<br /> .cdx-menu,<br /> .citizen-typeahead-search__content {<br /> background-color: color-mix(in srgb, var(--gb-dark-bg0-soft) 75%, transparent);<br /> backdrop-filter: blur(18px) saturate(150%);<br /> -webkit-backdrop-filter: blur(18px) saturate(150%);<br /> border: 1px solid color-mix(in srgb, var(--gb-dark-bg3) 60%, transparent);<br /> box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);<br /> }</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Common.css&diff=32 MediaWiki:Common.css 2026-08-08T11:45:44Z <p>Ukernelperson: </p> <hr /> <div>/* CSS placed here will be applied to all skins */<br /> .mw-logo-icon {<br /> width: 85px !important; /* Adjust size */<br /> height: 85px !important;<br /> }<br /> .citizen-header__logo {<br /> display: none !important;<br /> }<br /> /* Hide top statistics counters (Pages, Files, Users, Admins) */<br /> .citizen-drawer__stats {<br /> display: none !important;<br /> }<br /> <br /> /* Hide Help about MediaWiki in the navigation drawer */<br /> .citizen-drawer #n-help,<br /> .citizen-drawer a[href*=&quot;Help:Contents&quot;] {<br /> display: none !important;<br /> }<br /> <br /> /* Hide Special Pages in the navigation drawer */<br /> .citizen-drawer #t-specialpages {<br /> display: none !important;<br /> }<br /> <br /> /* Remove white background from footer badges */<br /> .mw-footer li img,<br /> #footer-icons img,<br /> .footer-icons img {<br /> background: transparent !important;<br /> background-color: transparent !important;<br /> }</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen.css&diff=31 MediaWiki:Citizen.css 2026-08-07T06:27:36Z <p>Ukernelperson: </p> <hr /> <div>/**<br /> * MediaWiki:Citizen.css<br /> * Gruvbox-themed skin for the Citizen skin<br /> * - Palette: original Gruvbox (dark + light, hard/medium/soft contrast bg0 used)<br /> * - Headings: gothic (blackletter) display font<br /> * - Code/monospace: Space Mono<br /> *<br /> * Import fonts first (Google Fonts). If your wiki blocks external font<br /> * requests, self-host these instead and swap the @import for @font-face.<br /> */<br /> <br /> @import url('https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&amp;family=Space+Mono:wght@400;700&amp;display=swap');<br /> <br /> /* Sorgath is not on Google Fonts / a free CDN — it must be self-hosted.<br /> Upload the font file to your wiki (e.g. via Special:Upload) or another<br /> host you control, then point src at that URL. Until you fill this in,<br /> the stack below falls back to UnifrakturMaguntia. */<br /> @font-face {<br /> font-family: 'Sorgath';<br /> src: url('https://your-wiki-domain.example/path/to/Sorgath.woff2') format('woff2'),<br /> url('https://your-wiki-domain.example/path/to/Sorgath.otf') format('opentype');<br /> font-weight: 400;<br /> font-style: normal;<br /> font-display: swap;<br /> }<br /> <br /> /* ==========================================================================<br /> 1. GRUVBOX PALETTE (original, unmodified hex values from morhetz/gruvbox)<br /> ========================================================================== */<br /> <br /> :root {<br /> /* Dark mode - background */<br /> --gb-dark-bg0-hard: #1d2021;<br /> --gb-dark-bg0: #282828;<br /> --gb-dark-bg0-soft: #32302f;<br /> --gb-dark-bg1: #3c3836;<br /> --gb-dark-bg2: #504945;<br /> --gb-dark-bg3: #665c54;<br /> --gb-dark-bg4: #7c6f64;<br /> <br /> /* Dark mode - foreground */<br /> --gb-dark-fg0: #fbf1c7;<br /> --gb-dark-fg1: #ebdbb2;<br /> --gb-dark-fg2: #d5c4a1;<br /> --gb-dark-fg3: #bdae93;<br /> --gb-dark-fg4: #a89984;<br /> <br /> /* Light mode - background */<br /> --gb-light-bg0-hard: #f9f5d7;<br /> --gb-light-bg0: #fbf1c7;<br /> --gb-light-bg0-soft: #f2e5bc;<br /> --gb-light-bg1: #ebdbb2;<br /> --gb-light-bg2: #d5c4a1;<br /> --gb-light-bg3: #bdae93;<br /> --gb-light-bg4: #a89984;<br /> <br /> /* Light mode - foreground */<br /> --gb-light-fg0: #282828;<br /> --gb-light-fg1: #3c3836;<br /> --gb-light-fg2: #504945;<br /> --gb-light-fg3: #665c54;<br /> --gb-light-fg4: #7c6f64;<br /> <br /> /* Neutral accents (same value both modes, per original palette) */<br /> --gb-neutral-red: #cc241d;<br /> --gb-neutral-green: #98971a;<br /> --gb-neutral-yellow: #d79921;<br /> --gb-neutral-blue: #458588;<br /> --gb-neutral-purple: #b16286;<br /> --gb-neutral-aqua: #689d6a;<br /> --gb-neutral-orange: #d65d0e;<br /> --gb-neutral-gray: #928374;<br /> <br /> /* Bright accents (dark mode) */<br /> --gb-bright-red: #fb4934;<br /> --gb-bright-green: #b8bb26;<br /> --gb-bright-yellow: #fabd2f;<br /> --gb-bright-blue: #83a598;<br /> --gb-bright-purple: #d3869b;<br /> --gb-bright-aqua: #8ec07c;<br /> --gb-bright-orange: #fe8019;<br /> --gb-bright-gray: #928374;<br /> <br /> /* Faded accents (light mode) */<br /> --gb-faded-red: #9d0006;<br /> --gb-faded-green: #79740e;<br /> --gb-faded-yellow: #b57614;<br /> --gb-faded-blue: #076678;<br /> --gb-faded-purple: #8f3f71;<br /> --gb-faded-aqua: #427b58;<br /> --gb-faded-orange: #af3a03;<br /> --gb-faded-gray: #7c6f64;<br /> <br /> /* Fonts */<br /> --gb-font-gothic: 'Sorgath', 'UnifrakturMaguntia', 'Old English Text MT', 'Pfeffer Mediaeval', serif;<br /> --gb-font-mono: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;<br /> }<br /> <br /> /* ==========================================================================<br /> 2. CITIZEN SKIN — DARK MODE MAPPING<br /> ========================================================================== */<br /> <br /> html,<br /> html.skin-theme-clientpref-night,<br /> html.skin-theme-clientpref-day,<br /> html.skin-theme-clientpref-os {<br /> --background-color-base: var(--gb-dark-bg0);<br /> --background-color-neutral: var(--gb-dark-bg0-soft);<br /> --background-color-neutral-subtle: var(--gb-dark-bg1);<br /> --background-color-interactive: var(--gb-dark-bg1);<br /> --background-color-interactive-subtle: var(--gb-dark-bg0-soft);<br /> <br /> --color-base: var(--gb-dark-fg1);<br /> --color-base--subtle: var(--gb-dark-fg3);<br /> --color-emphasized: var(--gb-dark-fg0);<br /> --color-subtle: var(--gb-dark-fg4);<br /> --color-disabled: var(--gb-dark-bg4);<br /> <br /> --color-link: var(--gb-bright-blue);<br /> --color-link--hover: var(--gb-bright-aqua);<br /> --color-link--visited: var(--gb-bright-purple);<br /> --color-link-red: var(--gb-bright-red);<br /> <br /> --border-color-base: var(--gb-dark-bg3);<br /> --border-color-subtle: var(--gb-dark-bg2);<br /> <br /> --background-color-progressive: var(--gb-neutral-blue);<br /> --color-progressive: var(--gb-bright-blue);<br /> --background-color-destructive: var(--gb-neutral-red);<br /> --color-destructive: var(--gb-bright-red);<br /> --background-color-warning: var(--gb-neutral-yellow);<br /> --background-color-success: var(--gb-neutral-green);<br /> <br /> --color-content-added: var(--gb-bright-green);<br /> --color-content-removed: var(--gb-bright-red);<br /> <br /> color-scheme: dark;<br /> }<br /> <br /> /* ==========================================================================<br /> 3. LIGHT MODE — DISABLED (dark mode is forced site-wide, see §2)<br /> The light-mode variable block has been removed on purpose. The theme<br /> toggle is also hidden below so visitors can't flip back to light.<br /> ========================================================================== */<br /> <br /> .citizen-theme-toggle,<br /> #citizen-theme-toggle-form,<br /> [data-mw-loader-name*=&quot;theme.toggle&quot;] {<br /> display: none !important;<br /> }<br /> <br /> /* ==========================================================================<br /> 4. BASE APPLICATION<br /> ========================================================================== */<br /> <br /> body,<br /> .citizen-page,<br /> #mw-content-text {<br /> background-color: var(--background-color-base);<br /> color: var(--color-base);<br /> }<br /> <br /> a {<br /> color: var(--color-link);<br /> }<br /> a:visited {<br /> color: var(--color-link--visited);<br /> }<br /> a:hover {<br /> color: var(--color-link--hover);<br /> }<br /> a.new {<br /> color: var(--color-link-red);<br /> }<br /> <br /> /* Header / sidebar / footer surfaces */<br /> .citizen-header,<br /> .citizen-header-container,<br /> #mw-panel,<br /> .citizen-footer,<br /> .citizen-sidebar {<br /> background-color: var(--background-color-neutral);<br /> border-color: var(--border-color-base);<br /> }<br /> <br /> /* Cards, boxes, infoboxes */<br /> .citizen-card,<br /> .mw-message-box,<br /> .infobox,<br /> table.wikitable {<br /> background-color: var(--background-color-neutral-subtle);<br /> border-color: var(--border-color-subtle);<br /> color: var(--color-base);<br /> }<br /> <br /> table.wikitable &gt; tr &gt; th,<br /> table.wikitable &gt; * &gt; tr &gt; th {<br /> background-color: var(--background-color-interactive);<br /> color: var(--color-emphasized);<br /> }<br /> <br /> /* Buttons */<br /> .cdx-button,<br /> .citizen-button {<br /> background-color: var(--background-color-interactive);<br /> border-color: var(--border-color-base);<br /> color: var(--color-base);<br /> }<br /> .cdx-button--action-progressive,<br /> .citizen-button--primary {<br /> background-color: var(--background-color-progressive);<br /> color: var(--gb-dark-fg0);<br /> }<br /> .cdx-button--action-destructive {<br /> background-color: var(--background-color-destructive);<br /> color: var(--gb-dark-fg0);<br /> }<br /> <br /> /* diff colors */<br /> .diff-addedline {<br /> background-color: color-mix(in srgb, var(--color-content-added) 20%, transparent);<br /> }<br /> .diff-deletedline {<br /> background-color: color-mix(in srgb, var(--color-content-removed) 20%, transparent);<br /> }<br /> <br /> /* ==========================================================================<br /> 5. TYPOGRAPHY — GOTHIC HEADINGS<br /> ========================================================================== */<br /> <br /> .mw-body h1,<br /> .mw-body h2,<br /> .mw-body h3,<br /> .mw-body h4,<br /> .mw-body h5,<br /> .mw-body h6,<br /> .citizen-page-header .mw-page-title,<br /> .citizen-sitename {<br /> font-family: var(--gb-font-gothic);<br /> font-weight: 400;<br /> letter-spacing: 0.02em;<br /> color: var(--color-emphasized);<br /> }<br /> <br /> .mw-body h1,<br /> .citizen-page-header .mw-page-title {<br /> font-size: 2.4em;<br /> border-bottom: 2px solid var(--gb-bright-yellow);<br /> padding-bottom: 0.2em;<br /> }<br /> <br /> .mw-body h2 {<br /> font-size: 1.8em;<br /> border-bottom: 1px solid var(--gb-neutral-yellow);<br /> }<br /> <br /> /* Text selection - a Gruvbox signature */<br /> ::selection {<br /> background-color: var(--gb-bright-yellow);<br /> color: var(--gb-dark-bg0-hard);<br /> }<br /> <br /> /* Blockquotes get a yellow rail */<br /> .mw-body blockquote {<br /> border-left: 3px solid var(--gb-bright-yellow);<br /> padding-left: 1em;<br /> color: var(--color-base--subtle);<br /> }<br /> <br /> /* Active nav / tab state picks up yellow instead of the default blue */<br /> .citizen-menu__item--active &gt; a,<br /> .vector-tab-noicon.selected a,<br /> li.selected a {<br /> color: var(--gb-bright-yellow);<br /> font-weight: 700;<br /> }<br /> <br /> .mw-body h3 { font-size: 1.4em; }<br /> .mw-body h4 { font-size: 1.15em; }<br /> <br /> /* ==========================================================================<br /> 6. TYPOGRAPHY — SPACE MONO FOR CODE<br /> ========================================================================== */<br /> <br /> code,<br /> pre,<br /> kbd,<br /> samp,<br /> tt,<br /> .mw-code,<br /> .cdx-text-input__input.cdx-mono,<br /> textarea#wpTextbox1 {<br /> font-family: var(--gb-font-mono);<br /> }<br /> <br /> pre,<br /> .mw-highlight {<br /> background-color: var(--gb-dark-bg0-hard);<br /> color: var(--gb-dark-fg1);<br /> border: 1px solid var(--border-color-base);<br /> border-radius: 4px;<br /> padding: 0.75em 1em;<br /> overflow-x: auto;<br /> }<br /> <br /> code {<br /> background-color: var(--background-color-interactive-subtle);<br /> color: var(--gb-bright-orange);<br /> padding: 0.1em 0.35em;<br /> border-radius: 3px;<br /> font-size: 0.9em;<br /> }<br /> <br /> /* Syntax highlighting accents (if SyntaxHighlight/Pygments classes are present) */<br /> .mw-highlight .k { color: var(--gb-bright-red); } /* keyword */<br /> .mw-highlight .s,<br /> .mw-highlight .s2 { color: var(--gb-bright-green); } /* string */<br /> .mw-highlight .c,<br /> .mw-highlight .c1 { color: var(--gb-dark-fg4); font-style: italic; } /* comment */<br /> .mw-highlight .nf { color: var(--gb-bright-blue); } /* function name */<br /> .mw-highlight .mi,<br /> .mw-highlight .mf { color: var(--gb-bright-purple); } /* numbers */<br /> .mw-highlight .o { color: var(--gb-bright-orange); } /* operator */<br /> <br /> /* ==========================================================================<br /> 7. SCROLLBAR (dark mode nicety)<br /> ========================================================================== */<br /> <br /> ::-webkit-scrollbar {<br /> width: 12px;<br /> }<br /> ::-webkit-scrollbar-track {<br /> background: var(--gb-dark-bg0);<br /> }<br /> ::-webkit-scrollbar-thumb {<br /> background: var(--gb-dark-bg3);<br /> border-radius: 6px;<br /> }<br /> <br /> /* ==========================================================================<br /> 8. BLUR &amp; TRANSPARENCY (glassmorphism)<br /> ========================================================================== */<br /> <br /> body {<br /> /* subtle depth behind the glass panels */<br /> background-color: var(--gb-dark-bg0-hard);<br /> background-image:<br /> radial-gradient(circle at 15% 20%, color-mix(in srgb, var(--gb-neutral-blue) 12%, transparent) 0%, transparent 45%),<br /> radial-gradient(circle at 85% 80%, color-mix(in srgb, var(--gb-bright-yellow) 8%, transparent) 0%, transparent 45%);<br /> background-attachment: fixed;<br /> }<br /> <br /> .citizen-header,<br /> .citizen-header-container,<br /> #mw-panel,<br /> .citizen-sidebar,<br /> .citizen-footer,<br /> .citizen-page-header {<br /> background-color: color-mix(in srgb, var(--gb-dark-bg0-soft) 70%, transparent);<br /> backdrop-filter: blur(14px) saturate(140%);<br /> -webkit-backdrop-filter: blur(14px) saturate(140%);<br /> border-color: color-mix(in srgb, var(--gb-dark-bg3) 60%, transparent);<br /> }<br /> <br /> .citizen-card,<br /> .mw-message-box,<br /> .infobox,<br /> table.wikitable,<br /> .cdx-card,<br /> .citizen-page-toc,<br /> #toc,<br /> .toc {<br /> background-color: color-mix(in srgb, var(--gb-dark-bg1) 55%, transparent);<br /> backdrop-filter: blur(10px) saturate(130%);<br /> -webkit-backdrop-filter: blur(10px) saturate(130%);<br /> border: 1px solid color-mix(in srgb, var(--gb-dark-bg3) 50%, transparent);<br /> }<br /> <br /> .cdx-button,<br /> .citizen-button,<br /> .cdx-text-input__input,<br /> .cdx-search-input__input {<br /> background-color: color-mix(in srgb, var(--gb-dark-bg1) 85%, transparent);<br /> border-color: color-mix(in srgb, var(--gb-dark-bg3) 70%, transparent);<br /> }<br /> <br /> /* Fixed/sticky UI (mobile bottom toolbar: settings + personal menu icons, etc.)<br /> must NOT use backdrop-filter — on Android Chrome, blurred fixed elements<br /> repaint per scroll frame and leave a ghosted duplicate behind. Give them a<br /> solid-ish background instead, and force their own compositing layer so the<br /> browser stops re-rasterizing them on every scroll tick. */<br /> .citizen-personal-menu,<br /> .citizen-page-tools,<br /> .citizen-drawer,<br /> #p-personal,<br /> .citizen-body-header,<br /> .citizen-footer-fixed,<br /> [class*=&quot;citizen&quot;][class*=&quot;fixed&quot;],<br /> [class*=&quot;citizen&quot;][class*=&quot;sticky&quot;] {<br /> backdrop-filter: none !important;<br /> -webkit-backdrop-filter: none !important;<br /> background-color: color-mix(in srgb, var(--gb-dark-bg0-soft) 92%, transparent);<br /> transform: translateZ(0);<br /> will-change: transform;<br /> }<br /> <br /> @media (pointer: coarse) {<br /> /* Touch devices: blur-on-scroll ghosting is a widespread mobile Chrome/<br /> WebView bug, not just this skin. Kill backdrop-filter everywhere on<br /> touch and fall back to a mostly-opaque background so the frosted look<br /> degrades gracefully instead of smearing. */<br /> .citizen-header,<br /> .citizen-header-container,<br /> #mw-panel,<br /> .citizen-sidebar,<br /> .citizen-footer,<br /> .citizen-page-header,<br /> .citizen-card,<br /> .mw-message-box,<br /> .infobox,<br /> table.wikitable,<br /> .cdx-card,<br /> .citizen-page-toc,<br /> #toc,<br /> .toc,<br /> .citizen-dropdown-content,<br /> .cdx-menu,<br /> .citizen-typeahead-search__content,<br /> pre,<br /> .mw-highlight {<br /> backdrop-filter: none !important;<br /> -webkit-backdrop-filter: none !important;<br /> background-color: color-mix(in srgb, var(--gb-dark-bg0-soft) 95%, transparent);<br /> }<br /> }<br /> <br /> pre,<br /> .mw-highlight {<br /> background-color: color-mix(in srgb, var(--gb-dark-bg0-hard) 80%, transparent);<br /> backdrop-filter: blur(6px);<br /> -webkit-backdrop-filter: blur(6px);<br /> }<br /> <br /> /* Dropdowns / popovers benefit most from a strong blur since they float over content */<br /> .citizen-dropdown-content,<br /> .cdx-menu,<br /> .citizen-typeahead-search__content {<br /> background-color: color-mix(in srgb, var(--gb-dark-bg0-soft) 75%, transparent);<br /> backdrop-filter: blur(18px) saturate(150%);<br /> -webkit-backdrop-filter: blur(18px) saturate(150%);<br /> border: 1px solid color-mix(in srgb, var(--gb-dark-bg3) 60%, transparent);<br /> box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);<br /> }</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen.css&diff=30 MediaWiki:Citizen.css 2026-08-07T06:21:30Z <p>Ukernelperson: </p> <hr /> <div>/**<br /> * MediaWiki:Citizen.css<br /> * Gruvbox-themed skin for the Citizen skin<br /> * - Palette: original Gruvbox (dark + light, hard/medium/soft contrast bg0 used)<br /> * - Headings: gothic (blackletter) display font<br /> * - Code/monospace: Space Mono<br /> *<br /> * Import fonts first (Google Fonts). If your wiki blocks external font<br /> * requests, self-host these instead and swap the @import for @font-face.<br /> */<br /> <br /> @import url('https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&amp;family=Space+Mono:wght@400;700&amp;display=swap');<br /> <br /> /* ==========================================================================<br /> 1. GRUVBOX PALETTE (original, unmodified hex values from morhetz/gruvbox)<br /> ========================================================================== */<br /> <br /> :root {<br /> /* Dark mode - background */<br /> --gb-dark-bg0-hard: #1d2021;<br /> --gb-dark-bg0: #282828;<br /> --gb-dark-bg0-soft: #32302f;<br /> --gb-dark-bg1: #3c3836;<br /> --gb-dark-bg2: #504945;<br /> --gb-dark-bg3: #665c54;<br /> --gb-dark-bg4: #7c6f64;<br /> <br /> /* Dark mode - foreground */<br /> --gb-dark-fg0: #fbf1c7;<br /> --gb-dark-fg1: #ebdbb2;<br /> --gb-dark-fg2: #d5c4a1;<br /> --gb-dark-fg3: #bdae93;<br /> --gb-dark-fg4: #a89984;<br /> <br /> /* Light mode - background */<br /> --gb-light-bg0-hard: #f9f5d7;<br /> --gb-light-bg0: #fbf1c7;<br /> --gb-light-bg0-soft: #f2e5bc;<br /> --gb-light-bg1: #ebdbb2;<br /> --gb-light-bg2: #d5c4a1;<br /> --gb-light-bg3: #bdae93;<br /> --gb-light-bg4: #a89984;<br /> <br /> /* Light mode - foreground */<br /> --gb-light-fg0: #282828;<br /> --gb-light-fg1: #3c3836;<br /> --gb-light-fg2: #504945;<br /> --gb-light-fg3: #665c54;<br /> --gb-light-fg4: #7c6f64;<br /> <br /> /* Neutral accents (same value both modes, per original palette) */<br /> --gb-neutral-red: #cc241d;<br /> --gb-neutral-green: #98971a;<br /> --gb-neutral-yellow: #d79921;<br /> --gb-neutral-blue: #458588;<br /> --gb-neutral-purple: #b16286;<br /> --gb-neutral-aqua: #689d6a;<br /> --gb-neutral-orange: #d65d0e;<br /> --gb-neutral-gray: #928374;<br /> <br /> /* Bright accents (dark mode) */<br /> --gb-bright-red: #fb4934;<br /> --gb-bright-green: #b8bb26;<br /> --gb-bright-yellow: #fabd2f;<br /> --gb-bright-blue: #83a598;<br /> --gb-bright-purple: #d3869b;<br /> --gb-bright-aqua: #8ec07c;<br /> --gb-bright-orange: #fe8019;<br /> --gb-bright-gray: #928374;<br /> <br /> /* Faded accents (light mode) */<br /> --gb-faded-red: #9d0006;<br /> --gb-faded-green: #79740e;<br /> --gb-faded-yellow: #b57614;<br /> --gb-faded-blue: #076678;<br /> --gb-faded-purple: #8f3f71;<br /> --gb-faded-aqua: #427b58;<br /> --gb-faded-orange: #af3a03;<br /> --gb-faded-gray: #7c6f64;<br /> <br /> /* Fonts */<br /> --gb-font-gothic: 'UnifrakturMaguntia', 'Old English Text MT', 'Pfeffer Mediaeval', serif;<br /> --gb-font-mono: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;<br /> }<br /> <br /> /* ==========================================================================<br /> 2. CITIZEN SKIN — DARK MODE MAPPING<br /> ========================================================================== */<br /> <br /> html,<br /> html.skin-theme-clientpref-night,<br /> html.skin-theme-clientpref-day,<br /> html.skin-theme-clientpref-os {<br /> --background-color-base: var(--gb-dark-bg0);<br /> --background-color-neutral: var(--gb-dark-bg0-soft);<br /> --background-color-neutral-subtle: var(--gb-dark-bg1);<br /> --background-color-interactive: var(--gb-dark-bg1);<br /> --background-color-interactive-subtle: var(--gb-dark-bg0-soft);<br /> <br /> --color-base: var(--gb-dark-fg1);<br /> --color-base--subtle: var(--gb-dark-fg3);<br /> --color-emphasized: var(--gb-dark-fg0);<br /> --color-subtle: var(--gb-dark-fg4);<br /> --color-disabled: var(--gb-dark-bg4);<br /> <br /> --color-link: var(--gb-bright-blue);<br /> --color-link--hover: var(--gb-bright-aqua);<br /> --color-link--visited: var(--gb-bright-purple);<br /> --color-link-red: var(--gb-bright-red);<br /> <br /> --border-color-base: var(--gb-dark-bg3);<br /> --border-color-subtle: var(--gb-dark-bg2);<br /> <br /> --background-color-progressive: var(--gb-neutral-blue);<br /> --color-progressive: var(--gb-bright-blue);<br /> --background-color-destructive: var(--gb-neutral-red);<br /> --color-destructive: var(--gb-bright-red);<br /> --background-color-warning: var(--gb-neutral-yellow);<br /> --background-color-success: var(--gb-neutral-green);<br /> <br /> --color-content-added: var(--gb-bright-green);<br /> --color-content-removed: var(--gb-bright-red);<br /> <br /> color-scheme: dark;<br /> }<br /> <br /> /* ==========================================================================<br /> 3. LIGHT MODE — DISABLED (dark mode is forced site-wide, see §2)<br /> The light-mode variable block has been removed on purpose. The theme<br /> toggle is also hidden below so visitors can't flip back to light.<br /> ========================================================================== */<br /> <br /> .citizen-theme-toggle,<br /> #citizen-theme-toggle-form,<br /> [data-mw-loader-name*=&quot;theme.toggle&quot;] {<br /> display: none !important;<br /> }<br /> <br /> /* ==========================================================================<br /> 4. BASE APPLICATION<br /> ========================================================================== */<br /> <br /> body,<br /> .citizen-page,<br /> #mw-content-text {<br /> background-color: var(--background-color-base);<br /> color: var(--color-base);<br /> }<br /> <br /> a {<br /> color: var(--color-link);<br /> }<br /> a:visited {<br /> color: var(--color-link--visited);<br /> }<br /> a:hover {<br /> color: var(--color-link--hover);<br /> }<br /> a.new {<br /> color: var(--color-link-red);<br /> }<br /> <br /> /* Header / sidebar / footer surfaces */<br /> .citizen-header,<br /> .citizen-header-container,<br /> #mw-panel,<br /> .citizen-footer,<br /> .citizen-sidebar {<br /> background-color: var(--background-color-neutral);<br /> border-color: var(--border-color-base);<br /> }<br /> <br /> /* Cards, boxes, infoboxes */<br /> .citizen-card,<br /> .mw-message-box,<br /> .infobox,<br /> table.wikitable {<br /> background-color: var(--background-color-neutral-subtle);<br /> border-color: var(--border-color-subtle);<br /> color: var(--color-base);<br /> }<br /> <br /> table.wikitable &gt; tr &gt; th,<br /> table.wikitable &gt; * &gt; tr &gt; th {<br /> background-color: var(--background-color-interactive);<br /> color: var(--color-emphasized);<br /> }<br /> <br /> /* Buttons */<br /> .cdx-button,<br /> .citizen-button {<br /> background-color: var(--background-color-interactive);<br /> border-color: var(--border-color-base);<br /> color: var(--color-base);<br /> }<br /> .cdx-button--action-progressive,<br /> .citizen-button--primary {<br /> background-color: var(--background-color-progressive);<br /> color: var(--gb-dark-fg0);<br /> }<br /> .cdx-button--action-destructive {<br /> background-color: var(--background-color-destructive);<br /> color: var(--gb-dark-fg0);<br /> }<br /> <br /> /* diff colors */<br /> .diff-addedline {<br /> background-color: color-mix(in srgb, var(--color-content-added) 20%, transparent);<br /> }<br /> .diff-deletedline {<br /> background-color: color-mix(in srgb, var(--color-content-removed) 20%, transparent);<br /> }<br /> <br /> /* ==========================================================================<br /> 5. TYPOGRAPHY — GOTHIC HEADINGS<br /> ========================================================================== */<br /> <br /> .mw-body h1,<br /> .mw-body h2,<br /> .mw-body h3,<br /> .mw-body h4,<br /> .mw-body h5,<br /> .mw-body h6,<br /> .citizen-page-header .mw-page-title,<br /> .citizen-sitename {<br /> font-family: var(--gb-font-gothic);<br /> font-weight: 400;<br /> letter-spacing: 0.02em;<br /> color: var(--color-emphasized);<br /> }<br /> <br /> .mw-body h1,<br /> .citizen-page-header .mw-page-title {<br /> font-size: 2.4em;<br /> border-bottom: 2px solid var(--gb-bright-yellow);<br /> padding-bottom: 0.2em;<br /> }<br /> <br /> .mw-body h2 {<br /> font-size: 1.8em;<br /> border-bottom: 1px solid var(--gb-neutral-yellow);<br /> }<br /> <br /> /* Text selection - a Gruvbox signature */<br /> ::selection {<br /> background-color: var(--gb-bright-yellow);<br /> color: var(--gb-dark-bg0-hard);<br /> }<br /> <br /> /* Blockquotes get a yellow rail */<br /> .mw-body blockquote {<br /> border-left: 3px solid var(--gb-bright-yellow);<br /> padding-left: 1em;<br /> color: var(--color-base--subtle);<br /> }<br /> <br /> /* Active nav / tab state picks up yellow instead of the default blue */<br /> .citizen-menu__item--active &gt; a,<br /> .vector-tab-noicon.selected a,<br /> li.selected a {<br /> color: var(--gb-bright-yellow);<br /> font-weight: 700;<br /> }<br /> <br /> .mw-body h3 { font-size: 1.4em; }<br /> .mw-body h4 { font-size: 1.15em; }<br /> <br /> /* ==========================================================================<br /> 6. TYPOGRAPHY — SPACE MONO FOR CODE<br /> ========================================================================== */<br /> <br /> code,<br /> pre,<br /> kbd,<br /> samp,<br /> tt,<br /> .mw-code,<br /> .cdx-text-input__input.cdx-mono,<br /> textarea#wpTextbox1 {<br /> font-family: var(--gb-font-mono);<br /> }<br /> <br /> pre,<br /> .mw-highlight {<br /> background-color: var(--gb-dark-bg0-hard);<br /> color: var(--gb-dark-fg1);<br /> border: 1px solid var(--border-color-base);<br /> border-radius: 4px;<br /> padding: 0.75em 1em;<br /> overflow-x: auto;<br /> }<br /> <br /> code {<br /> background-color: var(--background-color-interactive-subtle);<br /> color: var(--gb-bright-orange);<br /> padding: 0.1em 0.35em;<br /> border-radius: 3px;<br /> font-size: 0.9em;<br /> }<br /> <br /> /* Syntax highlighting accents (if SyntaxHighlight/Pygments classes are present) */<br /> .mw-highlight .k { color: var(--gb-bright-red); } /* keyword */<br /> .mw-highlight .s,<br /> .mw-highlight .s2 { color: var(--gb-bright-green); } /* string */<br /> .mw-highlight .c,<br /> .mw-highlight .c1 { color: var(--gb-dark-fg4); font-style: italic; } /* comment */<br /> .mw-highlight .nf { color: var(--gb-bright-blue); } /* function name */<br /> .mw-highlight .mi,<br /> .mw-highlight .mf { color: var(--gb-bright-purple); } /* numbers */<br /> .mw-highlight .o { color: var(--gb-bright-orange); } /* operator */<br /> <br /> /* ==========================================================================<br /> 7. SCROLLBAR (dark mode nicety)<br /> ========================================================================== */<br /> <br /> ::-webkit-scrollbar {<br /> width: 12px;<br /> }<br /> ::-webkit-scrollbar-track {<br /> background: var(--gb-dark-bg0);<br /> }<br /> ::-webkit-scrollbar-thumb {<br /> background: var(--gb-dark-bg3);<br /> border-radius: 6px;<br /> }<br /> <br /> /* ==========================================================================<br /> 8. BLUR &amp; TRANSPARENCY (glassmorphism)<br /> ========================================================================== */<br /> <br /> body {<br /> /* subtle depth behind the glass panels */<br /> background-color: var(--gb-dark-bg0-hard);<br /> background-image:<br /> radial-gradient(circle at 15% 20%, color-mix(in srgb, var(--gb-neutral-blue) 12%, transparent) 0%, transparent 45%),<br /> radial-gradient(circle at 85% 80%, color-mix(in srgb, var(--gb-bright-yellow) 8%, transparent) 0%, transparent 45%);<br /> background-attachment: fixed;<br /> }<br /> <br /> .citizen-header,<br /> .citizen-header-container,<br /> #mw-panel,<br /> .citizen-sidebar,<br /> .citizen-footer,<br /> .citizen-page-header {<br /> background-color: color-mix(in srgb, var(--gb-dark-bg0-soft) 70%, transparent);<br /> backdrop-filter: blur(14px) saturate(140%);<br /> -webkit-backdrop-filter: blur(14px) saturate(140%);<br /> border-color: color-mix(in srgb, var(--gb-dark-bg3) 60%, transparent);<br /> }<br /> <br /> .citizen-card,<br /> .mw-message-box,<br /> .infobox,<br /> table.wikitable,<br /> .cdx-card,<br /> .citizen-page-toc,<br /> #toc,<br /> .toc {<br /> background-color: color-mix(in srgb, var(--gb-dark-bg1) 55%, transparent);<br /> backdrop-filter: blur(10px) saturate(130%);<br /> -webkit-backdrop-filter: blur(10px) saturate(130%);<br /> border: 1px solid color-mix(in srgb, var(--gb-dark-bg3) 50%, transparent);<br /> }<br /> <br /> .cdx-button,<br /> .citizen-button,<br /> .cdx-text-input__input,<br /> .cdx-search-input__input {<br /> background-color: color-mix(in srgb, var(--gb-dark-bg1) 65%, transparent);<br /> backdrop-filter: blur(8px);<br /> -webkit-backdrop-filter: blur(8px);<br /> border-color: color-mix(in srgb, var(--gb-dark-bg3) 70%, transparent);<br /> }<br /> <br /> pre,<br /> .mw-highlight {<br /> background-color: color-mix(in srgb, var(--gb-dark-bg0-hard) 80%, transparent);<br /> backdrop-filter: blur(6px);<br /> -webkit-backdrop-filter: blur(6px);<br /> }<br /> <br /> /* Dropdowns / popovers benefit most from a strong blur since they float over content */<br /> .citizen-dropdown-content,<br /> .cdx-menu,<br /> .citizen-typeahead-search__content {<br /> background-color: color-mix(in srgb, var(--gb-dark-bg0-soft) 75%, transparent);<br /> backdrop-filter: blur(18px) saturate(150%);<br /> -webkit-backdrop-filter: blur(18px) saturate(150%);<br /> border: 1px solid color-mix(in srgb, var(--gb-dark-bg3) 60%, transparent);<br /> box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);<br /> }</div> Ukernelperson https://ukernelperson.nya.je/index.php?title=MediaWiki:Citizen.css&diff=29 MediaWiki:Citizen.css 2026-08-07T06:16:27Z <p>Ukernelperson: </p> <hr /> <div>/**<br /> * MediaWiki:Citizen.css<br /> * Gruvbox-themed skin for the Citizen skin<br /> * - Palette: original Gruvbox (dark + light, hard/medium/soft contrast bg0 used)<br /> * - Headings: gothic (blackletter) display font<br /> * - Code/monospace: Space Mono<br /> *<br /> * Import fonts first (Google Fonts). If your wiki blocks external font<br /> * requests, self-host these instead and swap the @import for @font-face.<br /> */<br /> <br /> @import url('https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&amp;family=Space+Mono:wght@400;700&amp;display=swap');<br /> <br /> /* ==========================================================================<br /> 1. GRUVBOX PALETTE (original, unmodified hex values from morhetz/gruvbox)<br /> ========================================================================== */<br /> <br /> :root {<br /> /* Dark mode - background */<br /> --gb-dark-bg0-hard: #1d2021;<br /> --gb-dark-bg0: #282828;<br /> --gb-dark-bg0-soft: #32302f;<br /> --gb-dark-bg1: #3c3836;<br /> --gb-dark-bg2: #504945;<br /> --gb-dark-bg3: #665c54;<br /> --gb-dark-bg4: #7c6f64;<br /> <br /> /* Dark mode - foreground */<br /> --gb-dark-fg0: #fbf1c7;<br /> --gb-dark-fg1: #ebdbb2;<br /> --gb-dark-fg2: #d5c4a1;<br /> --gb-dark-fg3: #bdae93;<br /> --gb-dark-fg4: #a89984;<br /> <br /> /* Light mode - background */<br /> --gb-light-bg0-hard: #f9f5d7;<br /> --gb-light-bg0: #fbf1c7;<br /> --gb-light-bg0-soft: #f2e5bc;<br /> --gb-light-bg1: #ebdbb2;<br /> --gb-light-bg2: #d5c4a1;<br /> --gb-light-bg3: #bdae93;<br /> --gb-light-bg4: #a89984;<br /> <br /> /* Light mode - foreground */<br /> --gb-light-fg0: #282828;<br /> --gb-light-fg1: #3c3836;<br /> --gb-light-fg2: #504945;<br /> --gb-light-fg3: #665c54;<br /> --gb-light-fg4: #7c6f64;<br /> <br /> /* Neutral accents (same value both modes, per original palette) */<br /> --gb-neutral-red: #cc241d;<br /> --gb-neutral-green: #98971a;<br /> --gb-neutral-yellow: #d79921;<br /> --gb-neutral-blue: #458588;<br /> --gb-neutral-purple: #b16286;<br /> --gb-neutral-aqua: #689d6a;<br /> --gb-neutral-orange: #d65d0e;<br /> --gb-neutral-gray: #928374;<br /> <br /> /* Bright accents (dark mode) */<br /> --gb-bright-red: #fb4934;<br /> --gb-bright-green: #b8bb26;<br /> --gb-bright-yellow: #fabd2f;<br /> --gb-bright-blue: #83a598;<br /> --gb-bright-purple: #d3869b;<br /> --gb-bright-aqua: #8ec07c;<br /> --gb-bright-orange: #fe8019;<br /> --gb-bright-gray: #928374;<br /> <br /> /* Faded accents (light mode) */<br /> --gb-faded-red: #9d0006;<br /> --gb-faded-green: #79740e;<br /> --gb-faded-yellow: #b57614;<br /> --gb-faded-blue: #076678;<br /> --gb-faded-purple: #8f3f71;<br /> --gb-faded-aqua: #427b58;<br /> --gb-faded-orange: #af3a03;<br /> --gb-faded-gray: #7c6f64;<br /> <br /> /* Fonts */<br /> --gb-font-gothic: 'UnifrakturMaguntia', 'Old English Text MT', 'Pfeffer Mediaeval', serif;<br /> --gb-font-mono: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;<br /> }<br /> <br /> /* ==========================================================================<br /> 2. CITIZEN SKIN — DARK MODE MAPPING<br /> ========================================================================== */<br /> <br /> html.skin-theme-clientpref-night,<br /> html.skin-theme-clientpref-os:not(.skin-theme-clientpref-day) {<br /> --background-color-base: var(--gb-dark-bg0);<br /> --background-color-neutral: var(--gb-dark-bg0-soft);<br /> --background-color-neutral-subtle: var(--gb-dark-bg1);<br /> --background-color-interactive: var(--gb-dark-bg1);<br /> --background-color-interactive-subtle: var(--gb-dark-bg0-soft);<br /> <br /> --color-base: var(--gb-dark-fg1);<br /> --color-base--subtle: var(--gb-dark-fg3);<br /> --color-emphasized: var(--gb-dark-fg0);<br /> --color-subtle: var(--gb-dark-fg4);<br /> --color-disabled: var(--gb-dark-bg4);<br /> <br /> --color-link: var(--gb-bright-blue);<br /> --color-link--hover: var(--gb-bright-aqua);<br /> --color-link--visited: var(--gb-bright-purple);<br /> --color-link-red: var(--gb-bright-red);<br /> <br /> --border-color-base: var(--gb-dark-bg3);<br /> --border-color-subtle: var(--gb-dark-bg2);<br /> <br /> --background-color-progressive: var(--gb-neutral-blue);<br /> --color-progressive: var(--gb-bright-blue);<br /> --background-color-destructive: var(--gb-neutral-red);<br /> --color-destructive: var(--gb-bright-red);<br /> --background-color-warning: var(--gb-neutral-yellow);<br /> --background-color-success: var(--gb-neutral-green);<br /> <br /> --color-content-added: var(--gb-bright-green);<br /> --color-content-removed: var(--gb-bright-red);<br /> <br /> color-scheme: dark;<br /> }<br /> <br /> /* ==========================================================================<br /> 3. CITIZEN SKIN — LIGHT MODE MAPPING<br /> ========================================================================== */<br /> <br /> html.skin-theme-clientpref-day,<br /> html.skin-theme-clientpref-os:not(.skin-theme-clientpref-night) {<br /> --background-color-base: var(--gb-light-bg0);<br /> --background-color-neutral: var(--gb-light-bg0-soft);<br /> --background-color-neutral-subtle: var(--gb-light-bg1);<br /> --background-color-interactive: var(--gb-light-bg1);<br /> --background-color-interactive-subtle: var(--gb-light-bg0-soft);<br /> <br /> --color-base: var(--gb-light-fg1);<br /> --color-base--subtle: var(--gb-light-fg3);<br /> --color-emphasized: var(--gb-light-fg0);<br /> --color-subtle: var(--gb-light-fg4);<br /> --color-disabled: var(--gb-light-bg4);<br /> <br /> --color-link: var(--gb-faded-blue);<br /> --color-link--hover: var(--gb-faded-aqua);<br /> --color-link--visited: var(--gb-faded-purple);<br /> --color-link-red: var(--gb-faded-red);<br /> <br /> --border-color-base: var(--gb-light-bg3);<br /> --border-color-subtle: var(--gb-light-bg2);<br /> <br /> --background-color-progressive: var(--gb-neutral-blue);<br /> --color-progressive: var(--gb-faded-blue);<br /> --background-color-destructive: var(--gb-neutral-red);<br /> --color-destructive: var(--gb-faded-red);<br /> --background-color-warning: var(--gb-neutral-yellow);<br /> --background-color-success: var(--gb-neutral-green);<br /> <br /> --color-content-added: var(--gb-faded-green);<br /> --color-content-removed: var(--gb-faded-red);<br /> <br /> color-scheme: light;<br /> }<br /> <br /> /* ==========================================================================<br /> 4. BASE APPLICATION<br /> ========================================================================== */<br /> <br /> body,<br /> .citizen-page,<br /> #mw-content-text {<br /> background-color: var(--background-color-base);<br /> color: var(--color-base);<br /> }<br /> <br /> a {<br /> color: var(--color-link);<br /> }<br /> a:visited {<br /> color: var(--color-link--visited);<br /> }<br /> a:hover {<br /> color: var(--color-link--hover);<br /> }<br /> a.new {<br /> color: var(--color-link-red);<br /> }<br /> <br /> /* Header / sidebar / footer surfaces */<br /> .citizen-header,<br /> .citizen-header-container,<br /> #mw-panel,<br /> .citizen-footer,<br /> .citizen-sidebar {<br /> background-color: var(--background-color-neutral);<br /> border-color: var(--border-color-base);<br /> }<br /> <br /> /* Cards, boxes, infoboxes */<br /> .citizen-card,<br /> .mw-message-box,<br /> .infobox,<br /> table.wikitable {<br /> background-color: var(--background-color-neutral-subtle);<br /> border-color: var(--border-color-subtle);<br /> color: var(--color-base);<br /> }<br /> <br /> table.wikitable &gt; tr &gt; th,<br /> table.wikitable &gt; * &gt; tr &gt; th {<br /> background-color: var(--background-color-interactive);<br /> color: var(--color-emphasized);<br /> }<br /> <br /> /* Buttons */<br /> .cdx-button,<br /> .citizen-button {<br /> background-color: var(--background-color-interactive);<br /> border-color: var(--border-color-base);<br /> color: var(--color-base);<br /> }<br /> .cdx-button--action-progressive,<br /> .citizen-button--primary {<br /> background-color: var(--background-color-progressive);<br /> color: var(--gb-dark-fg0);<br /> }<br /> .cdx-button--action-destructive {<br /> background-color: var(--background-color-destructive);<br /> color: var(--gb-dark-fg0);<br /> }<br /> <br /> /* diff colors */<br /> .diff-addedline {<br /> background-color: color-mix(in srgb, var(--color-content-added) 20%, transparent);<br /> }<br /> .diff-deletedline {<br /> background-color: color-mix(in srgb, var(--color-content-removed) 20%, transparent);<br /> }<br /> <br /> /* ==========================================================================<br /> 5. TYPOGRAPHY — GOTHIC HEADINGS<br /> ========================================================================== */<br /> <br /> .mw-body h1,<br /> .mw-body h2,<br /> .mw-body h3,<br /> .mw-body h4,<br /> .mw-body h5,<br /> .mw-body h6,<br /> .citizen-page-header .mw-page-title,<br /> .citizen-sitename {<br /> font-family: var(--gb-font-gothic);<br /> font-weight: 400;<br /> letter-spacing: 0.02em;<br /> color: var(--color-emphasized);<br /> }<br /> <br /> .mw-body h1,<br /> .citizen-page-header .mw-page-title {<br /> font-size: 2.4em;<br /> border-bottom: 2px solid var(--border-color-base);<br /> padding-bottom: 0.2em;<br /> }<br /> <br /> .mw-body h2 {<br /> font-size: 1.8em;<br /> border-bottom: 1px solid var(--border-color-subtle);<br /> }<br /> <br /> .mw-body h3 { font-size: 1.4em; }<br /> .mw-body h4 { font-size: 1.15em; }<br /> <br /> /* ==========================================================================<br /> 6. TYPOGRAPHY — SPACE MONO FOR CODE<br /> ========================================================================== */<br /> <br /> code,<br /> pre,<br /> kbd,<br /> samp,<br /> tt,<br /> .mw-code,<br /> .cdx-text-input__input.cdx-mono,<br /> textarea#wpTextbox1 {<br /> font-family: var(--gb-font-mono);<br /> }<br /> <br /> pre,<br /> .mw-highlight {<br /> background-color: var(--gb-dark-bg0-hard);<br /> color: var(--gb-dark-fg1);<br /> border: 1px solid var(--border-color-base);<br /> border-radius: 4px;<br /> padding: 0.75em 1em;<br /> overflow-x: auto;<br /> }<br /> <br /> html.skin-theme-clientpref-day pre,<br /> html.skin-theme-clientpref-day .mw-highlight {<br /> background-color: var(--gb-light-bg0-hard);<br /> color: var(--gb-light-fg1);<br /> }<br /> <br /> code {<br /> background-color: var(--background-color-interactive-subtle);<br /> color: var(--gb-bright-orange);<br /> padding: 0.1em 0.35em;<br /> border-radius: 3px;<br /> font-size: 0.9em;<br /> }<br /> <br /> html.skin-theme-clientpref-day code {<br /> color: var(--gb-faded-orange);<br /> }<br /> <br /> /* Syntax highlighting accents (if SyntaxHighlight/Pygments classes are present) */<br /> .mw-highlight .k { color: var(--gb-bright-red); } /* keyword */<br /> .mw-highlight .s,<br /> .mw-highlight .s2 { color: var(--gb-bright-green); } /* string */<br /> .mw-highlight .c,<br /> .mw-highlight .c1 { color: var(--gb-dark-fg4); font-style: italic; } /* comment */<br /> .mw-highlight .nf { color: var(--gb-bright-blue); } /* function name */<br /> .mw-highlight .mi,<br /> .mw-highlight .mf { color: var(--gb-bright-purple); } /* numbers */<br /> .mw-highlight .o { color: var(--gb-bright-orange); } /* operator */<br /> <br /> /* ==========================================================================<br /> 7. SCROLLBAR (dark mode nicety)<br /> ========================================================================== */<br /> <br /> html.skin-theme-clientpref-night ::-webkit-scrollbar,<br /> html.skin-theme-clientpref-os:not(.skin-theme-clientpref-day) ::-webkit-scrollbar {<br /> width: 12px;<br /> }<br /> html.skin-theme-clientpref-night ::-webkit-scrollbar-track,<br /> html.skin-theme-clientpref-os:not(.skin-theme-clientpref-day) ::-webkit-scrollbar-track {<br /> background: var(--gb-dark-bg0);<br /> }<br /> html.skin-theme-clientpref-night ::-webkit-scrollbar-thumb,<br /> html.skin-theme-clientpref-os:not(.skin-theme-clientpref-day) ::-webkit-scrollbar-thumb {<br /> background: var(--gb-dark-bg3);<br /> border-radius: 6px;<br /> }</div> Ukernelperson