$header_bg: #191919;
$small_logo: .9;
+#ads {
+ display: inline-block;
+ width: 100%;
+
+ > a {
+ display: block;
+ width: 100%;
+ }
+
+ img {
+ display: block;
+ margin: 0 auto;
+ }
+}
header#main {
- @include size(line-height, 20px); /* Make links easier to click when wrapped. */
- background-color: $header_bg;
- color: #bbb;
- position: relative;
+ @include size(line-height, 20px); /* Make links easier to click when wrapped. */
+ background-color: $header_bg;
+ color: #bbb;
+ position: relative;
- Xtext-align:center;
+ Xtext-align: center;
- @media screen and (min-width: 1024px) {
- width: 975px;
- margin:auto;
+ @media screen and (min-width: 1024px) {
+ width: 975px;
+ margin: auto;
- }
+ }
- a {
- color: #17CFDB;
- }
+ a {
+ color: #17CFDB;
+ }
- #logo {
- display: block;
- margin: auto;
+ #logo {
+ display: block;
+ margin: auto;
+ @include size(width, 173px);
+ @include size(height, 94px);
+
+ img {
+ @include size(width, $small_logo * 173px);
+ @include size(height, $small_logo * 94px);
+ margin-top: (1 - $small_logo) * 94px / 2;
+ margin-left: (1 - $small_logo) * 173px / 2;
+
+ @media screen and (min-width: 768px) {
@include size(width, 173px);
@include size(height, 94px);
+ margin-top: 0;
+ margin-left: 0;
+ }
+ }
- img {
- @include size(width, $small_logo * 173px);
- @include size(height, $small_logo * 94px);
- margin-top: (1 - $small_logo) * 94px / 2;
- margin-left: (1 - $small_logo) * 173px / 2;
-
- @media screen and (min-width: 768px) {
- @include size(width, 173px);
- @include size(height, 94px);
- margin-top: 0;
- margin-left: 0;
- }
- }
-
- @media screen and (min-width: 1024px) {
- margin-left: 0;
- }
+ @media screen and (min-width: 1024px) {
+ margin-left: 0;
}
+ }
- #tagline {
- display: none;
- position: absolute;
- @include size(top, 3px);
- @include size(left, 255px);
- @include size(font-size, 13px);
+ #tagline {
+ display: none;
+ position: absolute;
+ @include size(top, 3px);
+ @include size(left, 255px);
+ @include size(font-size, 13px);
- @media screen and (min-width: 1024px) {
- display: block;
- }
+ @media screen and (min-width: 1024px) {
+ display: block;
}
+ }
- #lang-menu {
- display: block;
- position: absolute;
- top: 0;
- right: 0;
+ #lang-menu {
+ display: block;
+ position: absolute;
+ top: 0;
+ right: 0;
- @include mono;
+ @include mono;
+
+ #lang-button {
+ display: block;
- #lang-button {
- display:block;
-
- @include size(font-size, 10px);
- @include size(line-height, 17px);
- @include size(padding-left, 25px);
- @include size(padding-right, 20px);
- @include size(padding-top, 16px);
- @include size(padding-bottom, 16px);
-
- .label {
- &:after {
- @include size(padding-left, 10px);
- content: url("/static/img/arrow-gray.png");
- vertical-align: top;
- }
- }
-
- .lang-flag {
- @include size(font-size, 13px);
- @include size(line-height, 15px);
- }
+ @include size(font-size, 10px);
+ @include size(line-height, 17px);
+ @include size(padding-left, 25px);
+ @include size(padding-right, 20px);
+ @include size(padding-top, 16px);
+ @include size(padding-bottom, 16px);
+
+ .label {
+ &:after {
+ @include size(padding-left, 10px);
+ content: url("/static/img/arrow-gray.png");
+ vertical-align: top;
}
+ }
+ .lang-flag {
+ @include size(font-size, 13px);
+ @include size(line-height, 15px);
+ }
+ }
- #lang-menu-items {
- z-index: 9999;
+ #lang-menu-items {
+ z-index: 9999;
- button {
- @include mono;
- display: none;
- background: #f7f7f7;
- color: #6f6f6f;
- cursor: pointer;
- width: 100%;
- margin: 0;
- @include size(padding, 10px 0);
+ button {
+ @include mono;
+ display: none;
+ background: #f7f7f7;
+ color: #6f6f6f;
+ cursor: pointer;
+ width: 100%;
+ margin: 0;
+ @include size(padding, 10px 0);
- @media screen and (min-width: 62.5em) {
- @include size(padding, 5px 0);
- }
+ @media screen and (min-width: 62.5em) {
+ @include size(padding, 5px 0);
+ }
- border-width: 0;
- @include size(border-bottom, 1px solid #ddd);
+ border-width: 0;
+ @include size(border-bottom, 1px solid #ddd);
- @include size(font-size, 13px);
+ @include size(font-size, 13px);
- &.active {
- color: #000;
- }
- }
+ &.active {
+ color: #000;
}
+ }
+ }
- &:hover, &.hover {
- #lang-menu-items {
- position: absolute;
- padding: 0;
- right: 0;
- width: 100%;
- button {
- display: block;
- }
- }
+ &:hover, &.hover {
+ #lang-menu-items {
+ position: absolute;
+ padding: 0;
+ right: 0;
+ width: 100%;
+ button {
+ display: block;
}
-
+ }
}
+ }
+
+ #main-menu-toggle {
+ position: absolute;
+ left: 0;
+ top: 0;
+ }
+
+ X#user-info {
+ margin-top: 0;
+ @include size(margin-left, 5px);
+ @include size(margin-right, 5px);
+ padding-top: 0;
+ @include mono;
+ @include size(font-size, 10px);
+ position: relative;
- #main-menu-toggle {
- position: absolute;
- left: 0;
- top: 0;
+ @media screen and (min-width: 24em) {
+ @include size(padding-top, 15px);
+ @include size(margin-left, 180px);
+ text-align: right;
+ }
+ @media screen and (min-width: 62.5em) {
+ position: absolute;
+ top: 0;
+ right: 0;
+ @include size(margin-left, 0);
+ @include size(margin-right, 0);
}
-
- X#user-info {
- margin-top: 0;
- @include size(margin-left, 5px);
- @include size(margin-right, 5px);
- padding-top: 0;
- @include mono;
- @include size(font-size, 10px);
+ /* We want submenu on far left on small screens. */
+ .hidden-box-wrapper {
+ position: static;
+ @media screen and (min-width: 24em) {
position: relative;
+ }
+ }
- @media screen and (min-width: 24em) {
- @include size(padding-top, 15px);
- @include size(margin-left, 180px);
- text-align: right;
- }
- @media screen and (min-width: 62.5em) {
- position: absolute;
- top: 0;
- right: 0;
- @include size(margin-left, 0);
- @include size(margin-right, 0);
- }
+ #user-menu {
+ display: none;
- /* We want submenu on far left on small screens. */
- .hidden-box-wrapper {
- position: static;
- @media screen and (min-width: 24em) {
- position: relative;
- }
- }
+ text-align: left;
+ line-height: 1.6em;
+ left: 0;
+ right: 0;
+ top: 2em;
- #user-menu {
- display: none;
+ @media screen and (min-width: 15em) {
+ right: auto;
+ width: 15em;
+ }
- text-align: left;
- line-height:1.6em;
- left: 0;
- right: 0;
- top: 2em;
+ a {
+ color: #0D7E85;
+ }
+ }
+ }
- @media screen and (min-width: 15em) {
- right: auto;
- width: 15em;
- }
+ form#search-area {
+ position: relative;
+ clear: both;
+ @include size(height, 45px);
+ background: #444444;
+ color: white;
- a {
- color: #0D7E85;
- }
- }
+ @media screen and (min-width: 1024px) {
+ position: absolute;
+ @include size(top, 49px);
+ @include size(left, 240px);
+ @include size(right, 0);
}
- form#search-area {
+ #search-field {
+ position: absolute;
+ @include size(top, 5px);
+ @include size(left, 5px);
+ @include size(right, 113px);
+
+ label {
+ @include hidden-label;
+ }
+ input#search {
+ z-index: 200;
position: relative;
- clear: both;
- @include size(height, 45px);
- background: #444444;
- color: white;
-
- @media screen and (min-width: 1024px) {
- position: absolute;
- @include size(top, 49px);
- @include size(left, 240px);
- @include size(right, 0);
- }
+ @include size(height, 33px);
+ width: 100%;
+ padding: 0;
+ @include size(padding-left, 13px);
+ @include size(line-height, 32.5px);
+
+ border: none;
+ @include size(border-radius, 5px);
+ @include box-shadow(0 0 6.5px #444444 inset);
- #search-field {
- position: absolute;
- @include size(top, 5px);
- @include size(left, 5px);
- @include size(right, 113px);
-
- label {
- @include hidden-label;
- }
- input#search {
- z-index: 200;
- position: relative;
- @include size(height, 33px);
- width: 100%;
- padding: 0;
- @include size(padding-left, 13px);
- @include size(line-height, 32.5px);
-
- border: none;
- @include size(border-radius, 5px);
- @include box-shadow(0 0 6.5px #444444 inset);
-
- font-family: Georgia;
- @include size(font-size, 13px);
- background-color: white;
- color: black;
-
- /* styling search placeholder */
- &::placeholder
- {
- font-family: Georgia;
- font-style: italic;
- color: #767676;
- }
- &::-webkit-input-placeholder
- {
- font-family: Georgia;
- font-style: italic;
- color: #767676;
- }
- &::-moz-placeholder
- {
- font-family: Georgia;
- font-style: italic;
- color: #767676;
- }
- }
+ font-family: Georgia;
+ @include size(font-size, 13px);
+ background-color: white;
+ color: black;
+
+ /* styling search placeholder */
+ &::placeholder {
+ font-family: Georgia;
+ font-style: italic;
+ color: #767676;
}
- button {
- display: inline-block;
- position: absolute;
- top: 0;
- right: 0;
- @include size(height, 45px);
- @include size(width, 94px);
- margin: 0;
- padding: 0;
-
- border: none;
-
- @include mono;
- @include size(font-size, 11px);
- background: #018189;
- color: white;
+ &::-webkit-input-placeholder {
+ font-family: Georgia;
+ font-style: italic;
+ color: #767676;
+ }
+ &::-moz-placeholder {
+ font-family: Georgia;
+ font-style: italic;
+ color: #767676;
}
+ }
}
+ button {
+ display: inline-block;
+ position: absolute;
+ top: 0;
+ right: 0;
+ @include size(height, 45px);
+ @include size(width, 94px);
+ margin: 0;
+ padding: 0;
+
+ border: none;
+
+ @include mono;
+ @include size(font-size, 11px);
+ background: #018189;
+ color: white;
+ }
+ }
}
-
-
-
-
@media screen and (min-width: 1024px) {
- #whole-header {
- height: 94px + 49px;
- }
+ #whole-header {
+ height: 94px + 49px;
+ }
- #header-wrapper {
- position: relative;
+ #header-wrapper {
+ position: relative;
- /* Upper-half both sides dark background */
- &:before {
- content: " ";
- display: block;
- z-index: -1;
- position: absolute;
- top: 0;
- @include size(bottom, 45px);
- left: 0;
- width: 100%;
- background-color: $header_bg;
- }
+ /* Upper-half both sides dark background */
+ &:before {
+ content: " ";
+ display: block;
+ z-index: -1;
+ position: absolute;
+ top: 0;
+ @include size(bottom, 45px);
+ left: 0;
+ width: 100%;
+ background-color: $header_bg;
+ }
- /* Left-side dark background */
- &:after {
- content: " ";
- display: block;
- z-index: -1;
- position: absolute;
- top: 0;
- bottom: 0;
- left: 0;
- width: 50%;
- background-color: $header_bg;
- }
+ /* Left-side dark background */
+ &:after {
+ content: " ";
+ display: block;
+ z-index: -1;
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ width: 50%;
+ background-color: $header_bg;
}
+ }
}
<!DOCTYPE html>
{% spaceless %}
-<html lang="{{ LANGUAGE_CODE }}" prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#">
+ <html lang="{{ LANGUAGE_CODE }}" prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#">
{% load pipeline i18n %}
{% load static from staticfiles %}
{% load catalogue_tags funding_tags reporting_stats %}
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
- <meta name="application-name" content="Wolne Lektury" />
- <meta property="og:site_name" content="Wolne Lektury" />
- <meta property="og:title" content="{% block ogtitle %}{% endblock %}" />
- <meta property="og:type" content="{% block ogtype %}website{% endblock %}" />
- <meta property="og:image" content="{% block ogimage %}{{ FULL_STATIC_URL }}img/wiatrak.png{% endblock %}" />
- <meta name="description" content="{% block metadescription %}Darmowe, opracowane, pełne teksty lektur, e-booki, audiobooki i pliki DAISY na wolnej licencji.{% endblock %}" />
+ <meta name="application-name" content="Wolne Lektury"/>
+ <meta property="og:site_name" content="Wolne Lektury"/>
+ <meta property="og:title" content="{% block ogtitle %}{% endblock %}"/>
+ <meta property="og:type" content="{% block ogtype %}website{% endblock %}"/>
+ <meta property="og:image" content="{% block ogimage %}{{ FULL_STATIC_URL }}img/wiatrak.png{% endblock %}"/>
+ <meta name="description"
+ content="{% block metadescription %}Darmowe, opracowane, pełne teksty lektur, e-booki, audiobooki i pliki DAISY na wolnej licencji.{% endblock %}"/>
{% block ogextra %}{% endblock %}
- <title>{% block title %}{% trans "Wolne Lektury" %} :: {% block titleextra %}{% endblock %}{% endblock %}</title>
- <link rel="icon" href="{% static 'img/favicon.png' %}" type="image/png" />
- <link rel="search" type="application/opensearchdescription+xml" title="Wolne Lektury" href="{% static 'opensearch.xml' %}" />
+ <title>
+ {% block title %}{% trans "Wolne Lektury" %} :: {% block titleextra %}{% endblock %}{% endblock %}</title>
+ <link rel="icon" href="{% static 'img/favicon.png' %}" type="image/png"/>
+ <link rel="search" type="application/opensearchdescription+xml" title="Wolne Lektury"
+ href="{% static 'opensearch.xml' %}"/>
{% stylesheet "main" %}
{% block extrahead %}
{% endblock %}
</head>
<body id="{% block bodyid %}base{% endblock %}">
- {% block bodycontent %}
+ {% block bodycontent %}
{% if not funding_no_show_current %}
{% current_offer as current_offer %}
{{ current_offer.if }}
- {% ssi_include 'funding_top_bar' pk=current_offer %}
+ {% ssi_include 'funding_top_bar' pk=current_offer %}
{{ current_offer.endif }}
{% endif %}
+ <div id="ads">
+ <a href="https://nowoczesnapolska.org.pl/pomoz-nam/wesprzyj-nas/">
+ <img src="{% static 'img/ads/960x150_wolneLektury.jpg' %}"
+ alt="Wesprzyj działalność Nowoczesnej Polski"/>
+ </a>
+ </div>
+
<div id="whole-header">
- <div id="header-wrapper">
- <header id="main">
+
<div id="header-wrapper">
+ <header id="main">
- <a href="/" id="logo">
- <img src="{% static 'img/logo-neon.png' %}" alt="Wolne Lektury" />
- </a>
+ <img src="{% static 'img/logo-neon.png' %}" alt="Wolne Lektury"/>
+ </a>
- <p id="tagline">
- {% url 'book_list' as b %}
- {% url 'infopage' 'prawa' as r %}
+ {% url 'book_list' as b %}
+ {% url 'infopage' 'prawa' as r %}
{% count_books book_count %}
- {% blocktrans count book_count as c %}
- <a href='{{b}}'>{{c}}</a> free reading you have <a href='{{r}}'>right to</a>
- {% plural %}
- <a href='{{b}}'>{{c}}</a> free readings you have <a href='{{r}}'>right to</a>
- {% endblocktrans %}
- </p>
-
- <div id="lang-menu" class="hoverget">
+ {% blocktrans count book_count as c %}
+ <a href='{{ b }}'>{{ c }}</a> free reading you have <a href='{{ r }}'>right to</a>
+ {% plural %}
+ <a href='{{ b }}'>{{ c }}</a> free readings you have <a href='{{ r }}'>right to</a>
+ {% endblocktrans %}
+ </p>
+
+
<div id="lang-menu" class="hoverget">
<span id='lang-button' class='hoverclick'>
<span class="lang-flag">⚐</span>
<span class="label"> {% trans "Language" %}</span>
</span>
- <div id="lang-menu-items">
- {% for lang in LANGUAGES %}
- <form action="{% url 'django.views.i18n.set_language' %}" method="post">
- {% ssi_csrf_token %}
- <input type="hidden" name="language" value="{{ lang.0 }}" />
- <button type="submit" lang="{{ lang.0 }}" class="{% ifequal lang.0 LANGUAGE_CODE %}active{% endifequal %}">{{ lang.1 }}</button>
+ <div id="lang-menu-items">
+ {% for lang in LANGUAGES %}
+ <form action="{% url 'django.views.i18n.set_language' %}" method="post">
+ {% ssi_csrf_token %}
+ <input type="hidden" name="language" value="{{ lang.0 }}"/>
+ <button type="submit" lang="{{ lang.0 }}"
+ class="{% ifequal lang.0 LANGUAGE_CODE %}active{% endifequal %}">{{ lang.1 }}</button>
+ </form>
+ {% endfor %}
+ </div>
+ </div>
+
+ <a id="show-menu"></a>
+ <nav id="menu">
+
+ <ul id="user-info">
+ {% user_username as user_username %}
+ {% user_is_staff as user_is_staff %}
+ {{ user_username.if }}
+ <li>
+ <a href="{% url 'user_settings' %}">
+ <strong>{{ user_username }}</strong>
+ </a>
+ </li>
+ <li><a href="{% url 'social_my_shelf' %}" id="user-shelves-link">{% trans "My shelf" %}</a>
+ </li>
+ {{ user_username.endif }}
+ {{ user_is_staff.if }}
+ <li><a href="/admin/">{% trans "Administration" %}</a></li>
+ {{ user_is_staff.endif }}
+ {{ user_username.if }}
+ <li><a href="{% url 'logout' %}?next=
+
+ {% block logout %}{{ request.get_full_path }}{% endblock %}">{% trans "Logout" %}</a>
+ </li>
+ {{ user_username.else }}
+ <li>
+ <a href="{% url 'login' %}?next={{ request.path }}" id="login">{% trans "Sign in" %}</a>
+ / <a href="{% url 'register' %}?next={{ request.path }}"
+ id="register">{% trans "Register" %}</a>
+ </li>
+ {{ user_username.endif }}
+ </ul>
+
+
+ <ul id="main-menu">
+ <li><a href="{% url 'book_list' %}">{% trans "Literature" %}</a></li>
+ <li><a href="{% url 'theme_catalogue' %}">{% trans "Themes" %}</a></li>
+ <li><a href="{% url 'audiobook_list' %}">{% trans "Audiobooks" %}</a></li>
+ <li><a href="{% url 'gallery' %}">{% trans "Gallery" %}</a></li>
+ <li><a href="{% url 'catalogue' %}">Wszystkie utwory</a></li>
+ </ul>
+
+
+ </nav>
+
+ <form id="search-area" action="{% url 'search' %}">
+ <div id="search-field">
+ <label for="search">{{ search_form.q.label }}</label>
+ {{ search_form.q }}
+ </div>
+ <button type='submit'>{% trans "Search" %}</button>
</form>
- {% endfor %}
- </div>
- </div>
- <a id="show-menu"></a>
- <nav id="menu">
-
- <ul id="user-info">
- {% user_username as user_username %}
- {% user_is_staff as user_is_staff %}
- {{ user_username.if }}<li>
- <a href="{% url 'user_settings' %}">
- <strong>{{ user_username }}</strong>
- </a>
- </li>
- <li><a href="{% url 'social_my_shelf' %}" id="user-shelves-link">{% trans "My shelf" %}</a>
- </li>
- {{ user_username.endif }}
- {{ user_is_staff.if }}<li><a href="/admin/">{% trans "Administration" %}</a></li>
- {{ user_is_staff.endif }}
- {{ user_username.if }}<li><a href="{% url 'logout' %}?next={% block logout %}{{ request.get_full_path }}{% endblock %}">{% trans "Logout" %}</a></li>
- {{ user_username.else }}
- <li>
- <a href="{% url 'login' %}?next={{ request.path }}" id="login">{% trans "Sign in" %}</a> / <a href="{% url 'register' %}?next={{ request.path }}" id="register">{% trans "Register" %}</a>
- </li>
- {{ user_username.endif }}
- </ul>
-
-
- <ul id="main-menu">
- <li><a href="{% url 'book_list' %}">{% trans "Literature" %}</a></li>
- <li><a href="{% url 'theme_catalogue' %}">{% trans "Themes" %}</a></li>
- <li><a href="{% url 'audiobook_list' %}">{% trans "Audiobooks" %}</a></li>
- <li><a href="{% url 'gallery' %}">{% trans "Gallery" %}</a></li>
- <li><a href="{% url 'catalogue' %}">Wszystkie utwory</a></li>
- </ul>
-
-
- </nav>
-
- <form id="search-area" action="{% url 'search' %}">
- <div id="search-field">
- <label for="search">{{search_form.q.label}}</label>
- {{search_form.q}}
- </div><button type='submit'>{% trans "Search" %}</button>
- </form>
-
- </header>
- </div>
+ </header>
+ </div>
</div>
<div id="footer-wrapper">
- <footer id="main">
- {% ssi_include 'chunk' key='footer' %}
- {% block add_footer %}{% endblock %}
- {% ssi_include 'sponsor_page' name='footer' %}
- </footer>
+ <footer id="main">
+ {% ssi_include 'chunk' key='footer' %}
+ {% block add_footer %}{% endblock %}
+ {% ssi_include 'sponsor_page' name='footer' %}
+ </footer>
</div>
</div>
- {% endblock bodycontent %}
+ {% endblock bodycontent %}
- <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
- <script type="text/javascript">var LANGUAGE_CODE="{{ LANGUAGE_CODE }}"; var STATIC_URL="{{ STATIC_URL }}";</script>
- {% javascript "base" %}
+ <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
+ <script type="text/javascript">var LANGUAGE_CODE = "{{ LANGUAGE_CODE }}";
+ var STATIC_URL = "{{ STATIC_URL }}";</script>
+ {% javascript "base" %}
- {% tracking_code %}
+ {% tracking_code %}
- {% block extrabody %}
- {% endblock %}
+ {% block extrabody %}
+ {% endblock %}
- <script src="{% static "js/contrib/modernizr.custom.19652.js" %}"></script>
+ <script src="{% static "js/contrib/modernizr.custom.19652.js" %}"></script>
</body>
-</html>
+ </html>
{% endspaceless %}
fnp / wolnelektury.git / commitdiff
