https://wiki.tribesdepot.com/index.php?action=history&feed=atom&title=Module%3APrevnext%2Fstyles.css 2026-04-28T12:13:05Z Revision history for this page on the wiki MediaWiki 1.44.0 https://wiki.tribesdepot.com/index.php?title=Module:Prevnext/styles.css&diff=13264&oldid=prev 2024-02-17T20:49:37Z

<p>Created page with &quot;.template-prevnext { margin: var( --space-md ) 0; padding: var( --space-xxs ); background-color: var( --color-surface-2 ); border-radius: var( --border-radius--medium ); font-size: 0.875rem; line-height: 1.375; display: grid; align-items: center; grid-template-areas: &#039;prev current next&#039;; grid-template-columns: minmax( max-content, 1fr ) minmax( max-content, 1fr ) minmax( max-content, 1fr ); } .template-prevnext__prev, .template-pr...&quot;</p> <p><b>New page</b></p><div>.template-prevnext {<br /> margin: var( --space-md ) 0;<br /> padding: var( --space-xxs );<br /> background-color: var( --color-surface-2 );<br /> border-radius: var( --border-radius--medium );<br /> font-size: 0.875rem;<br /> line-height: 1.375;<br /> display: grid;<br /> align-items: center;<br /> grid-template-areas: &#039;prev current next&#039;;<br /> grid-template-columns: minmax( max-content, 1fr ) minmax( max-content, 1fr ) minmax( max-content, 1fr );<br /> }<br /> <br /> .template-prevnext__prev,<br /> .template-prevnext__next {<br /> position: relative;<br /> border-radius: var( --border-radius--small );<br /> display: flex;<br /> align-items: center;<br /> gap: 0.75rem;<br /> }<br /> <br /> .template-prevnext__prev,<br /> .template-prevnext__current,<br /> .template-prevnext__next {<br /> padding: var( --space-xs );<br /> }<br /> <br /> .template-prevnext__prev {<br /> grid-area: prev;<br /> }<br /> <br /> .template-prevnext__current {<br /> grid-area: current;<br /> text-align: center;<br /> }<br /> <br /> .template-prevnext__next {<br /> grid-area: next;<br /> justify-content: flex-end;<br /> text-align: end;<br /> }<br /> <br /> .template-prevnext__link:hover {<br /> background-color: var( --background-color-quiet--hover );<br /> }<br /> <br /> .template-prevnext__link:hover &gt; .template-prevnext__icon {<br /> opacity: var( --opacity-icon-base--hover );<br /> }<br /> <br /> .template-prevnext__prev:hover &gt; .template-prevnext__icon {<br /> transform: translateX( -2px );<br /> }<br /> <br /> .template-prevnext__next:hover &gt; .template-prevnext__icon {<br /> transform: translateX( 2px );<br /> }<br /> <br /> .template-prevnext__link:active {<br /> background-color: var( --background-color-quiet--active );<br /> }<br /> <br /> .template-prevnext__link:active &gt; .template-prevnext__icon {<br /> opacity: var( --opacity-icon-base--active );<br /> }<br /> <br /> .template-prevnext__icon {<br /> opacity: var( --opacity-icon-base );<br /> transition: transform 250ms ease;<br /> }<br /> <br /> .template-prevnext__title {<br /> color: var( --color-base--emphasized );<br /> font-weight: 500;<br /> }<br /> <br /> .template-prevnext__link .template-prevnext__title {<br /> color: var( --color-primary );<br /> }<br /> <br /> .template-prevnext__link--new .template-prevnext__title {<br /> color: var( --color-link-new );<br /> }<br /> <br /> .template-prevnext__desc {<br /> color: var( --color-base--subtle );<br /> font-size: 0.8125rem;<br /> }<br /> <br /> .template-prevnext__linkoverlay {<br /> position: absolute;<br /> top: 0;<br /> left: 0;<br /> right: 0;<br /> bottom: 0;<br /> }<br /> <br /> .template-prevnext__linkoverlay &gt; a {<br /> display: block;<br /> font-size: 0;<br /> height: 100%;<br /> }<br /> <br /> html.skin-citizen-dark .template-prevnext__icon img {<br /> filter: invert( 1 );<br /> }<br /> <br /> <br /> @media screen and ( max-width: 639px ) {<br /> .template-prevnext {<br /> grid-template-areas:<br /> &#039;current current&#039;<br /> &#039;prev next&#039;;<br /> grid-template-columns: auto;<br /> }<br /> <br /> .template-prevnext__current {<br /> border-bottom: 1px solid var( --border-color-base );<br /> }<br /> }</div>

Bigwig