aboutsummaryrefslogtreecommitdiffhomepage
path: root/src/Wallabag
diff options
context:
space:
mode:
authorAlexandr Danilov <bitbucket@modos189.ru>2015-08-12 22:55:44 +0300
committerAlexandr Danilov <bitbucket@modos189.ru>2015-08-12 22:55:44 +0300
commit392f4a2681d94b8af8e2725aa6ca4615329afa54 (patch)
tree4205972ddd5a02be6cc7c2b7839d8e8919913320 /src/Wallabag
parent8ba913d87a1e7f5223080c4e422301561fa74467 (diff)
downloadwallabag-392f4a2681d94b8af8e2725aa6ca4615329afa54.tar.gz
wallabag-392f4a2681d94b8af8e2725aa6ca4615329afa54.tar.zst
wallabag-392f4a2681d94b8af8e2725aa6ca4615329afa54.zip
#1320 Design for filters
Diffstat (limited to 'src/Wallabag')
-rw-r--r--src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig37
-rw-r--r--src/Wallabag/CoreBundle/Resources/views/themes/material/layout.html.twig8
-rwxr-xr-xsrc/Wallabag/CoreBundle/Resources/views/themes/material/public/css/main.css13
-rwxr-xr-xsrc/Wallabag/CoreBundle/Resources/views/themes/material/public/js/init.js14
4 files changed, 64 insertions, 8 deletions
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig
index 55e3540d..7a1cc9b4 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig
@@ -18,7 +18,6 @@
18 {% if entries is not empty %} 18 {% if entries is not empty %}
19 <div class="results clearfix"> 19 <div class="results clearfix">
20 <div class="nb-results left">{{ entries.count }} {% trans %}entries{% endtrans %}</div> 20 <div class="nb-results left">{{ entries.count }} {% trans %}entries{% endtrans %}</div>
21 <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>
22 <ul class="pagination right"> 21 <ul class="pagination right">
23 {% for p in range(1, entries.nbPages) if entries.nbPages > 1 %} 22 {% for p in range(1, entries.nbPages) if entries.nbPages > 1 %}
24 <li class="{{ currentPage == p ? 'active':'waves-effect'}}"> 23 <li class="{{ currentPage == p ? 'active':'waves-effect'}}">
@@ -62,4 +61,40 @@
62 {% endfor %} 61 {% endfor %}
63 </ul> 62 </ul>
64 {% endif %} 63 {% endif %}
64
65
66 <!-- Filters -->
67 <div id="filters" class="side-nav fixed right-aligned">
68 <form>
69
70 <h4 class="center">{% trans %}Filters{% endtrans %}</h1>
71
72 <div class="row">
73
74 <div class="col s12">
75 <label>{% trans %}Reading time in minutes{% endtrans %}</label>
76 </div>
77
78 <div class="input-field col s6">
79 <input id="entry_filter_readingTime_left_number" name="entry_filter[readingTime][left_number]" type="number">
80 <label for="entry_filter_readingTime_left_number">{% trans %}from{% endtrans %}</label>
81 </div>
82
83 <div class="input-field col s6">
84 <input id="entry_filter_readingTime_right_number" name="entry_filter[readingTime][right_number]" type="number">
85 <label for="entry_filter_readingTime_right_number">{% trans %}to{% endtrans %}</label>
86 </div>
87
88 <div class="col s6">
89 <a href="#!" class="center waves-effect waves-green btn-flat" id="clean_form_filters">{% trans %}Clean{% endtrans %}</a>
90 </div>
91
92 <div class="col s6">
93 <button class="btn waves-effect waves-light" type="submit" id="submit-filter" value="filter">{% trans %}Filter{% endtrans %}</button>
94 </div>
95
96 </div>
97
98 </form>
99 </div>
65{% endblock %} 100{% endblock %}
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/layout.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/layout.html.twig
index 32933d56..88b6c6b7 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/layout.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/layout.html.twig
@@ -60,6 +60,7 @@
60 <ul> 60 <ul>
61 <li class="bold"><a class="waves-effect" href="{{ path('new') }}" id="nav-btn-add"><i class="mdi-content-add"></i></a></li> 61 <li class="bold"><a class="waves-effect" href="{{ path('new') }}" id="nav-btn-add"><i class="mdi-content-add"></i></a></li>
62 <li><a class="waves-effect" href="javascript: void(null);" id="nav-btn-search"><i class="mdi-action-search"></i></a> 62 <li><a class="waves-effect" href="javascript: void(null);" id="nav-btn-search"><i class="mdi-action-search"></i></a>
63 <li id="button_filters"><a href="#" data-activates="filters" class="nav-panel-menu button-collapse-right"><i class="mdi-content-filter-list"></i></a></li>
63 </ul> 64 </ul>
64 </div> 65 </div>
65 <form method="get" action="index.php"> 66 <form method="get" action="index.php">
@@ -74,13 +75,6 @@
74 <label for="add" class="active"><i class="mdi-content-add"></i></label> 75 <label for="add" class="active"><i class="mdi-content-add"></i></label>
75 <i class="mdi-navigation-close"></i> 76 <i class="mdi-navigation-close"></i>
76 </div> 77 </div>
77 <!--<form name="entry" method="post" action="{{ path('new_entry') }}">
78 <div class="input-field nav-panel-add" style="display: none">
79 <input id="add entry_url" name="entry[url]" type="search" required placeholder="{% trans %}Enter your link here{% endtrans %}">
80 <label for="add"><i class="mdi-content-add"></i></label>
81 <i class="mdi-navigation-close"></i>
82 </div>
83 </form>-->
84 </div> 78 </div>
85 </nav> 79 </nav>
86{% endblock %} 80{% endblock %}
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/public/css/main.css b/src/Wallabag/CoreBundle/Resources/views/themes/material/public/css/main.css
index 6dd6ed55..2497e3e9 100755
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/public/css/main.css
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/public/css/main.css
@@ -128,6 +128,10 @@ nav input {
128 transition: .3s color; 128 transition: .3s color;
129} 129}
130 130
131#button_filters {
132 display: none;
133}
134
131/* ========================================================================== 135/* ==========================================================================
132 2 = Side-nav 136 2 = Side-nav
133 ========================================================================== */ 137 ========================================================================== */
@@ -165,6 +169,15 @@ nav input {
165} 169}
166 170
167/* ========================================================================== 171/* ==========================================================================
172 * 3 = Filters slider
173 * ========================================================================== */
174
175#filters button {
176 padding: 0px;
177 width: 100%;
178}
179
180/* ==========================================================================
168 3 = Cards 181 3 = Cards
169 ========================================================================== */ 182 ========================================================================== */
170 183
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/public/js/init.js b/src/Wallabag/CoreBundle/Resources/views/themes/material/public/js/init.js
index 9341cb5a..4adc1a8d 100755
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/public/js/init.js
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/public/js/init.js
@@ -1,3 +1,16 @@
1function init_filters() {
2 // no display if filters not aviable
3 if ($("div").is("#filters")) {
4 $('#button_filters').show();
5 $('.button-collapse-right').sideNav({ edge: 'right' });
6 $('#filters').css({ "left": "auto" });
7 $('#clean_form_filters').click(function(){
8 $('#filters input').val('');
9 return false;
10 });
11 }
12}
13
1$(document).ready(function(){ 14$(document).ready(function(){
2 // sideNav 15 // sideNav
3 $('.button-collapse').sideNav(); 16 $('.button-collapse').sideNav();
@@ -5,6 +18,7 @@ $(document).ready(function(){
5 $('.collapsible').collapsible({ 18 $('.collapsible').collapsible({
6 accordion : false 19 accordion : false
7 }); 20 });
21 init_filters();
8 22
9 $('#nav-btn-add').click(function(){ 23 $('#nav-btn-add').click(function(){
10 $(".nav-panel-buttom").hide(100); 24 $(".nav-panel-buttom").hide(100);