https://chuihub.com/index.php?action=history&feed=atom&title=MediaWiki%3AGadget-ThemeSwitch.css 2026-04-28T03:34:03Z 本wiki上该页面的版本历史 MediaWiki 1.43.8 https://chuihub.com/index.php?title=MediaWiki:Gadget-ThemeSwitch.css&diff=375&oldid=prev 2026-03-12T11:00:41Z

<p>Theme switcher gadget CSS</p> <p><b>新页面</b></p><div>/* ThemeSwitch gadget — floating picker */<br /> <br /> #theme-picker {<br /> position: fixed;<br /> bottom: 5.5rem;<br /> right: 1.2rem;<br /> z-index: 9999;<br /> font-family: -apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, sans-serif;<br /> }<br /> <br /> #theme-toggle-btn {<br /> width: 42px;<br /> height: 42px;<br /> border-radius: 50%;<br /> border: 2px solid rgba(255,255,255,0.6);<br /> box-shadow: 0 3px 12px rgba(0,0,0,0.25);<br /> cursor: pointer;<br /> font-size: 1.2em;<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> transition: transform 0.2s, box-shadow 0.2s;<br /> outline: none;<br /> }<br /> #theme-toggle-btn:hover {<br /> transform: scale(1.1);<br /> box-shadow: 0 5px 18px rgba(0,0,0,0.3);<br /> }<br /> <br /> #theme-picker-menu {<br /> position: absolute;<br /> bottom: 52px;<br /> right: 0;<br /> background: #fff;<br /> border-radius: 12px;<br /> box-shadow: 0 8px 30px rgba(0,0,0,0.18);<br /> padding: 0.6em;<br /> min-width: 130px;<br /> display: none;<br /> flex-direction: column;<br /> gap: 0.3em;<br /> border: 1px solid rgba(0,0,0,0.08);<br /> }<br /> #theme-picker-menu.open {<br /> display: flex;<br /> }<br /> <br /> .theme-picker-heading {<br /> font-size: 0.72em;<br /> text-transform: uppercase;<br /> letter-spacing: 0.08em;<br /> color: #999;<br /> padding: 0.2em 0.5em 0.4em;<br /> font-weight: 600;<br /> }<br /> <br /> .theme-option {<br /> display: flex;<br /> align-items: center;<br /> gap: 0.6em;<br /> padding: 0.45em 0.7em;<br /> border: none;<br /> background: none;<br /> border-radius: 8px;<br /> cursor: pointer;<br /> font-size: 0.9em;<br /> color: #333;<br /> text-align: left;<br /> width: 100%;<br /> transition: background 0.15s;<br /> }<br /> .theme-option:hover {<br /> background: #f0f4f8;<br /> }<br /> <br /> .theme-swatch {<br /> width: 18px;<br /> height: 18px;<br /> border-radius: 50%;<br /> flex-shrink: 0;<br /> display: inline-block;<br /> }<br /> <br /> /* Dark theme: make the menu itself dark */<br /> html.theme-dark #theme-picker-menu {<br /> background: #252836;<br /> border-color: #2d3748;<br /> color: #e2e8f0;<br /> }<br /> html.theme-dark .theme-option { color: #e2e8f0; }<br /> html.theme-dark .theme-option:hover { background: #2d3748; }<br /> html.theme-dark .theme-picker-heading { color: #718096; }<br /> <br /> /* Warm theme */<br /> html.theme-warm #theme-picker-menu {<br /> background: #faf6ef;<br /> border-color: #e8dcc8;<br /> }<br /> html.theme-warm .theme-option { color: #3d2b0f; }<br /> html.theme-warm .theme-option:hover { background: #f5ede0; }</div>

LocalAdmin