[web-shared] master: Update wiki.css for latest upstream pagetools.less

Author: Tim Düsterhus (TimWolla) Date: 2026-09-16T17:50:00+02:00 Commit: https://github.com/php/web-shared/commit/3c67d9ca88bd1be1615d93570b23399b1f4d7da0 Raw diff: https://github.com/php/web-shared/commit/3c67d9ca88bd1be1615d93570b23399b1f4d7da0.diff Update wiki.css for latest upstream pagetools.less see https://github.com/php/web-wiki/blob/master/dokuwiki/lib/tpl/dokuwiki/css/pagetools.less Changed paths: M styles/wiki.css Diff: diff --git a/styles/wiki.css b/styles/wiki.css index 583d2a2..e674ee0 100644 --- a/styles/wiki.css +++ b/styles/wiki.css @@ -233,406 +233,86 @@ body footer { right: auto; left: 40px; } -#dokuwiki__pagetools { - position: absolute; - right: -44px; - /* on same vertical level as first headline, because .page has 2em padding */ - top: 0; - width: 40px; +#dokuwiki__site > .site { + padding-right: 2.75rem; + padding-left: 2.75rem; } -#dokuwiki__pagetools h3 { - display: none; +.dokuwiki div.page { + height: 14.5rem; + min-height: 14.5rem; + height: auto; } -[dir=rtl] #dokuwiki__pagetools { - right: auto; - left: -40px; +#dokuwiki__pagetools { + position: absolute; + right: -2.75rem; + top: 2em; + width: 2.75rem; } #dokuwiki__pagetools div.tools { position: fixed; - width: 40px; + width: 2.75rem; } -#dokuwiki__pagetools ul { +#dokuwiki__pagetools div.tools ul { position: absolute; right: 0; text-align: right; margin: 0; padding: 0; - /* add transparent border to prevent jumping when proper border is added on hover */ border: 1px solid transparent; z-index: 10; } -[dir=rtl] #dokuwiki__pagetools ul { - right: auto; - left: 0; - text-align: left; -} -#dokuwiki__pagetools ul li { +#dokuwiki__pagetools div.tools ul li { padding: 0; margin: 0; list-style: none; font-size: 0.875em; - height: 2.5em; } -#dokuwiki__pagetools ul li a { +#dokuwiki__pagetools div.tools ul li a { display: block; - min-height: 20px; - /* 30 - 2x5 */ - line-height: 20px; - padding: 0; - background-position: right 0; - background-repeat: no-repeat; - /* add transparent border to prevent jumping when proper border is added on focus */ border: 1px solid transparent; white-space: nowrap; - width: 30px; - height: 30px; - overflow: hidden; - margin-left: auto; - /* align right if the ul is larger because one item is focused */ -} -#dokuwiki__pagetools ul li a:before { - content: url(//wiki.php.net/lib/tpl/phpnet/images/pagetools-sprite.png?v=2); - display: inline-block; - font-size: 0; - line-height: 0; -} -[dir=rtl] #dokuwiki__pagetools ul li a { - background-position: left 0; - margin-right: auto; - margin-left: 0; -} -/* show all tools on hover and individual tools on focus */ -#dokuwiki__pagetools:hover ul, -#dokuwiki__pagetools ul li a:focus, -#dokuwiki__pagetools ul li a:active { + line-height: 2.25rem; + vertical-align: middle; + height: 2.25rem; background-color: #fff; - border-color: #ccc; - border-radius: 2px; - box-shadow: 2px 2px 2px #999; -} -#dokuwiki__pagetools:hover ul li a, -#dokuwiki__pagetools ul li a:focus, -#dokuwiki__pagetools ul li a:active { - width: auto; - height: auto; - overflow: visible; - padding: 5px 40px 5px 5px; - background-image: url(//wiki.php.net/lib/tpl/phpnet/images/pagetools-sprite.png?v=2); -} -#dokuwiki__pagetools:hover ul li a:before, -#dokuwiki__pagetools ul li a:focus:before { - content: none; -} -[dir=rtl] #dokuwiki__pagetools:hover ul, -[dir=rtl] #dokuwiki__pagetools ul li a:focus { - box-shadow: -2px 2px 2px #999; -} -[dir=rtl] #dokuwiki__pagetools:hover li a, -[dir=rtl] #dokuwiki__pagetools ul li a:focus, -[dir=rtl] #dokuwiki__pagetools ul li a:active { - padding: 5px 5px 5px 40px; -} -/* IE7 fixes, doesn't work without images */ -#IE7 #dokuwiki__pagetools ul li a { - background-image: url(//wiki.php.net/lib/tpl/phpnet/images/pagetools-sprite.png?v=2); -} -#IE7 #dokuwiki__pagetools:hover ul li a span, -#IE7 #dokuwiki__pagetools ul li a:focus span, -#IE7 #dokuwiki__pagetools ul li a:active span { - clip: auto; - display: inline; - position: static; -} -#IE7 #dokuwiki__pagetools ul li a span { - clip: rect(0 0 0 0); - position: absolute; -} -#dokuwiki__pagetools ul li a:hover, -#dokuwiki__pagetools ul li a:active, -#dokuwiki__pagetools ul li a:focus { - text-decoration: none; -} -#dokuwiki__pagetools ul li a:hover { - background-color: #eee; -} -/*____________ all available icons in sprite ____________*/ -/** - * page tools without highlighting - * - * @param string @action The action class - * @param int @position Position in the page tools sprite - */ -/** - * page tools with highlighting - * - * @param string @action The action class - * @param int @position Position in the page tools sprite - * @param string @mode The mode in which this tool should be highlighted - */ -#dokuwiki__pagetools ul li a.edit { - background-position: right -90px; -} -#dokuwiki__pagetools ul li a.edit:before { - margin-top: -90px; -} -#dokuwiki__pagetools ul li a.edit:hover, -#dokuwiki__pagetools ul li a.edit:active, -#dokuwiki__pagetools ul li a.edit:focus { - background-position: right -135px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.edit { - background-position: left -90px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.edit:hover, -[dir=rtl] #dokuwiki__pagetools ul li a.edit:active, -[dir=rtl] #dokuwiki__pagetools ul li a.edit:focus { - background-position: left -135px; -} -#dokuwiki__pagetools ul li a.create { - background-position: right -180px; -} -#dokuwiki__pagetools ul li a.create:before { - margin-top: -180px; -} -#dokuwiki__pagetools ul li a.create:hover, -#dokuwiki__pagetools ul li a.create:active, -#dokuwiki__pagetools ul li a.create:focus { - background-position: right -225px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.create { - background-position: left -180px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.create:hover, -[dir=rtl] #dokuwiki__pagetools ul li a.create:active, -[dir=rtl] #dokuwiki__pagetools ul li a.create:focus { - background-position: left -225px; -} -#dokuwiki__pagetools ul li a.show { - background-position: right -360px; -} -#dokuwiki__pagetools ul li a.show:before { - margin-top: -360px; -} -#dokuwiki__pagetools ul li a.show:hover, -#dokuwiki__pagetools ul li a.show:active, -#dokuwiki__pagetools ul li a.show:focus { - background-position: right -405px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.show { - background-position: left -360px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.show:hover, -[dir=rtl] #dokuwiki__pagetools ul li a.show:active, -[dir=rtl] #dokuwiki__pagetools ul li a.show:focus { - background-position: left -405px; -} -#dokuwiki__pagetools ul li a.source { - background-position: right -450px; -} -#dokuwiki__pagetools ul li a.source:before { - margin-top: -450px; -} -#dokuwiki__pagetools ul li a.source:hover, -#dokuwiki__pagetools ul li a.source:active, -#dokuwiki__pagetools ul li a.source:focus { - background-position: right -495px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.source { - background-position: left -450px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.source:hover, -[dir=rtl] #dokuwiki__pagetools ul li a.source:active, -[dir=rtl] #dokuwiki__pagetools ul li a.source:focus { - background-position: left -495px; -} -#dokuwiki__pagetools ul li a.draft { - background-position: right -270px; } -#dokuwiki__pagetools ul li a.draft:before { - margin-top: -270px; -} -#dokuwiki__pagetools ul li a.draft:hover, -#dokuwiki__pagetools ul li a.draft:active, -#dokuwiki__pagetools ul li a.draft:focus { - background-position: right -315px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.draft { - background-position: left -270px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.draft:hover, -[dir=rtl] #dokuwiki__pagetools ul li a.draft:active, -[dir=rtl] #dokuwiki__pagetools ul li a.draft:focus { - background-position: left -315px; -} -#dokuwiki__pagetools ul li a.revs { - background-position: right -630px; -} -#dokuwiki__pagetools ul li a.revs:before { - margin-top: -630px; -} -#dokuwiki__pagetools ul li a.revs:hover, -#dokuwiki__pagetools ul li a.revs:active, -#dokuwiki__pagetools ul li a.revs:focus { - background-position: right -675px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.revs { - background-position: left -630px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.revs:hover, -[dir=rtl] #dokuwiki__pagetools ul li a.revs:active, -[dir=rtl] #dokuwiki__pagetools ul li a.revs:focus { - background-position: left -675px; -} -.mode_revisions #dokuwiki__pagetools ul li a.revs { - background-position: right -675px; -} -.mode_revisions #dokuwiki__pagetools ul li a.revs:before { - margin-top: -675px; -} -[dir=rtl] .mode_revisions #dokuwiki__pagetools ul li a.revs { - background-position: left -675px; -} -#dokuwiki__pagetools ul li a.backlink { - background-position: right -720px; -} -#dokuwiki__pagetools ul li a.backlink:before { - margin-top: -720px; -} -#dokuwiki__pagetools ul li a.backlink:hover, -#dokuwiki__pagetools ul li a.backlink:active, -#dokuwiki__pagetools ul li a.backlink:focus { - background-position: right -765px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.backlink { - background-position: left -720px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.backlink:hover, -[dir=rtl] #dokuwiki__pagetools ul li a.backlink:active, -[dir=rtl] #dokuwiki__pagetools ul li a.backlink:focus { - background-position: left -765px; -} -.mode_backlink #dokuwiki__pagetools ul li a.backlink { - background-position: right -765px; -} -.mode_backlink #dokuwiki__pagetools ul li a.backlink:before { - margin-top: -765px; -} -[dir=rtl] .mode_backlink #dokuwiki__pagetools ul li a.backlink { - background-position: left -765px; -} -#dokuwiki__pagetools ul li a.top { - background-position: right -900px; -} -#dokuwiki__pagetools ul li a.top:before { - margin-top: -900px; -} -#dokuwiki__pagetools ul li a.top:hover, -#dokuwiki__pagetools ul li a.top:active, -#dokuwiki__pagetools ul li a.top:focus { - background-position: right -945px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.top { - background-position: left -900px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.top:hover, -[dir=rtl] #dokuwiki__pagetools ul li a.top:active, -[dir=rtl] #dokuwiki__pagetools ul li a.top:focus { - background-position: left -945px; -} -#dokuwiki__pagetools ul li a.revert { - background-position: right -540px; -} -#dokuwiki__pagetools ul li a.revert:before { - margin-top: -540px; -} -#dokuwiki__pagetools ul li a.revert:hover, -#dokuwiki__pagetools ul li a.revert:active, -#dokuwiki__pagetools ul li a.revert:focus { - background-position: right -585px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.revert { - background-position: left -540px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.revert:hover, -[dir=rtl] #dokuwiki__pagetools ul li a.revert:active, -[dir=rtl] #dokuwiki__pagetools ul li a.revert:focus { - background-position: left -585px; -} -.mode_revert #dokuwiki__pagetools ul li a.revert { - background-position: right -585px; -} -.mode_revert #dokuwiki__pagetools ul li a.revert:before { - margin-top: -585px; -} -[dir=rtl] .mode_revert #dokuwiki__pagetools ul li a.revert { - background-position: left -585px; -} -#dokuwiki__pagetools ul li a.subscribe { - background-position: right -810px; -} -#dokuwiki__pagetools ul li a.subscribe:before { - margin-top: -810px; -} -#dokuwiki__pagetools ul li a.subscribe:hover, -#dokuwiki__pagetools ul li a.subscribe:active, -#dokuwiki__pagetools ul li a.subscribe:focus { - background-position: right -855px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.subscribe { - background-position: left -810px; -} -[dir=rtl] #dokuwiki__pagetools ul li a.subscribe:hover, -[dir=rtl] #dokuwiki__pagetools ul li a.subscribe:active, -[dir=rtl] #dokuwiki__pagetools ul li a.subscribe:focus { - background-position: left -855px; -} -.mode_subscribe #dokuwiki__pagetools ul li a.subscribe { - background-position: right -855px; -} -.mode_subscribe #dokuwiki__pagetools ul li a.subscribe:before { - margin-top: -855px; -} -[dir=rtl] .mode_subscribe #dokuwiki__pagetools ul li a.subscribe { - background-position: left -855px; -} -#dokuwiki__pagetools ul li a.mediaManager { - background-position: right -990px; -} -#dokuwiki__pagetools ul li a.mediaManager:before { - margin-top: -990px; -} -#dokuwiki__pagetools ul li a.mediaManager:hover, -#dokuwiki__pagetools ul li a.mediaManager:active, -#dokuwiki__pagetools ul li a.mediaManager:focus { - background-position: right -1035px; +#dokuwiki__pagetools div.tools ul li a span { + display: none; + margin: 0 0.5rem; } -[dir=rtl] #dokuwiki__pagetools ul li a.mediaManager { - background-position: left -990px; +#dokuwiki__pagetools div.tools ul li a svg { + width: 1.75rem; + height: 1.75rem; + margin: 0 0.5rem; + display: inline-block; + vertical-align: middle; + fill: #369; } -[dir=rtl] #dokuwiki__pagetools ul li a.mediaManager:hover, -[dir=rtl] #dokuwiki__pagetools ul li a.mediaManager:active, -[dir=rtl] #dokuwiki__pagetools ul li a.mediaManager:focus { - background-position: left -1035px; +#dokuwiki__pagetools div.tools ul li a:active span, #dokuwiki__pagetools div.tools ul li a:focus span, #dokuwiki__pagetools div.tools ul li a:hover span { + display: inline-block; } -#dokuwiki__pagetools ul li a.back { - background-position: right -1080px; +#dokuwiki__pagetools div.tools ul li a:active svg, #dokuwiki__pagetools div.tools ul li a:focus svg, #dokuwiki__pagetools div.tools ul li a:hover svg { + fill: #693; } -#dokuwiki__pagetools ul li a.back:before { - margin-top: -1080px; +[dir=rtl] #dokuwiki__pagetools { + right: auto; + left: -2.75rem; } -#dokuwiki__pagetools ul li a.back:hover, -#dokuwiki__pagetools ul li a.back:active, -#dokuwiki__pagetools ul li a.back:focus { - background-position: right -1125px; +[dir=rtl] #dokuwiki__pagetools div.tools ul { + right: auto; + left: 0; + text-align: left; } -[dir=rtl] #dokuwiki__pagetools ul li a.back { - background-position: left -1080px; +#dokuwiki__pagetools:hover div.tools ul, #dokuwiki__pagetools:focus-within div.tools ul { + background-color: ; + border-color: #369; + border-radius: 2px; + box-shadow: 2px 2px 2px ; } -[dir=rtl] #dokuwiki__pagetools ul li a.back:hover, -[dir=rtl] #dokuwiki__pagetools ul li a.back:active, -[dir=rtl] #dokuwiki__pagetools ul li a.back:focus { - background-position: left -1125px; +#dokuwiki__pagetools:hover div.tools ul li a span, #dokuwiki__pagetools:focus-within div.tools ul li a span { + display: inline-block; } + /** * This file provides styles for the Administration overview * (?do=admin).