diff --git a/css/_media_fullscreen.css b/css/_media_fullscreen.css index 5f439c2..ab2e980 100644 --- a/css/_media_fullscreen.css +++ b/css/_media_fullscreen.css @@ -94,24 +94,36 @@ [dir=rtl] #mediamanager__page .namespaces { text-align: right; } + +/* make it look like a tab (as in _tabs.css) */ #mediamanager__page .namespaces h2 { font-size: 1em; display: inline-block; - border-width: 0; padding: .3em .8em; - margin: 0 .3em 0 0; + margin: 0 0 0 .3em; border-radius: .5em .5em 0 0; font-weight: normal; background-color: __background_alt__; color: __text__; + border: 1px solid __border__; + border-bottom-color: __background_alt__; line-height: 1.4em; + position: relative; + bottom: -1px; + z-index: 2; } * html #mediamanager__page .namespaces h2, *+html #mediamanager__page .namespaces h2 { display: inline; } [dir=rtl] #mediamanager__page .namespaces h2 { - margin-right: 10px; + margin: 0 .3em 0 0; + position: relative; + right: 10px; +} +#mediamanager__page .namespaces .panelHeader { + border-top: 1px solid __border__; + z-index: 1; } #mediamanager__page .namespaces ul { @@ -168,10 +180,12 @@ #mediamanager__page .panelHeader ul li.listType { padding-left: 30px; + margin: 0 0 0 5px; background: url('../../images/icon-list.png') 3px 1px no-repeat; } #mediamanager__page .panelHeader ul li.sortBy { padding-left: 30px; + margin: 0 0 0 5px; background: url('../../images/icon-sort.png') 3px 1px no-repeat; } @@ -188,10 +202,10 @@ #mediamanager__page .filelist ul { padding: 0; - margin: 0; + margin: 0 10px 0 0; } -[dir=rtl] #mediamanager__page .filelist ul.tabs { - margin-right: 10px; +[dir=rtl] #mediamanager__page .filelist ul { + margin: 0 10px 0 0; } #mediamanager__page .filelist .panelContent ul li:hover { diff --git a/css/_tabs.css b/css/_tabs.css index 1dffa8f..845ec9a 100644 --- a/css/_tabs.css +++ b/css/_tabs.css @@ -2,40 +2,56 @@ * This file provides the styles for general tabs. */ +.dokuwiki .tabs > ul, .dokuwiki ul.tabs { padding: 0; margin: 0; overflow: hidden; + position: relative; } +/* border underneath */ +.dokuwiki .tabs > ul:after, +.dokuwiki ul.tabs:after { + position: absolute; + content: ""; + width: 100%; + bottom: 0; + left: 0; + border-bottom: 1px solid __border__; + z-index: 1; +} + +.dokuwiki .tabs > ul li, .dokuwiki ul.tabs li { float: left; padding: 0; margin: 0; list-style: none; } +[dir=rtl] .dokuwiki .tabs > ul li, [dir=rtl] .dokuwiki ul.tabs li { float: right; } +.dokuwiki .tabs > ul li a, .dokuwiki ul.tabs li strong, .dokuwiki ul.tabs li a { - float: left; + display: inline-block; padding: .3em .8em; - margin: 0 .3em 0 0; + margin: 0 0 0 .3em; background-color: __background_neu__; color: __text__; + border: 1px solid __border__; border-radius: .5em .5em 0 0; + position: relative; + z-index: 0; } +[dir=rtl] .dokuwiki .tabs > ul li a, [dir=rtl] .dokuwiki ul.tabs li strong, [dir=rtl] .dokuwiki ul.tabs li a { - float: right; - margin: 0 0 0 .3em; -} -*+html[dir=rtl] .dokuwiki ul.tabs li strong, -*+html[dir=rtl] .dokuwiki ul.tabs li a { - float: none; - display: inline-block; + margin: 0 .3em 0 0; } + .dokuwiki ul.tabs li strong { font-weight: normal; } @@ -43,6 +59,11 @@ .dokuwiki ul.tabs li a:link, .dokuwiki ul.tabs li a:visited { } +.dokuwiki .tabs > ul li a:hover, +.dokuwiki .tabs > ul li a:active, +.dokuwiki .tabs > ul li a:focus, +.dokuwiki .tabs > ul li .curid a, +.dokuwiki .tabs > ul .active a, .dokuwiki ul.tabs li a:hover, .dokuwiki ul.tabs li a:active, .dokuwiki ul.tabs li a:focus, @@ -50,4 +71,12 @@ background-color: __background_alt__; color: __text__; text-decoration: none; + font-weight: normal; +} + +.dokuwiki .tabs > ul li .curid a, +.dokuwiki .tabs > ul li .active a, +.dokuwiki ul.tabs li strong { + z-index: 2; + border-bottom-color: __background_alt__; }