store estimated reading time / filters on reading time

This commit is contained in:
Nicolas Lœuillet
2015-08-07 22:20:30 +02:00
parent fedaf00537
commit 2686457448
20 changed files with 433 additions and 279 deletions

View File

@ -21,11 +21,12 @@
{% if entries is empty %}
<div class="messages warning"><p>{% trans %}No articles found.{% endtrans %}</p></div>
{% else %}
<div><form>{{ form_rest(form) }}<button class="btn waves-effect waves-light" type="submit" id="submit-filter" value="filter">Filter</button></form></div>
{% for entry in entries %}
<div id="entry-{{ entry.id|e }}" class="entrie">
<div id="entry-{{ entry.id|e }}" class="entry">
<h2><a href="{{ path('view', { 'id': entry.id }) }}">{{ entry.title|raw }}</a></h2>
{% if entry.content| readingTime > 0 %}
<div class="estimatedTime"><span class="tool reading-time">{% trans %}estimated reading time :{% endtrans %} {{ entry.content| readingTime }} min</span></div>
{% if entry.readingTime > 0 %}
<div class="estimatedTime"><span class="tool reading-time">{% trans %}estimated reading time :{% endtrans %} {{ entry.readingTime }} min</span></div>
{% else %}
<div class="estimatedTime"><span class="tool reading-time">{% trans %}estimated reading time :{% endtrans %} <small class="inferieur">&lt;</small> 1 min</span></div>
{% endif %}

View File

@ -17,8 +17,8 @@
<pubDate>{{ entry.createdAt|date('D, d M Y H:i:s') }}</pubDate>
<description>
<![CDATA[
{%- if entry.content|readingTime > 0 -%}
{% trans %}estimated reading time :{% endtrans %} {{ entry.content|readingTime }} min
{%- if entry.readingTime > 0 -%}
{% trans %}estimated reading time :{% endtrans %} {{ entry.readingTime }} min
{%- else -%}
{% trans %}estimated reading time :{% endtrans %} &lt; 1 min
{%- endif %}

View File

@ -121,7 +121,7 @@ a:visited {
font-size: 1.3em;
}
#main #content .entrie {
#main #content .entry {
margin-top: 15px;
padding-bottom: 15px;
border-bottom: 1px dashed #222;
@ -129,19 +129,19 @@ a:visited {
}
/* First entry */
#main #content .results + .entrie {
#main #content .results + .entry {
clear: both;
margin-top: 0;
}
#main .entrie .tools {
#main .entry .tools {
float: right;
text-align: right;
list-style-type: none;
opacity: 0.5;
}
#main .entrie .tools .tool span {
#main .entry .tools .tool span {
display: inline-block;
width: 16px;
height: 16px;

View File

@ -322,7 +322,7 @@ footer a {
letter-spacing:-5px;
}
.listmode .entrie {
.listmode .entry {
width: 100%!important;
margin-left: 0!important;
}
@ -343,7 +343,7 @@ footer a {
top: -1px;
}
.entrie {
.entry {
background-color: #FFF;
letter-spacing:normal;
box-shadow: 0 3px 7px rgba(0,0,0,0.3);
@ -366,7 +366,7 @@ footer a {
/* transition: all 0.5s ease; */
}
.entrie:before {
.entry:before {
content: "";
width: 0;
height: 0;
@ -384,7 +384,7 @@ footer a {
transition: all 0.5s ease;
}
.entrie:after {
.entry:after {
content: "";
position: absolute;
height: 7px;
@ -399,34 +399,34 @@ footer a {
transition: all 0.5s ease;
}
.entrie:hover {
.entry:hover {
box-shadow: 0 3px 10px rgba(0,0,0,1);
}
.entrie:hover:after {
.entry:hover:after {
height: 40px;
}
.entrie:hover:before {
.entry:hover:before {
bottom: 2.4em;
}
.entrie:hover h2 a {
.entry:hover h2 a {
color: #666;
}
.entrie h2 {
.entry h2 {
text-transform: none;
margin-bottom: 0;
line-height: 1.2;
}
.entrie h2:after {
.entry h2:after {
content: none;
}
.entrie h2 a {
.entry h2 a {
display: block;
text-decoration: none;
color: #000;
@ -438,7 +438,7 @@ footer a {
transition: all 0.5s ease;
}
/*
.entrie h2 a:after {
.entry h2 a:after {
content: "";
position: absolute;
top: 0;
@ -448,21 +448,21 @@ footer a {
}
*/
.entrie p {
.entry p {
color: #666;
font-size: 0.9em;
line-height: 1.7;
}
.entrie h2 a:first-letter {
.entry h2 a:first-letter {
text-transform: uppercase;
}
.entrie:hover .tools {
.entry:hover .tools {
bottom: 0;
}
.entrie .tools {
.entry .tools {
position: absolute;
bottom: -50px;
left: 0;
@ -477,22 +477,22 @@ footer a {
transition: all 0.5s ease;
}
.entrie .tools a {
.entry .tools a {
color: #666;
text-decoration: none;
display: block;
padding: 0.4em;
}
.entrie .tools a:hover {
.entry .tools a:hover {
color: #FFF;
}
.entrie .tools li {
.entry .tools li {
display: inline-block;
}
.entrie:nth-child(3n+1) {
.entry:nth-child(3n+1) {
margin-left: 0;
}
@ -941,13 +941,13 @@ pre code {
========================================================================== */
@media screen and (max-width: 1050px) {
.entrie {
.entry {
width: 49%;
}
.entrie:nth-child(3n+1) {
.entry:nth-child(3n+1) {
margin-left: 1.5%;
}
.entrie:nth-child(2n+1) {
.entry:nth-child(2n+1) {
margin-left: 0;
}
}
@ -962,7 +962,7 @@ pre code {
}
@media screen and (max-width: 700px) {
.entrie {
.entry {
width: 100%;
margin-left: 0;
}
@ -972,7 +972,7 @@ pre code {
}
@media screen and (max-width: 500px) {
.entrie {
.entry {
width: 100%;
margin-left: 0;
}

View File

@ -18,6 +18,7 @@
{% if entries is not empty %}
<div class="results clearfix">
<div class="nb-results left">{{ entries.count }} {% trans %}entries{% endtrans %}</div>
<div class="left"><form>{{ form_rest(form) }}<button class="btn waves-effect waves-light" type="submit" id="submit-filter" value="filter">Filter</button></form></div>
<ul class="pagination right">
{% for p in range(1, entries.nbPages) %}
<li class="{{ currentPage == p ? 'active':'waves-effect'}}">
@ -38,8 +39,8 @@
<div class="card">
<div class="card-content">
<span class="card-title"><a href="{{ path('view', { 'id': entry.id }) }}">{{ entry.title|raw }}</a></span>
{% if entry.content| readingTime > 0 %}
<div class="estimatedTime grey-text"><span class="tool reading-time">{% trans %}estimated reading time: {% endtrans %} {{ entry.content| readingTime }} min</span></div>
{% if entry.readingTime > 0 %}
<div class="estimatedTime grey-text"><span class="tool reading-time">{% trans %}estimated reading time: {% endtrans %} {{ entry.readingTime }} min</span></div>
{% else %}
<div class="estimatedTime grey-text"><span class="tool reading-time">{% trans %}estimated reading time: {% endtrans %} <small class="inferieur">&lt;</small> 1 min</span></div>
{% endif %}

View File

@ -25,7 +25,7 @@ body > footer,
div.tools,
header div,
.messages,
.entrie + .results {
.entry + .results {
display: none !important;
}