diff options
author | Michael Hamann <michael@content-space.de> | 2013-02-25 00:55:01 +0100 |
---|---|---|
committer | Michael Hamann <michael@content-space.de> | 2013-02-25 01:32:15 +0100 |
commit | c97b0f20e860cdd8e4dbb72b14ca1588ec7abda1 (patch) | |
tree | bf5571c0fc6e1b2ba56a721c7d1e632210828396 /lib | |
parent | 058fd09655df42c72f3c447e3b9561e4909e978d (diff) | |
download | rpg-c97b0f20e860cdd8e4dbb72b14ca1588ec7abda1.tar.gz rpg-c97b0f20e860cdd8e4dbb72b14ca1588ec7abda1.tar.bz2 |
Fix pagetools display without images FS#2634
This makes the pagetools in non-hover/static/active-mode use another
image replacement technique that falls back to the text when images are
disabled. Furthermore this fixes the :focused-display in IE7 by using
:active, too.
Diffstat (limited to 'lib')
-rw-r--r-- | lib/tpl/dokuwiki/css/pagetools.css | 97 |
1 files changed, 82 insertions, 15 deletions
diff --git a/lib/tpl/dokuwiki/css/pagetools.css b/lib/tpl/dokuwiki/css/pagetools.css index 0c31e283f..41f876d48 100644 --- a/lib/tpl/dokuwiki/css/pagetools.css +++ b/lib/tpl/dokuwiki/css/pagetools.css @@ -72,43 +72,65 @@ display: block; min-height: 20px; /* 30 - 2x5 */ line-height: 20px; - padding: 5px 40px 5px 5px; - background-image: url(images/pagetools-sprite.png); + 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 */ } -[dir=rtl] #dokuwiki__pagetools ul li a { - padding: 5px 5px 5px 40px; - background-position: left 0; + +#dokuwiki__pagetools ul li a:before { + content: url(images/pagetools-sprite.png); + display: inline-block; + font-size: 0; + line-height: 0; } -/* hide labels accessibly when neither on hover nor on focus */ -#dokuwiki__pagetools ul li a span { - position: absolute; - clip: rect(0 0 0 0); /* IE7, IE6 */ - clip: rect(0, 0, 0, 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:focus, +#dokuwiki__pagetools ul li a:active { background-color: __background__; border-color: __border__; border-radius: 2px; box-shadow: 2px 2px 2px __text_alt__; } + +#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(images/pagetools-sprite.png); +} + +#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 __text_alt__; } -#dokuwiki__pagetools:hover ul li a span, -#dokuwiki__pagetools ul li a:focus span { - display: inline; - position: static; +[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; } #dokuwiki__pagetools ul li a:hover, @@ -139,6 +161,9 @@ background-position: left -45px; } +#dokuwiki__pagetools ul li a.create:before { + margin-top: -90px; +} #dokuwiki__pagetools ul li a.create { background-position: right -90px; } @@ -159,6 +184,9 @@ #dokuwiki__pagetools ul li a.show { background-position: right -270px; } +#dokuwiki__pagetools ul li a.show:before { + margin-top: -270px; +} #dokuwiki__pagetools ul li a.show:hover, #dokuwiki__pagetools ul li a.show:active, #dokuwiki__pagetools ul li a.show:focus { @@ -176,6 +204,9 @@ #dokuwiki__pagetools ul li a.source { background-position: right -360px; } +#dokuwiki__pagetools ul li a.source:before { + margin-top: -360px; +} #dokuwiki__pagetools ul li a.source:hover, #dokuwiki__pagetools ul li a.source:active, #dokuwiki__pagetools ul li a.source:focus { @@ -193,6 +224,9 @@ #dokuwiki__pagetools ul li a.draft { background-position: right -180px; } +#dokuwiki__pagetools ul li a.draft:before { + margin-top: -180px; +} #dokuwiki__pagetools ul li a.draft:hover, #dokuwiki__pagetools ul li a.draft:active, #dokuwiki__pagetools ul li a.draft:focus { @@ -210,12 +244,18 @@ #dokuwiki__pagetools ul li a.revs { background-position: right -540px; } +#dokuwiki__pagetools ul li a.revs:before { + margin-top: -540px; +} #dokuwiki__pagetools ul li a.revs:hover, #dokuwiki__pagetools ul li a.revs:active, #dokuwiki__pagetools ul li a.revs:focus, .mode_revisions #dokuwiki__pagetools ul li a.revs { background-position: right -585px; } +.mode_revisions #dokuwiki__pagetools ul li a.revs:before { + margin-top: -585px; +} [dir=rtl] #dokuwiki__pagetools ul li a.revs { background-position: left -540px; } @@ -229,12 +269,18 @@ #dokuwiki__pagetools ul li a.backlink { background-position: right -630px; } +#dokuwiki__pagetools ul li a.backlink:before { + margin-top: -630px; +} #dokuwiki__pagetools ul li a.backlink:hover, #dokuwiki__pagetools ul li a.backlink:active, #dokuwiki__pagetools ul li a.backlink:focus, .mode_backlink #dokuwiki__pagetools ul li a.backlink { background-position: right -675px; } +.mode_backlink #dokuwiki__pagetools ul li a.backlink:before { + margin-top: -675px; +} [dir=rtl] #dokuwiki__pagetools ul li a.backlink { background-position: left -630px; } @@ -248,6 +294,9 @@ #dokuwiki__pagetools ul li a.top { background-position: right -810px; } +#dokuwiki__pagetools ul li a.top:before{ + margin-top: -810px; +} #dokuwiki__pagetools ul li a.top:hover, #dokuwiki__pagetools ul li a.top:active, #dokuwiki__pagetools ul li a.top:focus { @@ -265,12 +314,18 @@ #dokuwiki__pagetools ul li a.revert { background-position: right -450px; } +#dokuwiki__pagetools ul li a.revert:before { + margin-top: -450px; +} #dokuwiki__pagetools ul li a.revert:hover, #dokuwiki__pagetools ul li a.revert:active, #dokuwiki__pagetools ul li a.revert:focus, .mode_revert #dokuwiki__pagetools ul li a.revert { background-position: right -495px; } +.mode_revert #dokuwiki__pagetools ul li a.revert:before { + margin-top: -450px; +} [dir=rtl] #dokuwiki__pagetools ul li a.revert { background-position: left -450px; } @@ -284,12 +339,18 @@ #dokuwiki__pagetools ul li a.subscribe { background-position: right -720px; } +#dokuwiki__pagetools ul li a.subscribe:before { + margin-top: -720px; +} #dokuwiki__pagetools ul li a.subscribe:hover, #dokuwiki__pagetools ul li a.subscribe:active, #dokuwiki__pagetools ul li a.subscribe:focus, .mode_subscribe #dokuwiki__pagetools ul li a.subscribe { background-position: right -765px; } +.mode_subscribe #dokuwiki__pagetools ul li a.subscribe:before { + margin-top: -765px; +} [dir=rtl] #dokuwiki__pagetools ul li a.subscribe { background-position: left -720px; } @@ -303,6 +364,9 @@ #dokuwiki__pagetools ul li a.mediaManager { background-position: right -900px; } +#dokuwiki__pagetools ul li a.mediaManager:before { + margin-top: -900px; +} #dokuwiki__pagetools ul li a.mediaManager:hover, #dokuwiki__pagetools ul li a.mediaManager:active, #dokuwiki__pagetools ul li a.mediaManager:focus { @@ -320,6 +384,9 @@ #dokuwiki__pagetools ul li a.back { background-position: right -990px; } +#dokuwiki__pagetools ul li a.back { + margin-top: -990px; +} #dokuwiki__pagetools ul li a.back:hover, #dokuwiki__pagetools ul li a.back:active, #dokuwiki__pagetools ul li a.back:focus { |