vassili/seitime-frappe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

Merge pull request #7606 from netchampfaris/blog-post-styling

Browse source 
fix: Blog Post styling
This commit is contained in:
Rushabh Mehta 2019-05-30 17:16:21 +05:30 • committed by GitHub
commit f0ca3109c0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 36 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
frappe/public/scss/website-image.scss
View file

@ -82,3 +82,7 @@ img:after {
.website-image[src*="no-image.jpg"] {
padding: 46% 0;
}
.object-fit-cover {
object-fit: cover;
}

5
frappe/website/doctype/blog_post/templates/blog_post.html
View file

@ -10,10 +10,13 @@
<!-- begin blog content -->
<div class="blog-info">
<h1 itemprop="headline" class="blog-header">{{ title }}</h1>
<p class="text-muted">
<p class="text-muted small">
{{ frappe.format_date(published_on) }}
</p>
</div>
<p class="lead">
{{ description }}
</p>
<div itemprop="articleBody" class="longform blog-text mt-5">
{{ content }}
</div>

49
frappe/website/doctype/blog_post/templates/blog_post_row.html
View file

@ -1,27 +1,34 @@
{%- set post = doc -%}
<div class="web-list-item blog-list-item my-5">
<div class="row">
<div class="col-12 col-md-7">
<h4><a href="/{{ post.route }}" class="text-dark">{{ post.title }}</a></h4>
{% if post.cover_image %}
<p>
<img class="blogpost-cover-img" src="{{ post.cover_image }}" alt="{{post.title}} - Cover Image">
</p>
{% endif %}
<p class="post-description text-muted">{{ post.intro }}</p>
<p class="text-muted small">
<a class="text-muted" href="/blog?blogger={{ post.blogger }}">{{ post.full_name }}</a>
&middot;
{{ frappe.format_date(post.published_on) }}
{% if post.comments %}
&middot;
{% if post.comments == 1 %}
{{ _('1 comment') }}
{% else %}
{{ _('{0} comments').format(post.comments) }}
{% endif %}
{% endif %}
</p>
<div class="col-12 col-md-8">
<div class="row">
<div class="col-9 d-flex flex-column justify-content-between">
<div>
<div class="text-muted small text-uppercase">{{ post.category.title }}</div>
<h4><a href="/{{ post.route }}" class="text-dark">{{ post.title }}</a></h4>
<p class="post-description text-muted">{{ post.intro }}</p>
</div>
<div class="text-muted small">
<a class="text-muted" href="/blog?blogger={{ post.blogger }}">{{ post.full_name }}</a>
&middot;
{{ frappe.format_date(post.published_on) }}
{% if post.comments %}
&middot;
{% if post.comments == 1 %}
{{ _('1 comment') }}
{% else %}
{{ _('{0} comments').format(post.comments) }}
{% endif %}
{% endif %}
</div>
</div>
<div class="col-3">
{% if post.cover_image %}
<img class="website-image-medium object-fit-cover" src="{{ post.cover_image }}" alt="{{post.title}} - Cover Image">
{% endif %}
</div>
</div>
</div>
</div>
</div>