X-Git-Url: https://git.mdrn.pl/wolnelektury.git/blobdiff_plain/9e41863c3cff14cbbc65b783ee57120fb59fa22c..1a0ae46452efb09971ed0a5ea35ddc8bda8adc7a:/wolnelektury/static/css/header.css diff --git a/wolnelektury/static/css/header.css b/wolnelektury/static/css/header.css index abea73cc7..547e114a7 100755 --- a/wolnelektury/static/css/header.css +++ b/wolnelektury/static/css/header.css @@ -1,28 +1,29 @@ -/* Logo font */ -@font-face { - /* IE version */ - font-family: WL-Logo; - src: url(/static/fonts/WL.eot); +#header-bg { + z-index: -1; + background: #191919; + position: absolute; + width: 50%; + height: 9.4em; } -@font-face { - font-family: WL-Logo; - src: url(/static/fonts/WL.ttf) format("truetype"); -} - #header { - color: #969696; + height: 3em; + padding-top: 1.9em; + padding-bottom: 0; + color: #989898; background: #191919; } +#header a { + color: #17CFDB; +} #half-header { - background: url('/static/img/bg-header.png'); - background-position: center; - background-size: 100%; + padding-bottom: 0; } #half-header-content { background: #191919; + color: #989898; } @@ -33,122 +34,180 @@ #logo { position: absolute; - top: 4em; + top: -1.6em; + margin-left: 1.5em; } #logo a { - font-family: WL-Logo; - font-size: 1.9em; color:#f7f7f7; -} - -#logo img { - max-width: 15em; + font-size: 2.05em; + text-shadow: 0 0 10px #17CFDB; } #tagline { display: inline-block; - margin-left: 16em; + margin-left: 25.5em; +} +#tagline span { + font-size: 1.3em; + color: #bbb; } -#search { +#search-area { margin: 0; background: #444; - margin-left: 16em; - width: 59em; + color: white; + margin-left: 24em; + width: 73.5em; } #search-field { display: inline-block; - width: 50em; - padding-left: .5; - padding-right: .5; - padding: .1em .5em 0 .5em; + width: 63.1em; + padding-left: .5em; + padding-right: 0; + padding-top: 0.5em; + padding-bottom: 0; } -#search-field input { - height: 2.8em; - border: none; - width: 49.5em; - font-size: 1em; +#search { + font-size: 1.3em; + padding: 0; + /*height: 3.3em; + width: 62.6em; padding-left: .5em; -webkit-border-radius: .5em; -moz-border-radius: .5em; + border: none; border-radius: .5em; -webkit-box-shadow:0 0 .5em #444 inset; -moz-box-shadow:0 0 .5em #444 inset; + box-shadow: 0 0 .5em #444 inset;*/ + height: 2.54em; + width: 47.47em; + padding-left: 1em; + -webkit-border-radius: .38em; + -moz-border-radius: .38em; + border: none; + border-radius: .38em; + -webkit-box-shadow:0 0 .38em #444 inset; + -moz-box-shadow:0 0 .38em #444 inset; box-shadow: 0 0 .5em #444 inset; + line-height: 2.5em; + + font-family: Georgia; + background-color: #fff; + color: #000; + z-index: 200; + position: relative; +} + +/* styling search placeholder */ + +#search:-webkit-input-placeholder +{ + font-family: Georgia; + font-style: italic; + color: #767676; +} + +#search.placeholder +{ + font-family: Georgia; + font-style: italic; + color: #767676; +} + +#search:-moz-placeholder +{ + font-family: Georgia; + font-style: italic; + color: #767676; } #search-button { display: inline-block; - background: #02adb7; + background: #018189; + color: white; padding: 0; margin: 0; - width: 8em; + width: 9.4em; + float: right; } #search-button button { font-size: 1em; - /* should match grid-line */ - height: 4em; + height: 4.5em; border: none; - background: #02adb7; + background: #018189; color: white; width: 100%; padding: 0; } #search-button button span { + font-size: 1.1em; position:relative; - top: -.2em; } #nav-line { background-color: #e2e2e2; - height: 3.95em; + height: 4.9em; } -ul#catalogue { +ul#menu { list-style: none; padding: 0; - margin: 0; + margin: 0 0 0 .6em; } -ul#catalogue li { + +li.menu { background-color: #e2e2e2; float: left; } -ul#catalogue a { +a.menu { display: block; - padding-left: 1.5em; - padding-right: 1.5em; + padding-left: 1.4em; + padding-right: 1.4em; /* must match grid-line */ - height: 2.7em; - padding-top: 1.3em; + height: 3.1em; + padding-top: 1.8em; + color: #0c7076; +} +a.menu span { + font-size: 1.1em; } - +#lang-button { + color: #717171; +} #lang-button:after { - content: url(/static/img/lang-arrow.png); - padding-left: .5em; + padding-left: 1em; + content: "↓"; + font-family: WL-Nav; + vertical-align: middle; } #lang-menu { position: relative; float: right; display: block; - padding-left: 1.5em; - padding-right: 1.5em; + padding-left: 2.5em; + padding-right: 2em; /* must match grid-line */ - height: 2.7em; - padding-top: 1.3em; + height: 3em; + padding-top: 1.9em; background: #f7f7f7; } +#lang-menu-items { + z-index: 9999; +} + #lang-menu-items button { display: none; background: #f7f7f7; - color: #444; + color: #6f6f6f; cursor: pointer; width: 100%; border: solid #ddd; @@ -171,5 +230,18 @@ ul#catalogue a { } #lang-menu .active { - font-weight: bold; + color: #000; +} + +.search-hint-label { + display: inline-block; + width: 25em; + font-size: 1.1em; + line-height: 1.636em; +} + +.search-hint-category { + font-size: 1.1em; + line-height: 1.636em; + }