Add list macro

This commit is contained in:
Raghavendra Kamath
2018-04-04 20:00:13 +05:30
parent 1958098c90
commit 83c26eb01d
3 changed files with 32 additions and 29 deletions

View File

@@ -1,3 +1,4 @@
/* palette colors*/
@import "reset.css"; @import "reset.css";
@import "/assets/css/frappe-css.css"; @import "/assets/css/frappe-css.css";
.indicator, .indicator,
@@ -24,7 +25,7 @@
} }
.indicator.grey::before, .indicator.grey::before,
.indicator-right.grey::after { .indicator-right.grey::after {
background: #F0F4F7; background: #f0f4f7;
} }
.indicator.blue::before, .indicator.blue::before,
.indicator-right.blue::after { .indicator-right.blue::after {
@@ -52,19 +53,19 @@
} }
.indicator.black::before, .indicator.black::before,
.indicator-right.black::after { .indicator-right.black::after {
background: #36414C; background: #36414c;
} }
.indicator.yellow::before, .indicator.yellow::before,
.indicator-right.yellow::after { .indicator-right.yellow::after {
background: #FEEF72; background: #feef72;
} }
.indicator.light-blue::before, .indicator.light-blue::before,
.indicator-right.light-blue::after { .indicator-right.light-blue::after {
background: #7CD6FD; background: #7cd6fd;
} }
.indicator.lightblue::before, .indicator.lightblue::before,
.indicator-right.lightblue::after { .indicator-right.lightblue::after {
background: #7CD6FD; background: #7cd6fd;
} }
.modal-header .indicator { .modal-header .indicator {
float: left; float: left;

View File

@@ -16,18 +16,26 @@
</div> </div>
{% endmacro %} {% endmacro %}
{% macro list(link, image, title, subtitle) %} {% macro list_item(link, image, title, subtitle) %}
<div class="list list-unstyled"> <div class="list-item flex mb2">
<div class="list-item flex"> <div>
<div class="flex1"> <a href="{{ link or "#" }}">
<a class="flex1" href="{{ link or "#" }}" <img class="thumb-medium mr2" src="{% if image %}{% if not '/' in image %}/assets/foundation/img/{% endif %}{{ image }}{% else %}/assets/foundation/img/frappe-bird-grey.svg{% endif %}">
<img class="thumbnail" src="{% if image %}{% if not '/' in image %}/assets/foundation/img/{% endif %}{{ image }}{% else %}/assets/foundation/img/frappe-bird-grey.svg{% endif %}"> </a>
</a>
</div>
<div class="flex4">
{% if title %}<h3 class="h3">{{ title }}</h3>{% endif %}
{{ content }}
</div>
</div>
</div> </div>
<div>
<a href="{{ link or "#" }}">
{% if title %}<h3 class="h3">{{ title }}</h3>{% endif %}
</a>
<a href="{{ link or "#" }}">
{% if subtitle %}<p>{{ subtitle }}</p>{% endif %}
</a>
<a href="{{ link or "#" }}">
{% if meta %}{{ meta }}{% endif %}
</a>
{% if content %}
{{ content }}
{% endif %}
</div>
</div>
{% endmacro %} {% endmacro %}

View File

@@ -1,12 +1,6 @@
{%- set post = doc -%} {%- set post = doc -%}
<div class="list-item"> {% macro meta() %}
<div class="flex"> <p>By <a href="/blog?blogger={{ post.blogger }}">{{ post.full_name }}</a>. Posted on
<div class="mr2">
<img class="thumb-medium" alt="{{ post.full_name }}'s profile picture" itemprop="thumbnailUrl" src='{{ post.avatar or "/assets/frappe/images/default-avatar.png" }}' />
</div>
<div class="text-dark-grey">
<h2 class="h2 text-black"><a href="/{{ post.route }}">{{ post.title }}</a></h1>
<p>By <a href="/blog?blogger={{ post.blogger }}">{{ post.full_name }}</a>. Posted on
{{ frappe.format_date(post.published_on) }} {{ frappe.format_date(post.published_on) }}
{% if post.comments %} {% if post.comments %}
<span style='display: inline-block; margin-left: 10px;'> <span style='display: inline-block; margin-left: 10px;'>
@@ -14,6 +8,6 @@
</span> </span>
{% endif %} {% endif %}
</p> </p>
</div> {% endmacro %}
</div> {% from "foundation/templates/includes/macros.html" import list_item%}
</div> {{list_item(post.route, post.avatar, post.title, meta())}}