{% 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) if entries.nbPages > 1 %}
<li class="{{ currentPage == p ? 'active':'waves-effect'}}">
{% endfor %}
</ul>
{% endif %}
+
+
+ <!-- Filters -->
+ <div id="filters" class="side-nav fixed right-aligned">
+ <form>
+
+ <h4 class="center">{% trans %}Filters{% endtrans %}</h1>
+
+ <div class="row">
+
+ <div class="col s12">
+ <label>{% trans %}Reading time in minutes{% endtrans %}</label>
+ </div>
+ <div class="input-field col s6">
+ {{ form_widget(form.readingTime.left_number, {'type': 'number'}) }}
+ <label for="entry_filter_readingTime_left_number">{% trans %}from{% endtrans %}</label>
+ </div>
+ <div class="input-field col s6">
+ {{ form_widget(form.readingTime.right_number, {'type': 'number'}) }}
+ <label for="entry_filter_readingTime_right_number">{% trans %}to{% endtrans %}</label>
+ </div>
+
+ <div class="col s12">
+ <label>{% trans %}Create at{% endtrans %}</label>
+ </div>
+ <div class="input-field col s6">
+ {{ form_widget(form.createdAt.left_date, {'type': 'date', 'attr': {'class': 'datepicker', 'data-value': form.createdAt.left_date.vars.value} }) }}
+ <label for="entry_filter_createdAt_left_date" class="active">{% trans %}from{% endtrans %}</label>
+ </div>
+ <div class="input-field col s6">
+ {{ form_widget(form.createdAt.right_date, {'type': 'date', 'attr': {'class': 'datepicker', 'data-value': form.createdAt.right_date.vars.value} }) }}
+ <label for="entry_filter_createdAt_right_date" class="active">{% trans %}to{% endtrans %}</label>
+ </div>
+
+ <div class="col s6">
+ <a href="#!" class="center waves-effect waves-green btn-flat" id="clean_form_filters">{% trans %}Clean{% endtrans %}</a>
+ </div>
+
+ <div class="col s6">
+ <button class="btn waves-effect waves-light" type="submit" id="submit-filter" value="filter">{% trans %}Filter{% endtrans %}</button>
+ </div>
+
+ </div>
+
+ </form>
+ </div>
{% endblock %}
{% block title %}{{ entry.title|raw }} ({{ entry.domainName }}){% endblock %}
{% block menu %}
+ <div class="progress">
+ <div class="determinate"></div>
+ </div>
<nav class="hide-on-large-only">
<div class="nav-wrapper cyan darken-1">
<ul>
<span class="black-text">{{ form_errors(form.url) }}</span>
{% endif %}
- {{ form_widget(form.url) }}
+ {{ form_widget(form.url, { 'attr': {'autocomplete': 'off'} }) }}
<div class="hidden">{{ form_rest(form) }}</div>
</form>
<span class="black-text"><p>{{ flashMessage }}</p></span>
{% endfor %}
- <div class="input-field s12">
- <label for="username">{% trans %}Username{% endtrans %}</label>
- <input type="text" id="username" name="_username" value="{{ last_username }}" />
- </div>
+ <div class="row">
- <div class="input-field s12">
- <label for="password">{% trans %}Password{% endtrans %}</label>
- <input type="password" id="password" name="_password" />
- </div>
+ <div class="input-field col s12">
+ <label for="username">{% trans %}Username{% endtrans %}</label>
+ <input type="text" id="username" name="_username" value="{{ last_username }}" />
+ </div>
+
+ <div class="input-field col s12">
+ <label for="password">{% trans %}Password{% endtrans %}</label>
+ <input type="password" id="password" name="_password" />
+ </div>
+
+ <div class="input-field col s12">
+ <input type="checkbox" id="remember_me" name="_remember_me" checked />
+ <label for="remember_me">{% trans %}Keep me logged in{% endtrans %}</label>
+ </div>
- <div class="input-field s12">
- <input type="checkbox" id="remember_me" name="_remember_me" checked />
- <label for="remember_me">{% trans %}Keep me logged in{% endtrans %}</label>
</div>
</div>
<ul>
<li class="bold"><a class="waves-effect" href="{{ path('new') }}" id="nav-btn-add"><i class="mdi-content-add"></i></a></li>
<li><a class="waves-effect" href="javascript: void(null);" id="nav-btn-search"><i class="mdi-action-search"></i></a>
+ <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>
</ul>
</div>
<form method="get" action="index.php">
</form>
<div class="input-field nav-panel-add" style="display: none">
{{ render(controller( "WallabagCoreBundle:Entry:addEntryForm" )) }}
- <label for="add"><i class="mdi-content-add"></i></label>
+ <label for="add" class="active"><i class="mdi-content-add"></i></label>
<i class="mdi-navigation-close"></i>
</div>
- <!--<form name="entry" method="post" action="{{ path('new_entry') }}">
- <div class="input-field nav-panel-add" style="display: none">
- <input id="add entry_url" name="entry[url]" type="search" required placeholder="{% trans %}Enter your link here{% endtrans %}">
- <label for="add"><i class="mdi-content-add"></i></label>
- <i class="mdi-navigation-close"></i>
- </div>
- </form>-->
</div>
</nav>
{% endblock %}
margin-bottom: 0;
}
+.pagination li {
+ padding: 0;
+}
+
+.pagination a {
+ padding: 0px 10px;
+ height: 30px;
+ display: block;
+}
+
.page-footer .footer-copyright p {
display: inline;
}
display: none;
}
+.picker__date-display {
+ display: none;
+}
+
/* ==========================================================================
1 = Nav
========================================================================== */
+nav input {
+ color: #aaa;
+}
+
.nav-wrapper .button-collapse {
padding: 0px 15px;
}
white-space: nowrap;
}
+.nav-panels .input-field input {
+ display: block;
+ line-height: inherit;
+ padding-left: 4rem !important;
+ width: calc(100% - 8rem);
+}
+
+.nav-panels .input-field input:focus {
+ background-color: #fff;
+ border: 0;
+ box-shadow: none;
+ color: #444;
+}
+
+.input-field.nav-panel-add label {
+ left: 1rem;
+}
+
+.input-field.nav-panel-add .mdi-navigation-close {
+ position: absolute;
+ top: 0;
+ right: 1rem;
+ color: transparent;
+ cursor: pointer;
+ font-size: 2rem;
+ transition: .3s color;
+}
+
+#button_filters {
+ display: none;
+}
+
/* ==========================================================================
2 = Side-nav
========================================================================== */
margin: 0px 1rem;
}
+/* ==========================================================================
+ * 3 = Filters slider
+ * ========================================================================== */
+
+#filters button {
+ padding: 0px;
+ width: 100%;
+}
+
+.side-nav.fixed.right-aligned {
+ right: -250px;
+ left: auto !important;
+ overflow-y: visible;
+}
+
/* ==========================================================================
3 = Cards
========================================================================== */
width: 240px !important;
}
+.reader-mode .collapsible-body {
+ height: 0;
+ overflow: hidden;
+}
+
+.reader-mode:hover .collapsible-body {
+ height: auto;
+}
+
.reader-mode span {
opacity: 0;
transition: opacity 0.2s ease;
opacity: 1;
}
+.progress {
+ position:fixed;
+ top:0px;
+ width: 100%;
+ height: 3px;
+ margin: 0;
+ z-index: 9999;
+}
/* ==========================================================================
6 = Media queries
========================================================================== */
+function init_filters() {
+ // no display if filters not aviable
+ if ($("div").is("#filters")) {
+ $('#button_filters').show();
+ $('.button-collapse-right').sideNav({ edge: 'right' });
+ $('#clean_form_filters').on('click', function(){
+ $('#filters input').val('');
+ return false;
+ });
+ }
+}
+
$(document).ready(function(){
// sideNav
$('.button-collapse').sideNav();
$('.collapsible').collapsible({
accordion : false
});
+ $('.datepicker').pickadate({
+ selectMonths: true,
+ selectYears: 15,
+ formatSubmit: 'dd/mm/yyyy',
+ hiddenName: true,
+ format: 'dd/mm/yyyy',
+ });
+ init_filters();
- $('#nav-btn-add').click(function(){
+ $('#nav-btn-add').on('click', function(){
$(".nav-panel-buttom").hide(100);
$(".nav-panel-add").show(100);
- $(".nav-panel-menu").hide(100);
$(".nav-panels .action").hide(100);
$(".nav-panel-menu").addClass('hidden');
$(".nav-panels").css('background', 'white');
$("#entry_url").focus();
return false;
});
- $('#nav-btn-search').click(function(){
+ $('#nav-btn-search').on('click', function(){
$(".nav-panel-buttom").hide(100);
$(".nav-panel-search").show(100);
$(".nav-panels .action").hide(100);
$("#searchfield").focus();
return false;
});
- $('.mdi-navigation-close').click(function(){
+ $('.mdi-navigation-close').on('click', function(){
$(".nav-panel-add").hide(100);
$(".nav-panel-search").hide(100);
$(".nav-panel-buttom").show(100);
$(".nav-panels").css('background', 'transparent');
return false;
});
+ $(window).scroll(function () {
+ var s = $(window).scrollTop(),
+ d = $(document).height(),
+ c = $(window).height();
+ var scrollPercent = (s / (d-c)) * 100;
+ $(".progress .determinate").css('width', scrollPercent+'%');
+ });
});
projects / github / wallabag / wallabag.git / commitdiff
