X-Git-Url: http://git.plutz.net/?p=serve0;a=blobdiff_plain;f=style.css;h=05d278fb649bf9c20a9bda6440ad257ea7e1ae85;hp=d5007a06da3f75c3a275a9c074e00bd62e9c2322;hb=b22f5dedd33a3c4b3a42f06072923b0f75b6799f;hpb=7c5e13183df4717e76f84a5cf99daa6d2d51d91b diff --git a/style.css b/style.css index d5007a0..05d278f 100644 --- a/style.css +++ b/style.css @@ -5,19 +5,36 @@ button { padding: .125em .5em; } a { color: inherit; text-decoration: none;} +input { + border: 1px solid; + padding: .25em .5em; + line-height: 1em; + vertical-align: bottom; +} +input[type=number] { padding-right: 0; } +input[type=radio], input[type=checkbox] { vertical-align: baseline; } +select { + border: 1px solid; + padding: .125em .5em; +} + body { color: white; background-color: black; min-height: 100%; } -#prefs, #bookmarks, #multitag { +#prefs, #bookmarks, +#multitag, #advsearch { display: block; + position: relative; overflow: hidden; height: 0; text-align: left; + background-color: #333; } #prefs:target, +#advsearch:target, #multitag:target, #bookmarks:target { height: auto; @@ -53,41 +70,39 @@ a[href="#advsearch"]:before { margin: 0 .5em; } -#prefs:target { +#prefs { position: absolute; right: 0; width: 13em; margin-left: auto; margin-top: -1px; - background-color: #333; border: 1px solid; border-top: none; border-right: none; - padding: .5em 1em; + padding: 0 1em; z-index: 1; - overflow: visible; } -#prefs:target a[href="#"] { +#prefs a[href="#"] { display: block; position: relative; - top: -1.5em; right: -.5em; - margin-left: 4em; + top: -1.125em; + margin-right: -.5em; + margin-bottom: -1em; text-align: right; font-size: 1.5em; - padding: 0 .25em; - background-color: #333; - z-index: 1; + padding-right: .25em; + background-color: inherit; } #prefs label[for=prefs_ps] { font-weight: bold; } #prefs #prefs_ps { - max-width: 3em; + max-width: 4em; margin-bottom: 1em; } #prefs button { - margin-top: 1em; + margin: 1em 0; } #prefs input { vertical-align: top; } #prefs input[type=radio] + label, @@ -97,6 +112,96 @@ a[href="#advsearch"]:before { max-width: 85%; } +#advsearch:target { + display: block; + position: relative; + text-align: center; + border-bottom: 1px solid; +} +#advsearch a[href="#"] { + display: block; + line-height: 2em; + background-color: inherit; + border-bottom: 1px solid; + text-align: left; + padding-left: .5em; + position: relative; + top: -2em; +} +#advsearch .help { + display: block; + margin: -1em 1em 1em 1em; + padding: .5em 1em; + background-color: #444; + line-height: 1.5em; + text-align: left; +} + +#advsearch input.and {display: none;} +#advsearch input.and + label {display: none} +#advsearch input.and + label + .select {display: none;} + +#advsearch input.and + label:nth-of-type(2), +#advsearch input.and:checked + label + .select + input + label { + display: inline-block; + vertical-align: top; + margin: 0 .5% 1em .5%; + width: 4%; + padding: .5em 0; + text-align: center; + font-weight: bold; + border: 1px solid; +} + +#advsearch input.and:checked + label + .select + input:checked + label, +#advsearch input.and:checked + label:nth-of-type(2), +#advsearch input.and:checked + label { display: none; } + +#advsearch input.and + label + .select:first-of-type, +#advsearch input.and:checked + label + .select { + display: inline-block; + position: relative; + width: 19%; + margin: 0 .5% 1em .5%; + min-width: 200px; + min-height: 12em; + overflow: hidden; + text-align: left; +} + +#advsearch .select input.pol { + margin: .5em .25em 0 .5em; +} +#advsearch .select input.pol + label { + font-weight: bold; +} +#advsearch .select label.head { + display: block; + font-weight: bold; + padding: .5em 0 0 .5em; + border-bottom: 1px solid; +} + +#advsearch .select select {display: none;} +#advsearch .select input.cat { display: none; } +#advsearch .select input.cat + label { + display: block; + margin-right: 50%; + padding: .25em .5em; + font-size: 1.125em; + border-bottom: 1px solid; +} +#advsearch .select input.cat:checked + label { + background-color: #444; +} +#advsearch .select input.cat:checked + label + select { + display: block; + position: absolute; + top: 3.5em; bottom: 0; + right: 0; left: 50%; + width: 50%; +} + .list { position: relative; display: inline-block; @@ -195,7 +300,7 @@ a[href="#advsearch"]:before { position: relative; top: -1em; padding-right: 10em; - background-color: #333; + background-color: inherit; } #multitag fieldset{ display: inline-block;