https://wiki.statsape.com/index.php?action=history&feed=atom&title=%E6%A8%A1%E6%9D%BF%3APrevnext%2Fstyles.css 2026-04-04T09:37:23Z 本wiki上该页面的版本历史 MediaWiki 1.39.6 https://wiki.statsape.com/index.php?title=%E6%A8%A1%E6%9D%BF:Prevnext/styles.css&diff=516&oldid=prev 2023-07-13T14:26:40Z

<p>创建页面，内容为“.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-prevnext__next { posi…”</p> <p><b>新页面</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: 900;<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: 720px) {<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>

Zeroclanzhang