devol/wallabag
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Filters view on side for baggy

Browse Source
This commit is contained in:
Jeremy Benoist 2015-08-25 23:24:24 +02:00
parent 71e51207ce
commit 5def3f5862
2 changed files with 88 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

75
src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entries.html.twig
View File

@ -20,15 +20,6 @@
</div> </div>
{% endblock %} {% endblock %}
<div id="filter-form" class="messages info popup-form">
<form method="get" action="{{ path('all') }}">
<h2>{% trans %}Filter{% endtrans %}</h2>
<a href="javascript: void(null);" id="filter-form-close" class="close-button--popup close-button">&times;</a>
{{ form_rest(form) }}
<button class="btn waves-effect waves-light" type="submit" id="submit-filter" value="filter">{% trans %}Filter{% endtrans %}</button>
</form>
</div>
{% if entries is empty %} {% if entries is empty %}
<div class="messages warning"><p>{% trans %}No articles found.{% endtrans %}</p></div> <div class="messages warning"><p>{% trans %}No articles found.{% endtrans %}</p></div>
{% else %} {% else %}
@ -55,4 +46,70 @@
</div> </div>
{% endfor %} {% endfor %}
{% endif %} {% endif %}
<aside id="filter-form" class="">
<form method="get" action="{{ path('all') }}">
<h2>{% trans %}Filters{% endtrans %}</h2>
<a href="javascript: void(null);" id="filter-form-close" class="close-button--popup close-button">&times;</a>
<div id="filter-status" class="filter-group">
<div class="">
<label>{% trans %}Status{% endtrans %}</label>
</div>
<div class="input-field">
{{ form_widget(form.isArchived) }}
<label for="entry_filter_isArchived">{% trans %}Archived{% endtrans %}</label>
</div>
<div class="input-field">
{{ form_widget(form.isStarred) }}
<label for="entry_filter_isStarred">{% trans %}Starred{% endtrans %}</label>
</div>
</div>
<div id="filter-reading-time" class="filter-group">
<div class="">
<label>{% trans %}Reading time in minutes{% endtrans %}</label>
</div>
<div class="input-field ">
<label for="entry_filter_readingTime_left_number">{% trans %}from{% endtrans %}</label>
{{ form_widget(form.readingTime.left_number, {'type': 'number'}) }}
</div>
<div class="input-field ">
<label for="entry_filter_readingTime_right_number">{% trans %}to{% endtrans %}</label>
{{ form_widget(form.readingTime.right_number, {'type': 'number'}) }}
</div>
</div>
<div id="filter-domain-name" class="filter-group">
<label for="entry_filter_domainName">{% trans %}Domain name{% endtrans %}</label>
<div class="input-field ">
{{ form_widget(form.domainName, {'type': 'text', 'attr' : {'placeholder': 'website.com'} }) }}
</div>
</div>
<div id="filter-creation-date" class="filter-group">
<div class="">
<label>{% trans %}Creation date{% endtrans %}</label>
</div>
<div class="input-field ">
<label for="entry_filter_createdAt_left_date" class="active">{% trans %}from{% endtrans %}</label>
{{ form_widget(form.createdAt.left_date, {'type': 'date', 'attr': {'class': 'datepicker', 'data-value': form.createdAt.left_date.vars.value} }) }}
</div>
<div class="input-field ">
<label for="entry_filter_createdAt_right_date" class="active">{% trans %}to{% endtrans %}</label>
{{ form_widget(form.createdAt.right_date, {'type': 'date', 'attr': {'class': 'datepicker', 'data-value': form.createdAt.right_date.vars.value} }) }}
</div>
</div>
<div id="filter-buttons" class="filter-group">
<div class="">
<a href="#!" class="center waves-effect waves-green btn-flat" id="clear_form_filters">{% trans %}Clear{% endtrans %}</a>
</div>
<button class="btn waves-effect waves-light" type="submit" id="submit-filter" value="filter">{% trans %}Filters{% endtrans %}</button>
</div>
</form>
</aside>
{% endblock %} {% endblock %}

29
src/Wallabag/CoreBundle/Resources/views/themes/baggy/public/css/main.css
View File

@ -940,16 +940,31 @@ pre code {
} }
#filter-form { #filter-form {
margin-top: 30px !important; position: fixed;
width: 500px; width: 15%;
height: 370px; height: 100%;
right: 5em; top: 0;
left: inherit; right: 0;
background-color: #FFF;
padding: 15px;
padding-right: 30px;
padding-top: 30px;
z-index: 12;
/*transition-property: transform;
transition-duration: 0.3s;
transition-delay: 0.3s;
transform: translate3d(100%, 0, 0);*/
} }
#filter-form form { #filter-form form {
width: 500px;
height: 370px; }
#filter-form form .filter-group {
margin: 5px;
} }