diff options
author | Nicolas Lœuillet <nicolas@loeuillet.org> | 2015-08-10 19:35:23 +0200 |
---|---|---|
committer | Nicolas Lœuillet <nicolas@loeuillet.org> | 2015-08-10 19:35:23 +0200 |
commit | f59601fced49d04a38b27e8b017b5e35cd851747 (patch) | |
tree | 1774492e41b73c185a62842148806af0c35e300c | |
parent | f48a0189290ae6dbdb0412a3abd95acd257e55cd (diff) | |
parent | 0e654f62730e233f586a4efee0d654311a498b9e (diff) | |
download | wallabag-f59601fced49d04a38b27e8b017b5e35cd851747.tar.gz wallabag-f59601fced49d04a38b27e8b017b5e35cd851747.tar.zst wallabag-f59601fced49d04a38b27e8b017b5e35cd851747.zip |
Merge pull request #1298 from modos189/v2_fix_material
fix material
5 files changed, 103 insertions, 149 deletions
diff --git a/src/Wallabag/CoreBundle/Resources/views/base.html.twig b/src/Wallabag/CoreBundle/Resources/views/base.html.twig index 223e8433..162fb463 100644 --- a/src/Wallabag/CoreBundle/Resources/views/base.html.twig +++ b/src/Wallabag/CoreBundle/Resources/views/base.html.twig | |||
@@ -90,20 +90,22 @@ | |||
90 | </ul> | 90 | </ul> |
91 | {% endblock %} | 91 | {% endblock %} |
92 | 92 | ||
93 | {% block precontent %}{% endblock %} | 93 | <main> |
94 | 94 | {% block precontent %}{% endblock %} | |
95 | {% block messages %} | 95 | |
96 | {% for flashMessage in app.session.flashbag.get('notice') %} | 96 | {% block messages %} |
97 | <div class="messages success"> | 97 | {% for flashMessage in app.session.flashbag.get('notice') %} |
98 | <a href="#" class="closeMessage">×</a> | 98 | <div class="messages success"> |
99 | <p>{{ flashMessage }}</p> | 99 | <a href="#" class="closeMessage">×</a> |
100 | </div> | 100 | <p>{{ flashMessage }}</p> |
101 | {% endfor %} | 101 | </div> |
102 | {% endblock %} | 102 | {% endfor %} |
103 | {% endblock %} | ||
103 | 104 | ||
104 | <div id="content" class="w600p center"> | 105 | <div id="content" class="w600p"> |
105 | {% block content %}{% endblock %} | 106 | {% block content %}{% endblock %} |
106 | </div> | 107 | </div> |
108 | </main> | ||
107 | </div> | 109 | </div> |
108 | 110 | ||
109 | {% block footer %} | 111 | {% block footer %} |
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/base.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/base.html.twig deleted file mode 100644 index 8c942165..00000000 --- a/src/Wallabag/CoreBundle/Resources/views/themes/material/base.html.twig +++ /dev/null | |||
@@ -1,134 +0,0 @@ | |||
1 | <!DOCTYPE html> | ||
2 | <!--[if lte IE 6]><html class="no-js ie6 ie67 ie678" lang="en"><![endif]--> | ||
3 | <!--[if lte IE 7]><html class="no-js ie7 ie67 ie678" lang="en"><![endif]--> | ||
4 | <!--[if IE 8]><html class="no-js ie8 ie678" lang="en"><![endif]--> | ||
5 | <!--[if gt IE 8]><html class="no-js" lang="en"><![endif]--> | ||
6 | <html lang="fr"> | ||
7 | <head> | ||
8 | {% block head %} | ||
9 | <meta name="viewport" content="initial-scale=1.0"> | ||
10 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | ||
11 | <!--[if IE]> | ||
12 | <meta http-equiv="X-UA-Compatible" content="IE=10"> | ||
13 | <![endif]--> | ||
14 | |||
15 | <link rel="apple-touch-icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-152.png') }}" sizes="152x152"> | ||
16 | <link rel="icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-152.png') }}" sizes="152x152"> | ||
17 | |||
18 | <link rel="apple-touch-icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-144.png') }}" sizes="144x144"> | ||
19 | <link rel="icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-144.png') }}" sizes="144x144"> | ||
20 | |||
21 | <link rel="apple-touch-icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-120.png') }}" sizes="120x120"> | ||
22 | <link rel="icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-120.png') }}" sizes="120x120"> | ||
23 | |||
24 | <link rel="apple-touch-icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-114.png') }}" sizes="114x114"> | ||
25 | <link rel="icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-114.png') }}" sizes="114x114"> | ||
26 | |||
27 | <link rel="apple-touch-icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-76.png') }}" sizes="76x76"> | ||
28 | <link rel="icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-76.png') }}" sizes="76x76"> | ||
29 | |||
30 | <link rel="apple-touch-icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-72.png') }}" sizes="72x72"> | ||
31 | <link rel="icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-72.png') }}" sizes="72x72"> | ||
32 | |||
33 | <link rel="apple-touch-icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-57.png') }}" sizes="57x57"> | ||
34 | <link rel="icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon-57.png') }}" sizes="57x57"> | ||
35 | |||
36 | <link rel="apple-touch-icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon.png') }}"> | ||
37 | <link rel="icon" type="image/png" href="{{ asset('themes/_global/img/appicon/apple-touch-icon.png') }}"> | ||
38 | |||
39 | <link rel="shortcut icon" type="image/x-icon" href="{{ asset('themes/_global/img/appicon/favicon.ico') }}"> | ||
40 | |||
41 | {% block css %}{% endblock %} | ||
42 | {% block scripts %} | ||
43 | <script src="{{ asset('themes/_global/js/jquery-2.0.3.min.js') }}"></script> | ||
44 | <script src="{{ asset('themes/_global/js/autoClose.js') }}"></script> | ||
45 | <script src="{{ asset('themes/_global/js/saveLink.js') }}"></script> | ||
46 | <script src="{{ asset('themes/_global/js/popupForm.js') }}"></script> | ||
47 | <script src="{{ asset('themes/_global/js/jquery.cookie.js') }}"></script> | ||
48 | <script src="{{ asset('themes/_global/js/bookmarklet.js') }}"></script> | ||
49 | <script src="{{ asset('themes/_global/js/closeMessage.js') }}"></script> | ||
50 | {% endblock %} | ||
51 | |||
52 | <title>{% block title %}{% endblock %} - wallabag</title> | ||
53 | {% endblock %} | ||
54 | </head> | ||
55 | |||
56 | <body class="{% block body_class %}{% endblock %}"> | ||
57 | {% block header %} | ||
58 | {% endblock %} | ||
59 | |||
60 | <div id="main"> | ||
61 | {% block menu %} | ||
62 | <nav class="cyan darken-1"> | ||
63 | <ul id="slide-out" class="side-nav fixed"> | ||
64 | {% block logo %} | ||
65 | <li class="logo border-bottom"> | ||
66 | <a class="waves-effect" title="{% trans %}Back to unread articles{% endtrans %}" href="{{ path('unread') }}"> | ||
67 | <img src="{{ asset('themes/baggy/img/logo-other_themes.png') }}" alt="wallabag logo" /> | ||
68 | </a> | ||
69 | </li> | ||
70 | {% endblock %} | ||
71 | |||
72 | {% set currentRoute = app.request.attributes.get('_route') %} | ||
73 | |||
74 | <li class="bold {% if currentRoute == 'unread' or currentRoute == 'homepage' %}active{% endif %}"><a class="waves-effect" href="{{ path('unread') }}">{% trans %}unread{% endtrans %}</a></li> | ||
75 | <li class="bold {% if currentRoute == 'starred' %}active{% endif %}"><a class="waves-effect" href="{{ path('starred') }}">{% trans %}starred{% endtrans %}</a></li> | ||
76 | <li class="bold {% if currentRoute == 'archive' %}active{% endif %}"><a class="waves-effect" href="{{ path('archive') }}">{% trans %}archive{% endtrans %}</a></li> | ||
77 | <li class="bold border-bottom {% if currentRoute == 'tags' %}active{% endif %}"><a class="waves-effect" href="{{ path('tag') }}">{% trans %}tags{% endtrans %}</a></li> | ||
78 | <li class="bold {% if currentRoute == 'config' %}active{% endif %}"><a class="waves-effect" href="{{ path('config') }}">{% trans %}config{% endtrans %}</a></li> | ||
79 | <li class="bold {% if currentRoute == 'howto' %}active{% endif %}"><a class="waves-effect" href="{{ path('howto') }}">{% trans %}howto{% endtrans %}</a></li> | ||
80 | <li class="bold"><a class="waves-effect" class="icon icon-power" href="{{ path('logout') }}" title="{% trans %}logout{% endtrans %}">{% trans %}logout{% endtrans %}</a></li> | ||
81 | </ul> | ||
82 | <div class="nav-wrapper nav-panels"> | ||
83 | <a href="#" data-activates="slide-out" class="nav-panel-menu button-collapse"><i class="mdi-navigation-menu"></i></a> | ||
84 | <div class="input-field nav-panel-buttom"> | ||
85 | <ul> | ||
86 | <li class="bold"><a class="waves-effect" href="{{ path('new_entry') }}" id="nav-btn-add"><i class="mdi-content-add"></i></a></li> | ||
87 | <li><a class="waves-effect" href="javascript: void(null);" id="nav-btn-search"><i class="mdi-action-search"></i></a> | ||
88 | </ul> | ||
89 | </div> | ||
90 | <form method="get" action="index.php"> | ||
91 | <div class="input-field nav-panel-search" style="display: none"> | ||
92 | <input name="search" id="searchfield" type="search" required placeholder="{% trans %}Enter your search here{% endtrans %}"> | ||
93 | <label for="search"><i class="mdi-action-search"></i></label> | ||
94 | <i class="mdi-navigation-close"></i> | ||
95 | </div> | ||
96 | </form> | ||
97 | <!--<form name="entry" method="post" action="{{ path('new_entry') }}"> | ||
98 | <div class="input-field nav-panel-add" style="display: none"> | ||
99 | <input id="add entry_url" name="entry[url]" type="search" required placeholder="{% trans %}Enter your link here{% endtrans %}"> | ||
100 | <label for="add"><i class="mdi-content-add"></i></label> | ||
101 | <i class="mdi-navigation-close"></i> | ||
102 | </div> | ||
103 | </form>--> | ||
104 | </div> | ||
105 | </nav> | ||
106 | {% endblock %} | ||
107 | |||
108 | <main> | ||
109 | |||
110 | {% block precontent %}{% endblock %} | ||
111 | |||
112 | {% block messages %} | ||
113 | {% for flashMessage in app.session.flashbag.get('notice') %} | ||
114 | <div class="messages success"> | ||
115 | <a href="#" class="closeMessage">×</a> | ||
116 | <p>{{ flashMessage }}</p> | ||
117 | </div> | ||
118 | {% endfor %} | ||
119 | {% endblock %} | ||
120 | |||
121 | <div id="content" class="w600p"> | ||
122 | {% block content %}{% endblock %} | ||
123 | </div> | ||
124 | |||
125 | </main> | ||
126 | </div> | ||
127 | |||
128 | {% block footer %} | ||
129 | <footer class="w600p center mt3 mb3 smaller txtright"> | ||
130 | <p>{% trans %}powered by{% endtrans %} <a href="http://wallabag.org">wallabag</a></p> | ||
131 | </footer> | ||
132 | {% endblock %} | ||
133 | </body> | ||
134 | </html> | ||
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 54bba9a6..2b32c2f9 100644 --- a/src/Wallabag/CoreBundle/Resources/views/themes/material/layout.html.twig +++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/layout.html.twig | |||
@@ -18,6 +18,68 @@ | |||
18 | {% block header %} | 18 | {% block header %} |
19 | {% endblock %} | 19 | {% endblock %} |
20 | 20 | ||
21 | {% block messages %} | ||
22 | {% for flashMessage in app.session.flashbag.get('notice') %} | ||
23 | <script> | ||
24 | Materialize.toast('{{ flashMessage }}', 4000); | ||
25 | </script> | ||
26 | {% endfor %} | ||
27 | {% endblock %} | ||
28 | |||
29 | {% block menu %} | ||
30 | <nav class="cyan darken-1"> | ||
31 | <ul id="slide-out" class="side-nav fixed"> | ||
32 | {% block logo %} | ||
33 | <li class="logo border-bottom"> | ||
34 | <a class="waves-effect" title="{% trans %}Back to unread articles{% endtrans %}" href="{{ path('unread') }}"> | ||
35 | <img src="{{ asset('themes/baggy/img/logo-other_themes.png') }}" alt="wallabag logo" /> | ||
36 | </a> | ||
37 | </li> | ||
38 | {% endblock %} | ||
39 | |||
40 | {% set currentRoute = app.request.attributes.get('_route') %} | ||
41 | |||
42 | <li class="bold {% if currentRoute == 'unread' or currentRoute == 'homepage' %}active{% endif %}"><a class="waves-effect" href="{{ path('unread') }}">{% trans %}unread{% endtrans %}</a></li> | ||
43 | <li class="bold {% if currentRoute == 'starred' %}active{% endif %}"><a class="waves-effect" href="{{ path('starred') }}">{% trans %}starred{% endtrans %}</a></li> | ||
44 | <li class="bold {% if currentRoute == 'archive' %}active{% endif %}"><a class="waves-effect" href="{{ path('archive') }}">{% trans %}archive{% endtrans %}</a></li> | ||
45 | <li class="bold border-bottom {% if currentRoute == 'tags' %}active{% endif %}"><a class="waves-effect" href="{{ path('tag') }}">{% trans %}tags{% endtrans %}</a></li> | ||
46 | <li class="bold {% if currentRoute == 'config' %}active{% endif %}"><a class="waves-effect" href="{{ path('config') }}">{% trans %}config{% endtrans %}</a></li> | ||
47 | <li class="bold {% if currentRoute == 'howto' %}active{% endif %}"><a class="waves-effect" href="{{ path('howto') }}">{% trans %}howto{% endtrans %}</a></li> | ||
48 | <li class="bold"><a class="waves-effect" class="icon icon-power" href="{{ path('logout') }}" title="{% trans %}logout{% endtrans %}">{% trans %}logout{% endtrans %}</a></li> | ||
49 | </ul> | ||
50 | <div class="nav-wrapper nav-panels"> | ||
51 | <a href="#" data-activates="slide-out" class="nav-panel-menu button-collapse"><i class="mdi-navigation-menu"></i></a> | ||
52 | <div class="left action"> | ||
53 | {% if currentRoute == 'unread' or currentRoute == 'homepage' %}{% trans %}Unread{% endtrans %}{% endif %} | ||
54 | {% if currentRoute == 'starred' %}{% trans %}Starred{% endtrans %}{% endif %} | ||
55 | {% if currentRoute == 'archive' %}{% trans %}Archive{% endtrans %}{% endif %} | ||
56 | {% if currentRoute == 'tags' %}{% trans %}Tags{% endtrans %}{% endif %} | ||
57 | {% if currentRoute == 'config' %}{% trans %}Config{% endtrans %}{% endif %} | ||
58 | </div> | ||
59 | <div class="input-field nav-panel-buttom"> | ||
60 | <ul> | ||
61 | <li class="bold"><a class="waves-effect" href="{{ path('new_entry') }}" 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> | ||
63 | </ul> | ||
64 | </div> | ||
65 | <form method="get" action="index.php"> | ||
66 | <div class="input-field nav-panel-search" style="display: none"> | ||
67 | <input name="search" id="searchfield" type="search" required placeholder="{% trans %}Enter your search here{% endtrans %}"> | ||
68 | <label for="search"><i class="mdi-action-search"></i></label> | ||
69 | <i class="mdi-navigation-close"></i> | ||
70 | </div> | ||
71 | </form> | ||
72 | <!--<form name="entry" method="post" action="{{ path('new_entry') }}"> | ||
73 | <div class="input-field nav-panel-add" style="display: none"> | ||
74 | <input id="add entry_url" name="entry[url]" type="search" required placeholder="{% trans %}Enter your link here{% endtrans %}"> | ||
75 | <label for="add"><i class="mdi-content-add"></i></label> | ||
76 | <i class="mdi-navigation-close"></i> | ||
77 | </div> | ||
78 | </form>--> | ||
79 | </div> | ||
80 | </nav> | ||
81 | {% endblock %} | ||
82 | |||
21 | {% block footer %} | 83 | {% block footer %} |
22 | <footer class="page-footer cyan darken-2"> | 84 | <footer class="page-footer cyan darken-2"> |
23 | <div class="container"> | 85 | <div class="container"> |
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 8ec83f89..25ec0bfc 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 | |||
@@ -69,7 +69,7 @@ nav, main, footer { | |||
69 | } | 69 | } |
70 | 70 | ||
71 | .nav-panels { | 71 | .nav-panels { |
72 | overflov: hidden; | 72 | overflow: hidden; |
73 | } | 73 | } |
74 | 74 | ||
75 | .nav-panel-buttom li { | 75 | .nav-panel-buttom li { |
@@ -80,6 +80,22 @@ nav, main, footer { | |||
80 | float: right; | 80 | float: right; |
81 | } | 81 | } |
82 | 82 | ||
83 | .nav-panels { | ||
84 | transition: background 0.2s ease; | ||
85 | } | ||
86 | |||
87 | .nav-panel-add .mdi-content-add, | ||
88 | .nav-panel-search .mdi-action-search, | ||
89 | .nav-panels .mdi-navigation-close { | ||
90 | color: #444 !important; | ||
91 | } | ||
92 | |||
93 | .nav-panels .action { | ||
94 | padding-left: 0.75rem; | ||
95 | font-size: 2.1rem; | ||
96 | white-space: nowrap; | ||
97 | } | ||
98 | |||
83 | /* ========================================================================== | 99 | /* ========================================================================== |
84 | 2 = Side-nav | 100 | 2 = Side-nav |
85 | ========================================================================== */ | 101 | ========================================================================== */ |
@@ -129,7 +145,8 @@ main ul.row { | |||
129 | } | 145 | } |
130 | 146 | ||
131 | .data .card .card-content { | 147 | .data .card .card-content { |
132 | min-height: 25em; | 148 | height: 22em; |
149 | overflow: hidden; | ||
133 | } | 150 | } |
134 | 151 | ||
135 | .card .card-content .card-title { | 152 | .card .card-content .card-title { |
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 b0f82c4b..eee3903e 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 | |||
@@ -10,19 +10,26 @@ $(document).ready(function(){ | |||
10 | // $(".nav-panel-buttom").hide(100); | 10 | // $(".nav-panel-buttom").hide(100); |
11 | // $(".nav-panel-add").show(100); | 11 | // $(".nav-panel-add").show(100); |
12 | // $(".nav-panel-menu").hide(100); | 12 | // $(".nav-panel-menu").hide(100); |
13 | // $(".nav-panels .action").hide(100); | ||
14 | // $(".nav-panel-menu").addClass('hidden'); | ||
15 | // $(".nav-panels").css('background', 'white'); | ||
13 | // return false; | 16 | // return false; |
14 | //}); | 17 | //}); |
15 | $('#nav-btn-search').click(function(){ | 18 | $('#nav-btn-search').click(function(){ |
16 | $(".nav-panel-buttom").hide(100); | 19 | $(".nav-panel-buttom").hide(100); |
17 | $(".nav-panel-search").show(100); | 20 | $(".nav-panel-search").show(100); |
21 | $(".nav-panels .action").hide(100); | ||
18 | $(".nav-panel-menu").addClass('hidden'); | 22 | $(".nav-panel-menu").addClass('hidden'); |
23 | $(".nav-panels").css('background', 'white'); | ||
19 | return false; | 24 | return false; |
20 | }); | 25 | }); |
21 | $('.mdi-navigation-close').click(function(){ | 26 | $('.mdi-navigation-close').click(function(){ |
22 | $(".nav-panel-add").hide(100); | 27 | $(".nav-panel-add").hide(100); |
23 | $(".nav-panel-search").hide(100); | 28 | $(".nav-panel-search").hide(100); |
24 | $(".nav-panel-buttom").show(100); | 29 | $(".nav-panel-buttom").show(100); |
30 | $(".nav-panels .action").show(100); | ||
25 | $(".nav-panel-menu").removeClass('hidden'); | 31 | $(".nav-panel-menu").removeClass('hidden'); |
32 | $(".nav-panels").css('background', 'transparent'); | ||
26 | return false; | 33 | return false; |
27 | }); | 34 | }); |
28 | }); \ No newline at end of file | 35 | }); \ No newline at end of file |