Blog layout and functions
This commit is contained in:
parent
ac148affd4
commit
6028df66dc
11 changed files with 716 additions and 92 deletions
|
|
@ -3,9 +3,6 @@
|
|||
|
||||
{% block body_class %}template-{{ self.get_verbose_name|slugify }}{% endblock %}
|
||||
|
||||
{% block extra_css %}
|
||||
{% endblock %}
|
||||
|
||||
{% block title %}Feeds{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
|
|
|||
|
|
@ -1,12 +1,14 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static wagtailcore_tags %}
|
||||
{% load static compress wagtailcore_tags %}
|
||||
|
||||
{% block body_class %}template-{{ self.get_verbose_name|slugify }}{% endblock %}
|
||||
|
||||
{% block extra_css %}
|
||||
{% compress css %}
|
||||
<link rel="stylesheet" type="text/x-scss" href="{% static 'libs/slick-carousel/slick/slick.scss' %}">
|
||||
<link rel="stylesheet" type="text/x-scss" href="{% static 'libs/slick-carousel/slick/slick-theme.scss' %}">
|
||||
<link rel="stylesheet" type="text/x-scss" href="{% static 'libs/slick-lightbox/src/styles/slick-lightbox.sass' %}">
|
||||
{% endcompress %}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,13 @@
|
|||
{% extends "base.html" %}
|
||||
{% load static wagtailcore_tags %}
|
||||
{% load static compress wagtailcore_tags %}
|
||||
|
||||
{% block body_class %}template-{{ self.get_verbose_name|slugify }}{% endblock %}
|
||||
|
||||
{% block extra_css %}
|
||||
{% compress css %}
|
||||
<link rel="stylesheet" type="text/x-scss" href="{% static 'libs/slick-carousel/slick/slick.scss' %}">
|
||||
<link rel="stylesheet" type="text/x-scss" href="{% static 'libs/slick-carousel/slick/slick-theme.scss' %}">
|
||||
{% endcompress %}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
|
|
|||
|
|
@ -16,8 +16,11 @@
|
|||
content="{% block meta_description %}
|
||||
{{ blog_page.search_description }}
|
||||
{% endblock meta_description %}"/>
|
||||
|
||||
{% block social_share %}{% endblock social_share %}
|
||||
<link rel="canonical" href="{% block canonical %}{% canonical_url %}{% endblock canonical %}"/>
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="{% feeds_url blog_page %}">
|
||||
|
||||
<style>
|
||||
body {
|
||||
--main-color: {{blog_page.main_color}};
|
||||
|
|
@ -29,86 +32,69 @@
|
|||
.blog-page section { background-color: transparent !important; }
|
||||
.container .page-content, .blog_grid { background: white; }
|
||||
</style>
|
||||
<link rel="stylesheet" href="{% static 'puput/css/puput.css' %}"/>
|
||||
|
||||
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
|
||||
{% endblock %}
|
||||
|
||||
{% block extra_js %}
|
||||
<script src="{% static 'puput/js/puput.js' %}"></script>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
{% if blog_page.header_image %}
|
||||
<span class="image featured">
|
||||
{% image blog_page.header_image fill-1500x360 as header_image %}
|
||||
<img alt="{{ blog_page.header_image.title }}" src="{{ header_image.url }}" width="100%">
|
||||
</span>
|
||||
{% endif %}
|
||||
|
||||
<div class="content-page blog-header">
|
||||
{% if blog_page.header_image %}
|
||||
<span class="image featured">
|
||||
{% image blog_page.header_image fill-1500x120 as header_image %}
|
||||
<img alt="{{ blog_page.header_image.title }}" src="{{ header_image.url }}">
|
||||
</span>
|
||||
{% endif %}
|
||||
<div class="container">
|
||||
<section class="{% if blog_page.header_image %}title-section-image{% else %}title-section{% endif %}">
|
||||
<h1 class="title-header">
|
||||
<a href="{% pageurl blog_page %}">{{ blog_page.title }}</a>
|
||||
</h1>
|
||||
{% if not blog_page.header_image %}
|
||||
<h2>{{ blog_page.description }}</h2>
|
||||
{% endif %}
|
||||
</section>
|
||||
<div class="container">
|
||||
<h2>
|
||||
<a href="{% pageurl blog_page %}">{{ blog_page.title }}</a>
|
||||
</h2>
|
||||
<p class="lead">{{ blog_page.description }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="content-page blog-page">
|
||||
<div class="container container-blog">
|
||||
<div class="row">
|
||||
<div class="col-sm-8 col-md-9">
|
||||
{% block blog_content %}{% endblock blog_content %}
|
||||
{% block extra_content %}{% endblock extra_content %}
|
||||
</div>
|
||||
|
||||
<div class="col-sm-4 col-md-3">
|
||||
<div class="blog_sidebar">
|
||||
<div class="rss-sitemap">
|
||||
<a href="{% feeds_url blog_page %}" target="_blank" title="RSS">
|
||||
<i class="fa fa-rss-square"></i> <span>{% trans 'Feed RSS' %}</span>
|
||||
</a>
|
||||
</div>
|
||||
<form name="search_form" class="search_form" method="get" action="{% routablepageurl blog_page 'entries_search' %}">
|
||||
<div class="input-group">
|
||||
<input type="search" name="q" placeholder="{% trans 'Search' %}">
|
||||
<span class="input-group-btn">
|
||||
<button class="btn btn-default" type="submit"><i class="fa fa-search"></i></button>
|
||||
</span>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
{% if blog_page.display_last_entries %}
|
||||
<ul class="sidebar">
|
||||
<h4>{% trans 'Last Entries' %}</h4>
|
||||
{% recent_entries blog_page.num_last_entries %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if blog_page.display_popular_entries %}
|
||||
<ul class="sidebar">
|
||||
<h4>{% trans 'Popular Entries' %}</h4>
|
||||
{% popular_entries blog_page.num_popular_entries %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if blog_page.display_categories %}
|
||||
<ul class="sidebar">
|
||||
<h4>{% trans 'Categories' %}</h4>
|
||||
{% categories_list %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if blog_page.display_tags %}
|
||||
<ul class="sidebar">
|
||||
<h4>{% trans 'Tags' %}</h4>
|
||||
{% tags_list %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if blog_page.display_archive %}
|
||||
<ul class="sidebar widget menu">
|
||||
<h4>{% trans 'Archive' %}</h4>
|
||||
{% archives_list %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% block blog_content %}{% endblock blog_content %}
|
||||
{% block extra_content %}{% endblock extra_content %}
|
||||
</div>
|
||||
<div class="row">
|
||||
{% if blog_page.display_last_entries %}
|
||||
<ul class="col-sm-4 col-md-3 sidebar">
|
||||
<h4>{% trans 'Last Entries' %}</h4>
|
||||
{% recent_entries blog_page.num_last_entries %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if blog_page.display_popular_entries %}
|
||||
<ul class="col-sm-4 col-md-3 sidebar">
|
||||
<h4>{% trans 'Popular Entries' %}</h4>
|
||||
{% popular_entries blog_page.num_popular_entries %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if blog_page.display_categories %}
|
||||
<ul class="col-sm-4 col-md-3 sidebar">
|
||||
<h4>{% trans 'Categories' %}</h4>
|
||||
{% categories_list %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if blog_page.display_tags %}
|
||||
<ul class="col-sm-4 col-md-3 sidebar blog-tags">
|
||||
<h4>{% trans 'Tags' %}</h4>
|
||||
{% tags_list %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if blog_page.display_archive %}
|
||||
<ul class="col-sm-4 col-md-3 sidebar widget menu">
|
||||
<h4>{% trans 'Archive' %}</h4>
|
||||
{% archives_list %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -52,7 +52,6 @@
|
|||
{% for entry in entries %}
|
||||
{% entry_url entry blog_page as post_url %}
|
||||
<article class="box page-content blog_grid">
|
||||
{% include 'puput/entry_page_header.html' %}
|
||||
<section>
|
||||
{% if entry.header_image %}
|
||||
<span class="img-responsive">
|
||||
|
|
|
|||
|
|
@ -42,18 +42,18 @@
|
|||
{% endblock social_share %}
|
||||
|
||||
{% block blog_content %}
|
||||
|
||||
{% if self.header_image %}
|
||||
<div class="image">
|
||||
{% image self.header_image fill-940x400 class="img-responsive" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<h1 class="title">{{ self.title }}</h1>
|
||||
|
||||
<article class="box page-content"
|
||||
{% if self.id %}data-entry-page-update-comments-url="{% url 'entry_page_update_comments' self.id %}{% endif %}">
|
||||
{% include 'puput/entry_page_header.html' with entry=self %}
|
||||
{% if self.header_image %}
|
||||
<section>
|
||||
<span class="image featured">
|
||||
{% image self.header_image fill-800x450 as header_image %}
|
||||
<img alt="{{ self.header_image.title }}" src="{{ header_image.url }}">
|
||||
</span>
|
||||
{% include 'puput/entry_links.html' with entry=self %}
|
||||
</section>
|
||||
{% endif %}
|
||||
{% include 'puput/entry_links.html' with entry=self %}
|
||||
<section>
|
||||
{{ self.body|richtext}}
|
||||
<div class="row">
|
||||
|
|
|
|||
|
|
@ -1,6 +0,0 @@
|
|||
{% load puput_tags %}
|
||||
<header>
|
||||
<h2 class="post_title">
|
||||
<a href="{% entry_url entry blog_page %}">{{ entry.title }}</a>
|
||||
</h2>
|
||||
</header>
|
||||
|
|
@ -55,4 +55,15 @@ $slider-nav: 200px;
|
|||
// Language menu hack, until this is configurable
|
||||
nav .language-nav a[lang='en'] { display: none; }
|
||||
|
||||
// Disable meta infos in blog sidepanels
|
||||
.blog-header a { color: white !important;
|
||||
text-shadow: 1px 1px 2px black; }
|
||||
.blog-page .sidebar .meta { display: none; }
|
||||
.blog-page section { padding: 0; }
|
||||
.blog-page .blog-tags ul { padding: 0; }
|
||||
.blog-page .social-item {
|
||||
font-size: 70%; background: #2643A9 !important;
|
||||
}
|
||||
.blog-page ul.sidebar { min-height: 12em; }
|
||||
|
||||
@import "subsites";
|
||||
|
|
|
|||
632
publichealth/static/css/modules/_blog.scss
Normal file
632
publichealth/static/css/modules/_blog.scss
Normal file
|
|
@ -0,0 +1,632 @@
|
|||
.blog-page {
|
||||
|
||||
.transform {
|
||||
transform: rotate(7deg);
|
||||
-ms-transform: rotate(7deg);
|
||||
/* IE 9 */
|
||||
-moz-transform: rotate(7deg);
|
||||
/* Firefox */
|
||||
-webkit-transform: rotate(7deg);
|
||||
/* Safari and Chrome */
|
||||
-o-transform: rotate(7deg);
|
||||
/* Opera */
|
||||
}
|
||||
|
||||
ul.links {
|
||||
margin: 0px 0 25px 0;
|
||||
border-bottom: 0;
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
ul.links li {
|
||||
font-size: 12px;
|
||||
margin-right: 13px;
|
||||
font-weight: 300;
|
||||
color: #666666;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
ul.links li i {
|
||||
color: var(--main-color);
|
||||
}
|
||||
|
||||
ul.links li a {
|
||||
color: #666666;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
ul.links li ul {
|
||||
display: inline;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
ul.sidebar {
|
||||
border-top: 2px solid var(--main-color);
|
||||
background-color: #ededed;
|
||||
padding: 20px;
|
||||
margin-bottom: 50px;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
ul.sidebar h4 {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
ul.sidebar li {
|
||||
margin: 0 4px 10px 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
ul.sidebar li.tag {
|
||||
display: inline-block;
|
||||
background-color: var(--main-color);
|
||||
padding: 3px 10px;
|
||||
}
|
||||
|
||||
ul.sidebar li.tag a {
|
||||
color: #FFF;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
ul.sidebar li a {
|
||||
font-size: 14px;
|
||||
font-weight: 300;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
ul.sidebar ul li i {
|
||||
color: var(--main-color);
|
||||
}
|
||||
|
||||
ul.sidebar li > ul{
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
ul.sidebar ul li > ul li {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
|
||||
.blog_btn {
|
||||
border-radius: 0;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.blog_btn.continue,
|
||||
.blog_btn.back {
|
||||
display: block;
|
||||
text-align: right;
|
||||
background-color: transparent;
|
||||
color: var(--main-color);
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.blog_btn.back {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.blog_btn.continue:hover,
|
||||
.blog_btn.continue:focus,
|
||||
.blog_btn.back:hover,
|
||||
.blog_btn.back:focus {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.blog_btn.continue:active,
|
||||
.blog_btn.back:active {
|
||||
outline: inherit;
|
||||
}
|
||||
|
||||
span img {
|
||||
width: 100%;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.page-content h2.post_title {
|
||||
text-transform: uppercase;
|
||||
font-size: 22px;
|
||||
}
|
||||
.page-content h2.post_title a:before {
|
||||
font-family: FontAwesome;
|
||||
content: '\f02e';
|
||||
color: var(--main-color);
|
||||
font-size: 17px;
|
||||
margin-right: 9px;
|
||||
}
|
||||
.page-content h2.post_title a:hover {
|
||||
text-decoration: none;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.page-content .social-share-all {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
.page-content .social-share-all li.social-item {
|
||||
display: inline-block;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
background: #ededed;
|
||||
margin-right: 3px;
|
||||
margin-top: 5px;
|
||||
-webkit-border-radius: 50%;
|
||||
-moz-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.page-content .social-share-all li.social-item i {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
margin-top: 6px;
|
||||
}
|
||||
.page-content .social-share-all li.social-item:hover {
|
||||
background-color: #333;
|
||||
}
|
||||
.page-content .social-share-all:before {
|
||||
background: #ededed;
|
||||
display: block;
|
||||
height: 1px;
|
||||
width: 78%;
|
||||
position: absolute;
|
||||
top: 19px;
|
||||
left: 7px;
|
||||
content: "";
|
||||
text-indent: -9999em;
|
||||
}
|
||||
|
||||
|
||||
.responsive-object{
|
||||
padding-bottom: 10px !important;
|
||||
}
|
||||
|
||||
.about {
|
||||
background: var(--main-color) none repeat scroll 0 0;
|
||||
margin-bottom: 4em;
|
||||
}
|
||||
|
||||
.about .title-section {
|
||||
padding: 30px 0 20px;
|
||||
}
|
||||
|
||||
.about .title-section-image {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.about .title-section h1 {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
|
||||
.about .title-section-image h1 {
|
||||
margin-top: 0;
|
||||
font-weight: 400;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.about .title-section h2 {
|
||||
color: #ededed;
|
||||
}
|
||||
|
||||
.about .title-header a {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.about .title-header a:hover,
|
||||
.about .title-header a:focus {
|
||||
color: #FFF;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.blog_sidebar {
|
||||
padding: 5px 20px 0 45px;
|
||||
}
|
||||
|
||||
.blog_sidebar ul > ul {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.blog_sidebar form.search_form {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.blog_sidebar form.search_form input[type="search"] {
|
||||
width: 100%;
|
||||
border: 1px solid #f0f0f0;
|
||||
padding: 6px 10px;
|
||||
}
|
||||
|
||||
.blog_sidebar .input-group-btn {
|
||||
background: var(--main-color);
|
||||
-webkit-border-radius: 0 5px 5px 0;
|
||||
-moz-border-radius: 0 5px 5px 0;
|
||||
border-radius: 0 5px 5px 0;
|
||||
}
|
||||
|
||||
.blog_sidebar .input-group-btn .btn.btn-default {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.blog_sidebar .input-group-btn .btn.btn-default i {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.blog_sidebar .rss-sitemap {
|
||||
margin-bottom: 15px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.blog_sidebar .rss-sitemap a {
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.blog_sidebar .rss-sitemap i {
|
||||
color: var(--main-color);
|
||||
}
|
||||
|
||||
.blog_sidebar .rss-sitemap span {
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.post-summary {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.post-summary ul {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.post-summary ul li {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.relatedPosts {
|
||||
margin: 50px 0 100px 0;
|
||||
}
|
||||
|
||||
.relatedPosts img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
/*RIGHT SIDE*/
|
||||
.lateralPosts h4 {
|
||||
font-weight: 300;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.lateralPosts .boxCircle {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
-webkit-border-radius: 50%;
|
||||
-moz-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.lateralPosts li {
|
||||
font-size: 0.7em;
|
||||
display: inline-block;
|
||||
color: var(--main-color);
|
||||
}
|
||||
|
||||
.searchTerm {
|
||||
margin: 10px 0 30px 0;
|
||||
padding: 20px;
|
||||
background-color: #ededed;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.page-content,
|
||||
.blog_grid {
|
||||
position: relative;
|
||||
border-bottom: 0;
|
||||
padding: 10px 20px 20px 20px;
|
||||
background: #f8f8f8;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.blog_grid p {
|
||||
color: #666666;
|
||||
font-size: 1em;
|
||||
line-height: 1.5em;
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
.blog_grid h2 {
|
||||
text-align: center;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.blog_grid h2 a:after {
|
||||
content: '';
|
||||
width: 25px;
|
||||
height: 4px;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
background-color: var(--main-color);
|
||||
margin-top: 7px;
|
||||
}
|
||||
|
||||
.blog_grid .article .social-share li {
|
||||
float: left;
|
||||
}
|
||||
.blog_grid .article .social-share li.social-item {
|
||||
display: inline-block;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
background: #ededed;
|
||||
margin-top: 5px;
|
||||
margin-right: 3px;
|
||||
-webkit-border-radius: 50%;
|
||||
-moz-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.blog_grid .article .social-share li.social-item i {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
margin-top: 6px;
|
||||
}
|
||||
.blog_grid .article .social-share li.social-item:hover {
|
||||
background-color: #333;
|
||||
}
|
||||
.blog_grid .article .social-share:after {
|
||||
background: #ededed;
|
||||
display: block;
|
||||
height: 1px;
|
||||
width: 78%;
|
||||
position: absolute;
|
||||
top: 19px;
|
||||
right: 0;
|
||||
content: "";
|
||||
text-indent: -9999em;
|
||||
}
|
||||
|
||||
.rich-text {
|
||||
margin-bottom: 5%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.rich-text h3 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.itemPosts {
|
||||
margin-top: 10px;
|
||||
padding-top: 15px;
|
||||
border-top: 1px dotted var(--main-color);
|
||||
}
|
||||
|
||||
.itemPosts h3 {
|
||||
font-size: 16px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.itemPosts p {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.itemPosts .box.feature a {
|
||||
color: var(--main-color);
|
||||
}
|
||||
|
||||
.pagination {
|
||||
width: 100%;
|
||||
margin: 30px 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pagination .endless_separator {
|
||||
background: transparent;
|
||||
color: var(--main-color);
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.pagination span.endless_page_current,
|
||||
.pagination .endless_page_link {
|
||||
padding: 7px 11px;
|
||||
color: var(--main-color);
|
||||
}
|
||||
|
||||
.pagination .endless_page_current:active,
|
||||
.pagination .endless_page_link:active {
|
||||
background: var(--main-color);
|
||||
}
|
||||
|
||||
.pagination span {
|
||||
background: var(--main-color);
|
||||
}
|
||||
|
||||
.pagination span strong {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.footer_bottom {
|
||||
background-color: var(--main-color);
|
||||
padding: 20px 40px;
|
||||
}
|
||||
|
||||
.footer_bottom .copy p {
|
||||
text-align: center;
|
||||
color: #d1d1d1;
|
||||
}
|
||||
|
||||
.footer_bottom .copy p a {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
/* Menu */
|
||||
.menu li {
|
||||
margin: 0 0 3px;
|
||||
}
|
||||
|
||||
.menu ul {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.menu li a {
|
||||
background-color: #f2f2f2;
|
||||
background-color: rgba(0, 0, 0, .05);
|
||||
color: #1e1e1e;
|
||||
display: block;
|
||||
padding: 9px 9px 9px 60px;
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
-webkit-transition: all .2s linear;
|
||||
transition: all .2s linear;
|
||||
}
|
||||
|
||||
.menu li a:before {
|
||||
background: #e1e1e1;
|
||||
background: rgba(255, 255, 255, .4);
|
||||
bottom: 0;
|
||||
content: "";
|
||||
display: block;
|
||||
left: 45px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.menu li a:hover {
|
||||
background-color: #e9e9e9;
|
||||
background-color: rgba(0, 0, 0, .1);
|
||||
-webkit-transition: all .2s linear;
|
||||
transition: all .2s linear;
|
||||
}
|
||||
|
||||
.menu li.active > a {
|
||||
background-color: var(--main-color);
|
||||
color: #fff;
|
||||
-webkit-transition: all .2s linear;
|
||||
transition: all .2s linear;
|
||||
}
|
||||
|
||||
.menu li.active > a:before {
|
||||
background: #444;
|
||||
background: rgba(255, 255, 255, .2);
|
||||
}
|
||||
|
||||
.menu li.parent > a .open-sub {
|
||||
bottom: 0;
|
||||
display: block;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 45px;
|
||||
}
|
||||
|
||||
.menu li.parent > a .open-sub:before,
|
||||
.menu li.parent > a .open-sub:after {
|
||||
background: var(--main-color);
|
||||
content: "";
|
||||
display: block;
|
||||
height: 2px;
|
||||
left: 0;
|
||||
margin: 19px 0 0 15px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.menu li.parent > a .open-sub:after {
|
||||
height: 16px;
|
||||
margin: 12px 0 0 22px;
|
||||
width: 2px;
|
||||
}
|
||||
|
||||
.menu li.parent.active > a .open-sub:before,
|
||||
.menu li.parent.active > a .open-sub:after {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.menu li.parent.active > a .open-sub:after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.menu .sub {
|
||||
background-color: #f2f2f2;
|
||||
background-color: rgba(0, 0, 0, .05);
|
||||
padding: 7px 0 4px 5px;
|
||||
}
|
||||
|
||||
.menu .sub li {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.menu .sub a {
|
||||
background: none;
|
||||
color: #7f7f7f;
|
||||
margin: 0;
|
||||
padding: 4px 9px 4px 60px;
|
||||
}
|
||||
|
||||
.menu .sub a:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.menu .sub a:hover {
|
||||
background-color: #e9e9e9;
|
||||
background-color: rgba(0, 0, 0, .05);
|
||||
}
|
||||
|
||||
.menu .sub .active > a {
|
||||
background: none;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.menu .sub .sub {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.menu .sub li.parent > a .open-sub {
|
||||
left: 10px;
|
||||
}
|
||||
|
||||
.menu .sub li.parent > a .open-sub:before,
|
||||
.menu .sub li.parent > a .open-sub:after {
|
||||
background: #7f7f7f;
|
||||
margin: 14px 0 0 22px;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.menu .sub li.parent > a .open-sub:after {
|
||||
height: 12px;
|
||||
margin: 9px 0 0 27px;
|
||||
width: 2px;
|
||||
}
|
||||
|
||||
.menu .sub li {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.menu li > a .item-icon {
|
||||
left: 15px;
|
||||
position: absolute;
|
||||
top: 13px;
|
||||
}
|
||||
|
||||
.menu li:not(.active) > a .item-icon {
|
||||
opacity: .5;
|
||||
filter: alpha(opacity=50);
|
||||
}
|
||||
|
||||
} // - blog-page
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.blog_sidebar {
|
||||
padding: 5px 5px 0 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.blog_sidebar {
|
||||
padding: 5px 10px 0 10px;
|
||||
}
|
||||
}
|
||||
|
|
@ -5,3 +5,4 @@
|
|||
@import "news";
|
||||
@import "forms";
|
||||
@import "articles";
|
||||
@import "blog";
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="{% block description %}{% endblock %}">
|
||||
|
||||
{% block extra_css %}{% endblock %}
|
||||
{% compress css %}
|
||||
{% block extra_css %}{% endblock %}
|
||||
<link rel="stylesheet" type="text/x-scss" href="{% static 'css/main.scss' %}">
|
||||
{% endcompress %}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue