Skip to content

Commit 197fff3

Browse files
Lucas-CLucas-C
committed
Improve index.html tag filters
1 parent 4f7046c commit 197fff3

9 files changed

+61
-21
lines changed

static/bundle-SHARE-0-MG_FILTER_TAGS-0-SHORTSHA1-8766284.js renamed to static/bundle-SHARE-0-MG_FILTER_TAGS-0-SHORTSHA1-bb3786a.js

File renamed without changes.

static/bundle-SHARE-0-MG_FILTER_TAGS-1-SHORTSHA1-8766284.js renamed to static/bundle-SHARE-0-MG_FILTER_TAGS-1-SHORTSHA1-bb3786a.js

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

static/bundle-SHARE-1-MG_FILTER_TAGS-0-SHORTSHA1-8766284.js renamed to static/bundle-SHARE-1-MG_FILTER_TAGS-0-SHORTSHA1-bb3786a.js

File renamed without changes.

static/bundle-SHARE-1-MG_FILTER_TAGS-1-SHORTSHA1-8766284.js renamed to static/bundle-SHARE-1-MG_FILTER_TAGS-1-SHORTSHA1-bb3786a.js

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

static/bundle-SHORTSHA1-e331880.css renamed to static/bundle-SHORTSHA1-e129ad2.css

Lines changed: 6 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎static/js/filter-tags.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -79,9 +79,11 @@
7979
lang = newLang || globalThis.langs[langs.indexOf(lang) + 1];
8080
if (lang === undefined) {
8181
lang = 'lang';
82+
this.classList.remove('mg-tag-filter-include');
8283
this.title = 'Language filter (disabled)';
8384
} else {
8485
globalThis.tagFilters[`lang:${ lang }`] = true;
86+
this.classList.add('mg-tag-filter-include');
8587
this.title = `Language filter (include only "${ lang }" articles)`;
8688
}
8789
this.textContent = lang;

‎static/main.css‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,6 @@ a, a > code, a > em, a > strong {
118118
flex: 1;
119119
display: flex;
120120
justify-content: flex-end; }
121-
122121
.mg-tag-filters {
123122
list-style-type: none;
124123
display: flex;
@@ -140,6 +139,12 @@ a, a > code, a > em, a > strong {
140139
background-color: #33b5e5; }
141140
.mg-tag-filter-exclude {
142141
background-color: #ff9148; }
142+
.uk-nav-offcanvas .mg-header-extra {
143+
justify-content: center; }
144+
.uk-nav-offcanvas .mg-tag-filters {
145+
flex-direction: column; }
146+
.uk-nav-offcanvas .mg-tag-filter {
147+
color: #fff; }
143148

144149
.mg-nav-small {
145150
display: flex;

‎templates/base.html‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@
7777
<link rel="token_endpoint" href="https://tokens.indieauth.com/token">
7878
{% endif %}
7979

80-
<link rel="stylesheet" type="text/css" href="{{SITEURL}}/theme/bundle-SHORTSHA1-e331880.css">
80+
<link rel="stylesheet" type="text/css" href="{{SITEURL}}/theme/bundle-SHORTSHA1-e129ad2.css">
8181
</head>
8282
<body>
8383
<!--[if lt IE 7]>
@@ -100,7 +100,7 @@
100100
</ul>
101101

102102
<div class="mg-header-extra uk-hidden-small">
103-
{% block header_extra %}
103+
{% block large_header_extra %}
104104
{% endblock %}
105105
</div>
106106

@@ -279,6 +279,9 @@ <h3 class="uk-panel-title">Blogroll</h3>
279279
{% endif %}
280280

281281
<ul class="uk-nav uk-nav-offcanvas" data-uk-nav>
282+
{% block small_menu_extra %}
283+
{% endblock %}
284+
282285
{% if CATEGORY_SAVE_AS %}
283286
<li class="uk-nav-header">Categories</li>
284287
{% for cat, _ in categories %}
@@ -360,7 +363,7 @@ <h3 class="uk-panel-title">Blogroll</h3>
360363
</aside>
361364

362365
<!-- Data attributes are used by: https://github.com/PlaidWeb/webmention.js -->
363-
<script src="{{SITEURL}}/theme/bundle-SHARE-{{SHARE|string|first|length|string|first}}-MG_FILTER_TAGS-{{MG_FILTER_TAGS|string|first|length|string|first}}-SHORTSHA1-8766284.js" data-prevent-spoofing="true"></script>
366+
<script src="{{SITEURL}}/theme/bundle-SHARE-{{SHARE|string|first|length|string|first}}-MG_FILTER_TAGS-{{MG_FILTER_TAGS|string|first|length|string|first}}-SHORTSHA1-bb3786a.js" data-prevent-spoofing="true"></script>
364367

365368
{% if MG_JOKES %}
366369
<script>

‎templates/index.html‎

Lines changed: 37 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -2,22 +2,43 @@
22

33
{% block header_text %}<h1>{{ super() }}</h1>{% endblock %}
44

5-
{% block header_extra %}
6-
{% if MG_LANG_FILTER_TAGS or MG_FILTER_TAGS %}
7-
<script>
8-
window.langs = {{ MG_LANG_FILTER_TAGS|tojson }};
9-
</script>
10-
<ul class="mg-tag-filters">
11-
{% if MG_LANG_FILTER_TAGS %}
12-
<li><button type="button" id="lang-tag-filter" class="mg-tag-filter" onclick='toggleLangTagFilter.bind(this)()' title="Language filter (disabled)">lang</button></li>
13-
{% endif %}
14-
{% if MG_FILTER_TAGS %}
15-
{% for filter_tag in MG_FILTER_TAGS %}
16-
<li><button type="button" id="{{ filter_tag }}-tag-filter" class="mg-tag-filter" onclick="toggleTagFilter.bind(this)('{{ filter_tag }}')" title="Tag filter (disabled)">{{ filter_tag }}</button></li>
17-
{% endfor %}
18-
</ul>
19-
{% endif %}
20-
{% endif %}
5+
{% block large_header_extra %}
6+
{% if MG_LANG_FILTER_TAGS or MG_FILTER_TAGS %}
7+
<script>
8+
window.langs = {{ MG_LANG_FILTER_TAGS|tojson }};
9+
</script>
10+
<ul class="mg-tag-filters">
11+
{% if MG_LANG_FILTER_TAGS %}
12+
<li><button type="button" id="lang-tag-filter" class="mg-tag-filter" onclick='toggleLangTagFilter.bind(this)()' title="Language filter (disabled)">lang</button></li>
13+
{% endif %}
14+
{% if MG_FILTER_TAGS %}
15+
{% for filter_tag in MG_FILTER_TAGS %}
16+
<li><button type="button" id="{{ filter_tag }}-tag-filter" class="mg-tag-filter" onclick="toggleTagFilter.bind(this)('{{ filter_tag }}')" title="Tag filter (disabled)">{{ filter_tag }}</button></li>
17+
{% endfor %}
18+
</ul>
19+
{% endif %}
20+
{% endif %}
21+
{% endblock %}
22+
23+
{% block small_menu_extra %}
24+
{% if MG_LANG_FILTER_TAGS or MG_FILTER_TAGS %}
25+
<script>
26+
window.langs = {{ MG_LANG_FILTER_TAGS|tojson }};
27+
</script>
28+
<li class="uk-nav-header">Filtres par tags</li>
29+
<div class="mg-header-extra">
30+
<ul class="mg-tag-filters">
31+
{% if MG_LANG_FILTER_TAGS %}
32+
<li><button type="button" id="lang-tag-filter" class="mg-tag-filter" onclick='toggleLangTagFilter.bind(this)()' title="Language filter (disabled)">lang</button></li>
33+
{% endif %}
34+
{% if MG_FILTER_TAGS %}
35+
{% for filter_tag in MG_FILTER_TAGS %}
36+
<li><button type="button" id="{{ filter_tag }}-tag-filter" class="mg-tag-filter" onclick="toggleTagFilter.bind(this)('{{ filter_tag }}')" title="Tag filter (disabled)">{{ filter_tag }}</button></li>
37+
{% endfor %}
38+
</ul>
39+
{% endif %}
40+
</div>
41+
{% endif %}
2142
{% endblock %}
2243

2344
{% block desc_header %}

0 commit comments

Comments
 (0)