From 47646cbe5334aba259a73af04680ff7f20cab739 Mon Sep 17 00:00:00 2001 From: paul Date: Sat, 10 Sep 2016 16:29:08 +0000 Subject: [PATCH] simplified styling svn path=/trunk/; revision=148 --- static/common.css | 115 ++++++++++++++++-------------------- templates/advfilter.html.sh | 8 +-- templates/playctl.html.sh | 12 ++-- templates/tagger.html.sh | 8 +-- 4 files changed, 64 insertions(+), 79 deletions(-) diff --git a/static/common.css b/static/common.css index 16910fb..e6de713 100644 --- a/static/common.css +++ b/static/common.css @@ -19,8 +19,8 @@ * { -moz-box-sizing: border-box; box-sizing: border-box; - -moz-transition: all .3s linear; - transition: all .3s linear; + -moz-transition: all .25s linear; + transition: all .25s linear; } body { @@ -63,7 +63,6 @@ textarea { background-color: #333; text-align: right; } -.panel:after { content: ''; display: block; clear: both;} .pagination_nav a { display: none; text-decoration: none; @@ -93,106 +92,92 @@ textarea { } .pagination_nav:hover a { display: inline; } + /* == Panels == */ -.panel { - position: relative; +.panel#search select { margin-right: .5em; } +.panel#search:after { + display: block; content: ''; + clear: both; +} + +.panel#search, .panel#foot, +.panel.top, .panel.bottom { display: block; width: 100%; margin: 0; padding: .25em .5em; background-color: #333; border-width: 1px; - border-style: none none solid none; -} - -a.panel { - font-weight: bold; - display: inline-block; - border: none; - width: auto; - padding: 0; - margin: auto 1em 1ex 0; - text-decoration: none; -} - -.panel .help { display: block;} - -/* == Top Panel == */ - -.panel.switchable.top { - position: absolute; - top: 0; + z-index: 1; } -body.playctl .panel#advfilter, -body.playctl .panel#morelinks, -body.playctl .panel#search { - margin-top: 1.25em; - border-top: 1px solid #FFF; +.panel#search, .panel.top { + position: relative; top: 0; + border-style: none none solid none; } - -.panel#search select { margin-right: .5em; } - -/* == Bottom Panels == */ -.panel.bottom, -.panel#foot { +.panel.top.switchable { position: absolute; } +.panel#foot, .panel.bottom { position: fixed; - bottom: 0px; + bottom: 0; border-style: solid none none none; } -/* == Switchable Panels == */ - .panel.switchable { - z-index: 1; + max-height: 0; overflow: hidden; - min-height: 0; max-height: 0; - padding-top: 0; padding-bottom: 0; + margin: 0; padding: 0; + border-width: 0; } .panel.switchable:target { - max-height: 100%; + max-height: 80%; overflow-y: scroll; -} -.panel.switchable.top:target{ padding-bottom: 1em; } - -.panel#search, -.panel#foot { - max-height: 100%; - z-index: 0; - padding: .25em .5em 0 .5em; - overflow: visible; + padding: .25em .5em; + border-width: 1px; + z-index: 2; } body.playctl .panel#search, -body.playctl .panel#foot { padding-right: .25em; } - +body.playctl .panel.top { + margin-top: 1.25em; + border-top: 1px solid #FFF; +} -/* == Panel Switches == */ +.panel#search > a, .panel#foot > a, +.panel.top > a, .panel.bottom > a{ + display: inline-block; + font-weight: bold; + text-decoration: none; + margin: .25em .5em 0 0; +} -.panel.switchable.bottom a.panel:last-of-type, -.panel.switchable.top a.panel:first-of-type { +.panel.switchable.top a:first-of-type { display: block; - border-style: none none solid none; - border-width: 1px; + margin-bottom: .5em; + border-bottom: 1px solid #FFF; } -.panel.switchable.bottom a.panel:last-of-type { - border-style: solid none none none; +.panel.switchable.bottom a:last-of-type { + display: block; margin-top: .5em; + border-top: 1px solid #FFF; } /* == Panel Elements == */ -.panel#advfilter .filter, -.panel#tagger .newtag, -.panel#tagger input[type=submit], -.panel#preferences > * { +.panel.switchable > fieldset, +.panel.switchable > input[type=submit] { + border: none; display: inline-block; vertical-align: top; margin-top: 1em; + max-width: 48%; } +.panel.switchable > fieldset.additional, +.panel.switchable > fieldset.description { + max-width: 100%; +} /* == Advanced Filters == */ diff --git a/templates/advfilter.html.sh b/templates/advfilter.html.sh index fb56645..5d27f3b 100755 --- a/templates/advfilter.html.sh +++ b/templates/advfilter.html.sh @@ -42,7 +42,7 @@ filterbox(){ cat <<-EOF -
+
of the items selected here: @@ -51,7 +51,7 @@ filterbox(){
$(category_tabs $(list_categories) )
-
+ EOF done } @@ -65,7 +65,7 @@ cat <Up to 10 filter boxes will appear as you start selecting tags. You can select multiple tags in each box by holding down the Ctrl-key. Click the "Filter!" button when you are ready.

$(filterbox {0..9}) -

+

-

+
EOF diff --git a/templates/playctl.html.sh b/templates/playctl.html.sh index a8a14a1..ad1ed93 100755 --- a/templates/playctl.html.sh +++ b/templates/playctl.html.sh @@ -79,7 +79,7 @@ cat <' "${cat}" catt="${cat}:" [ "$catt" = "none:" ] && catt='' @@ -88,18 +88,18 @@ cat <

' + printf '' done ) -

+

-

-

+

+
-

+
diff --git a/templates/tagger.html.sh b/templates/tagger.html.sh index 4838399..4b1d0fe 100755 --- a/templates/tagger.html.sh +++ b/templates/tagger.html.sh @@ -26,13 +26,13 @@ category_options(){ category_box(){ for cat in "$@"; do cat < +
-

+
EOF done } @@ -41,10 +41,10 @@ cat <

Add selectetd tags to selected videos.

$(category_box $(list_categories)) -

+

-

+
Hide -- 2.39.2