Blog webpages cleanup
This commit is contained in:
parent
faf45e4811
commit
eeb7da7c05
10 changed files with 100 additions and 202 deletions
|
|
@ -380,7 +380,7 @@ h3,
|
|||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-weight: 300;
|
||||
font-weight: 400 !important;
|
||||
}
|
||||
.navbar-brand {
|
||||
max-width: none;
|
||||
|
|
@ -583,7 +583,7 @@ fieldset {
|
|||
}
|
||||
.web-list-item {
|
||||
padding: 15px 0px;
|
||||
border-top: 1px solid #EBEFF2;
|
||||
border-bottom: 1px solid #EBEFF2;
|
||||
}
|
||||
.web-list-item h1,
|
||||
.web-list-item h2,
|
||||
|
|
@ -599,26 +599,16 @@ fieldset {
|
|||
color: inherit !important;
|
||||
text-decoration: none;
|
||||
}
|
||||
.web-list-item:last-child {
|
||||
border-bottom: 1px solid #EBEFF2;
|
||||
}
|
||||
.blog-info {
|
||||
text-align: center;
|
||||
margin-top: 30px;
|
||||
}
|
||||
.blog-text,
|
||||
.post-description {
|
||||
padding-top: 40px;
|
||||
padding-bottom: 40px;
|
||||
font-size: 16px;
|
||||
line-height: 28px;
|
||||
padding-top: 8px;
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
.blog-text p,
|
||||
.post-description p {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.blogger-name {
|
||||
font-size: 24px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.blog-footer {
|
||||
padding: 5px 15px;
|
||||
|
|
@ -634,20 +624,18 @@ fieldset {
|
|||
.blog-category {
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
font-size: 10px;
|
||||
text-align: center;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.author {
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
font-size: 10px;
|
||||
border-bottom: 1px solid #EBEFF2;
|
||||
padding-bottom: 20px;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
.blogger {
|
||||
padding-top: 30px;
|
||||
padding-bottom: 15px;
|
||||
padding-top: 0px;
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
.blog-dot:before {
|
||||
padding-right: 8px;
|
||||
|
|
@ -655,56 +643,15 @@ fieldset {
|
|||
content: "\2022";
|
||||
}
|
||||
.blog-list-item {
|
||||
margin-top: 25px;
|
||||
margin-bottom: 25px;
|
||||
border: none;
|
||||
margin-top: 30px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.post-by {
|
||||
padding-bottom: 50px;
|
||||
font-size: 10px;
|
||||
letter-spacing: 0.5px;
|
||||
border-bottom: 1px solid #EBEFF2;
|
||||
.blog-list-item .blog-header {
|
||||
font-size: 1.6em;
|
||||
}
|
||||
.blog-list-item .blog-text,
|
||||
.blog-list-item .read-more-btn,
|
||||
.blog-list-item .recent-post {
|
||||
display: none;
|
||||
}
|
||||
.blog-list-item .post-by {
|
||||
padding-bottom: 25px;
|
||||
}
|
||||
.blog-list-item .post-description {
|
||||
padding-top: 25px;
|
||||
}
|
||||
.blog-list-item:first-child .row .blog-header {
|
||||
font-size: 34px;
|
||||
}
|
||||
.blog-list-item:first-child .row .post-by {
|
||||
font-weight: 500;
|
||||
}
|
||||
.blog-list-item:first-child .row .post-description {
|
||||
font-weight: 500;
|
||||
}
|
||||
.blog-list-item:first-child .row .blog-text {
|
||||
display: block;
|
||||
padding-top: 0px;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
.blog-list-item:first-child .row .read-more-btn {
|
||||
display: inline;
|
||||
padding-top: 0px;
|
||||
border-bottom: 1px dotted #d1d8dd;
|
||||
font-size: 12px;
|
||||
}
|
||||
.blog-list-item:first-child .row .post-description {
|
||||
padding-bottom: 25px;
|
||||
}
|
||||
.blog-list-item:first-child .row .recent-post {
|
||||
display: block;
|
||||
padding-top: 50px;
|
||||
padding-bottom: 20px;
|
||||
margin-bottom: 20px;
|
||||
border-bottom: 1px solid #EBEFF2;
|
||||
.blog-header {
|
||||
font-weight: 700;
|
||||
font-size: 2em;
|
||||
}
|
||||
.blog-comments,
|
||||
.help-article-comments {
|
||||
|
|
@ -963,11 +910,14 @@ body {
|
|||
font-size: 12px;
|
||||
}
|
||||
.sidebar-block,
|
||||
.content-block {
|
||||
.page-content {
|
||||
padding-top: 50px;
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
.content-block {
|
||||
.your-account-info {
|
||||
margin-top: 50px;
|
||||
}
|
||||
.page-content {
|
||||
padding-left: 50px;
|
||||
padding-right: 50px;
|
||||
}
|
||||
|
|
@ -994,12 +944,14 @@ li .social-child-item {
|
|||
padding-top: 50px;
|
||||
padding-bottom: 50px;
|
||||
font-size: 18px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
.blog-text p {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.blogger-name {
|
||||
font-size: 24px;
|
||||
margin-bottom: 0px;
|
||||
margin-top: 0px;
|
||||
}
|
||||
.comment-header {
|
||||
font-size: 20px;
|
||||
|
|
@ -1046,3 +998,12 @@ li .social-child-item {
|
|||
.dropdown .logged-in {
|
||||
border-left: 1px solid #d1d8dd;
|
||||
}
|
||||
.cart-count-badge {
|
||||
padding: 2px 4px;
|
||||
margin-left: 10px;
|
||||
background-color: #EBEFF2;
|
||||
border-radius: 10px;
|
||||
font-weight: 500;
|
||||
margin-top: -10px;
|
||||
margin-right: -8px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ a& {
|
|||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-weight: 300;
|
||||
font-weight: 400 !important;
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -201,7 +201,6 @@ fieldset {
|
|||
}
|
||||
|
||||
.page-content {
|
||||
|
||||
hr {
|
||||
margin-left: -15px;
|
||||
margin-right: -15px;
|
||||
|
|
@ -271,7 +270,7 @@ fieldset {
|
|||
|
||||
.web-list-item {
|
||||
padding: 15px 0px;
|
||||
border-top: 1px solid @light-border-color;
|
||||
border-bottom: 1px solid @light-border-color;
|
||||
|
||||
h1, h2, h3 {
|
||||
margin-top: 10px;
|
||||
|
|
@ -289,28 +288,19 @@ fieldset {
|
|||
// background: @panel-bg;
|
||||
// }
|
||||
|
||||
.web-list-item:last-child {
|
||||
border-bottom: 1px solid @light-border-color;
|
||||
}
|
||||
|
||||
.blog-info {
|
||||
text-align:center;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.blog-text, .post-description {
|
||||
padding-top: 40px;
|
||||
padding-bottom: 40px;
|
||||
font-size: 16px;
|
||||
line-height: 28px;
|
||||
.post-description {
|
||||
padding-top: 8px;
|
||||
padding-bottom: 8px;
|
||||
p {
|
||||
margin-bottom: 40px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.blogger-name {
|
||||
font-size:24px;
|
||||
}
|
||||
|
||||
.blog-footer {
|
||||
padding: 5px 15px;
|
||||
|
|
@ -329,7 +319,6 @@ fieldset {
|
|||
.blog-category {
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
font-size: 10px;
|
||||
text-align: center;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
|
@ -337,14 +326,13 @@ fieldset {
|
|||
.author {
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
font-size: 10px;
|
||||
border-bottom: 1px solid @light-border-color;
|
||||
padding-bottom:20px;
|
||||
padding-bottom:30px;
|
||||
}
|
||||
|
||||
.blogger {
|
||||
padding-top: 30px;
|
||||
padding-bottom: 15px;
|
||||
padding-top: 0px;
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
.blog-dot:before{
|
||||
|
|
@ -354,63 +342,19 @@ fieldset {
|
|||
}
|
||||
|
||||
.blog-list-item {
|
||||
margin-top:25px;
|
||||
margin-bottom:25px;
|
||||
border:none;
|
||||
}
|
||||
|
||||
.post-by {
|
||||
padding-bottom: 50px;
|
||||
font-size: 10px;
|
||||
letter-spacing: 0.5px;
|
||||
border-bottom: 1px solid @light-border-color;
|
||||
}
|
||||
|
||||
.blog-list-item {
|
||||
.blog-text,.read-more-btn,.recent-post {
|
||||
display: none;
|
||||
}
|
||||
.post-by {
|
||||
padding-bottom: 25px;
|
||||
}
|
||||
.post-description{
|
||||
padding-top: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
.blog-list-item:first-child .row {
|
||||
margin-top:30px;
|
||||
margin-bottom:30px;
|
||||
|
||||
.blog-header {
|
||||
font-size: 34px;
|
||||
}
|
||||
.post-by {
|
||||
font-weight: 500;
|
||||
}
|
||||
.post-description {
|
||||
font-weight: 500;
|
||||
}
|
||||
.blog-text {
|
||||
display: block;
|
||||
padding-top: 0px;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
.read-more-btn {
|
||||
display: inline;
|
||||
padding-top: 0px;
|
||||
border-bottom: 1px dotted @border-color;
|
||||
font-size: 12px;
|
||||
}
|
||||
.post-description {
|
||||
padding-bottom: 25px;
|
||||
}
|
||||
.recent-post {
|
||||
display: block;
|
||||
padding-top: 50px;
|
||||
padding-bottom: 20px;
|
||||
margin-bottom: 20px;
|
||||
border-bottom: 1px solid @light-border-color;
|
||||
font-size: 1.6em;
|
||||
}
|
||||
}
|
||||
|
||||
.blog-header {
|
||||
font-weight: 700;
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.blog-comments,
|
||||
.help-article-comments {
|
||||
padding: 0px 15px 15px 0px;
|
||||
|
|
@ -418,7 +362,6 @@ fieldset {
|
|||
.blog-comments {
|
||||
background-color: #fafbfc;
|
||||
position: relative;
|
||||
|
||||
}
|
||||
|
||||
.blog-comments:before {
|
||||
|
|
@ -567,12 +510,14 @@ a.active {
|
|||
font-size: 12px;
|
||||
}
|
||||
|
||||
.sidebar-block, .content-block {
|
||||
.sidebar-block, .page-content {
|
||||
padding-top: 50px;
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
.content-block {
|
||||
.your-account-info {
|
||||
margin-top: 50px;
|
||||
}
|
||||
.page-content {
|
||||
padding-left: 50px;
|
||||
padding-right: 50px;
|
||||
}
|
||||
|
|
@ -603,13 +548,15 @@ li .social-child-item {
|
|||
padding-top: 50px;
|
||||
padding-bottom: 50px;
|
||||
font-size: 18px;
|
||||
line-height: 1.5;
|
||||
p {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.blogger-name{
|
||||
font-size:24px;
|
||||
.blogger-name {
|
||||
margin-bottom:0px;
|
||||
margin-top:0px;
|
||||
}
|
||||
|
||||
.comment-header{
|
||||
|
|
@ -656,3 +603,13 @@ li .social-child-item {
|
|||
.dropdown .logged-in {
|
||||
border-left: 1px solid @border-color;
|
||||
}
|
||||
|
||||
.cart-count-badge {
|
||||
padding: 2px 4px;
|
||||
margin-left: 10px;
|
||||
background-color: @light-border-color;
|
||||
border-radius:10px;
|
||||
font-weight: 500;
|
||||
margin-top: -10px;
|
||||
margin-right: -8px;
|
||||
}
|
||||
|
|
@ -1,23 +1,18 @@
|
|||
{% extends "templates/web.html" %}
|
||||
|
||||
{% block breadcrumbs %}
|
||||
<div class="page-breadcrumbs" data-html-block="breadcrumbs">
|
||||
<ul class="breadcrumb">
|
||||
<li>
|
||||
<a href="/blog"><h1>{{ blog_title or _("Blog") }}</h1></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
{% endblock %}
|
||||
{% block page_content %}
|
||||
<article class="blog-content" itemscope itemtype="http://schema.org/BlogPosting">
|
||||
<meta itemprop="datePublished" content="{{ frappe.format_date(published_on) }}"></meta>
|
||||
<meta itemprop="publisher" content="{{brand_html}}"></meta>
|
||||
<!-- begin blog content -->
|
||||
<div class="blog-info">
|
||||
<div class="text-muted blog-category">{{blog_category}}</div>
|
||||
<div itemprop="headline" class="h1 blog-header">{{ title }}</div>
|
||||
<p class="post-by text-muted"><a href="/blog?by={{ blogger }}&by_name={{ full_name }}" class="no-decoration">
|
||||
By <meta itemprop="author" content="{{ blogger_info and blogger_info.full_name or full_name }}">{{ blogger_info and blogger_info.full_name or full_name }}</meta></a> <i class="blog-dot"></i> <meta itemprop="datePublished" content="{{ frappe.format_date(published_on) }}">{{ frappe.format_date(published_on) }}</meta> <i class="blog-dot"></i>{{ comment_text }}</p>
|
||||
<h1 itemprop="headline" class="blog-header">{{ title }}</h1>
|
||||
<p class="post-by text-muted small">
|
||||
<a href="/blog?by={{ blogger }}&by_name={{ full_name }}" class="no-decoration">By {{ blogger_info and blogger_info.full_name or full_name }}</a>
|
||||
<i class="blog-dot"></i> {{ frappe.format_date(published_on) }}
|
||||
<i class="blog-dot"></i> <a href="/{{ parent_website_route }}" class="no-decoration">{{ blog_category }}</a>
|
||||
<i class="blog-dot"></i> {{ comment_text }}
|
||||
</p>
|
||||
</div>
|
||||
<div itemprop="articleBody" class="longform blog-text">
|
||||
{{ content }}
|
||||
|
|
@ -25,13 +20,11 @@
|
|||
<!-- end blog content -->
|
||||
</article>
|
||||
{% if blogger_info %}
|
||||
<div class="author text-muted">Author</div>
|
||||
{% include "templates/includes/blog/blogger.html" %}
|
||||
{% endif %}
|
||||
<div class="blog-comments">
|
||||
{% include 'templates/includes/comments/comments.html' %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
frappe.ready(function() { frappe.set_search_path("/blog"); })
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -2,18 +2,15 @@
|
|||
<div class="web-list-item blog-list-item">
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<div class="h1 blog-header"><a href="/{{ post.page_name }}">{{ post.title }}</a></div>
|
||||
<p class="post-by text-muted"><a href="/blog?by={{ post.blogger }}&by_name={{ post.full_name }}" class="no-decoration">
|
||||
<a href="/{{ post.parent_website_route }}" class="no-decoration">{{ post.blog_category }}</a> <i class="blog-dot"></i>By {{ post.full_name }}</a> <i class="blog-dot"></i> {{ frappe.format_date(post.published_on) }} <i class="blog-dot"></i> {{ post.comment_text }}</p>
|
||||
<h1 class="blog-header"><a href="/{{ post.page_name }}">{{ post.title }}</a></h1>
|
||||
<p class="post-description">{{ post.intro }}</p>
|
||||
<div class="longform blog-text">
|
||||
{{ post.content }}
|
||||
</div>
|
||||
<span class="read-more-btn">
|
||||
<a href="/{{ post.page_name }}">Continue Reading</a>
|
||||
</span>
|
||||
<span class="recent-post text-uppercase text-muted">{{_("Recent Posts")}}</span>
|
||||
<p class="post-by text-muted small">
|
||||
<a href="/blog?by={{ post.blogger }}&by_name={{ post.full_name }}" class="no-decoration">By {{ post.full_name }}</a>
|
||||
<i class="blog-dot"></i> {{ frappe.format_date(post.published_on) }}
|
||||
<i class="blog-dot"></i>
|
||||
<a href="/{{ post.parent_website_route }}" class="no-decoration">{{ post.blog_category }}</a>
|
||||
<i class="blog-dot"></i> {{ post.comment_text }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -5,9 +5,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="inline-block" style="width: calc(100% - 100px)">
|
||||
<div class="blogger-name">{{ blogger_info.full_name }}</div>
|
||||
<h2 class="blogger-name"><a href="/blog?by={{ blogger_info.name }}&by_name={{ blogger_info.full_name }}">{{ blogger_info.full_name }}</a></h2>
|
||||
<p class="text-muted">{%if blogger_info.bio%}{{ blogger_info.bio }}{%endif%}</p>
|
||||
<p><a href="/blog?by={{ blogger_info.name }}&by_name={{ blogger_info.full_name }}">
|
||||
All Posts By {{ blogger_info.full_name }}</a></p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -20,7 +20,8 @@
|
|||
</div>
|
||||
|
||||
<div class="comment-form-wrapper">
|
||||
<div id="comment-form">
|
||||
<a class="add-comment btn btn-default btn-sm">{{ _("Add Comment") }}</a>
|
||||
<div style="display: none;" id="comment-form">
|
||||
<p>{{ _("Leave a Comment") }}</p>
|
||||
<div class="alert" style="display:none;"></div>
|
||||
<form>
|
||||
|
|
@ -37,8 +38,8 @@
|
|||
</div>
|
||||
<p><textarea class="form-control" name="comment" rows=10
|
||||
placeholder="{{ _("Comment") }}"></textarea></p>
|
||||
<p><button class="btn btn-primary btn-sm" id="submit-comment">
|
||||
{{ _("Submit") }}</button></p>
|
||||
<button class="btn btn-primary btn-sm" id="submit-comment" style="margin-top:10px">
|
||||
{{ _("Submit") }}</button>
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
|
|
@ -61,7 +62,9 @@
|
|||
$(".add-comment").toggle(false)
|
||||
.parent().append("<div class='text-muted'>Comments are closed.</div>")
|
||||
}
|
||||
|
||||
$(".add-comment").click(function() {
|
||||
$(this).toggle(false);
|
||||
$("#comment-form").toggle();
|
||||
var full_name = "", user_id = "";
|
||||
if(frappe.is_user_logged_in()) {
|
||||
full_name = getCookie("full_name");
|
||||
|
|
@ -72,6 +75,7 @@
|
|||
}
|
||||
}
|
||||
$("#comment-form textarea").val("");
|
||||
})
|
||||
|
||||
$("#submit-comment").click(function() {
|
||||
var args = {
|
||||
|
|
|
|||
|
|
@ -24,11 +24,6 @@
|
|||
<a href="{{ item.route }}" class="text-muted {{ 'active' if pathname==item.route else '' }}"
|
||||
{% if item.target %}target="{{ item.target }}"{% endif %}>
|
||||
{{ _(item.title) }}
|
||||
{% if item.reference_doctype %}
|
||||
<span class="badge">
|
||||
{{ "20+" if item.count > 20 else item.count }}
|
||||
</span>
|
||||
{% endif %}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
|
|
|||
|
|
@ -10,12 +10,10 @@
|
|||
{% block page_content %}
|
||||
|
||||
<!-- no-cache -->
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<div class="your-account-info">
|
||||
<div class="row your-account-info">
|
||||
<div class="col-sm-4">
|
||||
<span class="user-image-myaccount"></span>
|
||||
<div>
|
||||
|
||||
<div>
|
||||
<ul class="list-unstyled">
|
||||
<li><a href="/update-password">
|
||||
<h6 class="text-muted">{{ _("Reset Password") }}</h6>
|
||||
|
|
@ -27,15 +25,13 @@
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<div class="col-sm-8 pull-left">
|
||||
<p>
|
||||
<span class="label">User Name</span>
|
||||
<span class="value"> {{ fullname }}</span>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
|
|
|
|||
|
|
@ -4,14 +4,13 @@
|
|||
{% block content %}
|
||||
<div class="page-container" id="page-{{ name or page_name }}" data-path="{{ pathname }}"
|
||||
{% if page_or_generator=="Generator" %}data-doctype="{{ doctype }}"{% endif %}>
|
||||
<div class="page-content {% if not show_sidebar %}page-max-width{% endif %}">
|
||||
<div class="row {% if show_sidebar %}vert-line{% endif %}">
|
||||
{% if show_sidebar %}
|
||||
<div class="col-sm-3 sidebar-block">
|
||||
{% include "templates/includes/web_sidebar.html" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="{% if show_sidebar %}content-block col-sm-9{% else %} content-block col-sm-12 {% endif %}">
|
||||
<div class="{% if show_sidebar %}page-content col-sm-9{% else %} page-content col-sm-12 {% endif %}">
|
||||
<div class="page-content-wrapper">
|
||||
<div class="row page-head">
|
||||
<div class="col-sm-8">
|
||||
|
|
@ -44,6 +43,5 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -84,7 +84,6 @@ class BlogPost(WebsiteGenerator):
|
|||
|
||||
def get_list_context(context=None):
|
||||
list_context = frappe._dict(
|
||||
page_title = _("Blog"),
|
||||
template = "templates/includes/blog/blog.html",
|
||||
row_template = "templates/includes/blog/blog_row.html",
|
||||
get_list = get_blog_list,
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue