https://www.gail.wiki/index.php?action=history&feed=atom&title=Template%3AMenu%2Fstyles.css 2026-04-17T08:24:17Z Revision history for this page on the wiki MediaWiki 1.44.0 https://www.gail.wiki/index.php?title=Template:Menu/styles.css&diff=211&oldid=prev 2025-08-25T21:56:22Z

<p>Created page with &quot;<span class="autocomment">Tabs container: </span> .gw-tabs { margin: 1rem 0; } <span class="autocomment">Hide radio inputs, style labels as tabs: </span> .gw-tab-input { position: absolute; left: -9999px; } .gw-tab { display: inline-block; padding: .5rem .9rem; margin: 0 .25rem -.05rem 0; border: 1px solid #bfa3b1; border-bottom: 0; border-top-left-radius: .6rem; border-top-right-radius: .6rem; background: #eee8f2; color: #3d3340; cursor: pointer; font-weight: 600; } .gw-tab:hover { background: #e6ddee; }...&quot;</p> <p><b>New page</b></p><div>/* Tabs container */<br /> .gw-tabs { margin: 1rem 0; }<br /> <br /> /* Hide radio inputs, style labels as tabs */<br /> .gw-tab-input { position: absolute; left: -9999px; }<br /> .gw-tab {<br /> display: inline-block;<br /> padding: .5rem .9rem;<br /> margin: 0 .25rem -.05rem 0;<br /> border: 1px solid #bfa3b1;<br /> border-bottom: 0;<br /> border-top-left-radius: .6rem;<br /> border-top-right-radius: .6rem;<br /> background: #eee8f2;<br /> color: #3d3340;<br /> cursor: pointer;<br /> font-weight: 600;<br /> }<br /> .gw-tab:hover { background: #e6ddee; }<br /> <br /> /* Panels: default hidden; show when corresponding input is checked */<br /> .gw-panel {<br /> display: none;<br /> border: 1px solid #bfa3b1;<br /> border-radius: 0 .75rem .75rem .75rem;<br /> padding: 1rem;<br /> background: #fff5fa;<br /> }<br /> .gw-tab-input:checked + .gw-tab + .gw-panel { display: block; }<br /> <br /> /* Grid of pink cards */<br /> .gw-menu-grid {<br /> display: grid;<br /> grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));<br /> gap: .75rem;<br /> }<br /> <br /> .gw-item {<br /> position: relative;<br /> padding: .85rem 1rem;<br /> background: #fff5fa;<br /> border: 1px solid #bfa3b1;<br /> border-left: 8px solid #b0005a;<br /> border-radius: .75rem;<br /> box-shadow: 0 1px 2px rgba(0,0,0,.06);<br /> font-size: 1rem;<br /> line-height: 1.35;<br /> }<br /> .gw-item a { color: #3d3340; text-decoration: none; font-weight: 600; }<br /> .gw-item:hover { border-color: #b0005a; }<br /> <br /> /* Tooltip (sanitizer-safe): text from data-desc; no transforms/transitions */<br /> .gw-item::after {<br /> content: attr(data-desc);<br /> position: absolute;<br /> left: 0;<br /> right: 0;<br /> bottom: 100%;<br /> margin-bottom: 6px;<br /> background: #3d3340;<br /> color: #fff;<br /> border-radius: .5rem;<br /> padding: .5rem .6rem;<br /> font-size: .9rem;<br /> line-height: 1.3;<br /> opacity: 0;<br /> /* no pointer-events, no transform/transition/z-index */<br /> white-space: normal;<br /> }<br /> .gw-item:hover::after { opacity: 1; }<br /> <br /> /* Mobile: stack columns */<br /> @media (max-width: 800px) {<br /> .gw-menu-grid { grid-template-columns: 1fr; }<br /> }</div>

GailAdmin