Add tabs to the different feeds
This commit is contained in:
parent
79348e06ff
commit
30cfd96e24
@ -780,3 +780,22 @@ figcaption {
|
|||||||
.avatar.padded {
|
.avatar.padded {
|
||||||
margin-right: 2rem;
|
margin-right: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** Tabs **/
|
||||||
|
|
||||||
|
.tabs {
|
||||||
|
border-bottom: 1px solid #DADADA;
|
||||||
|
padding: 0px;
|
||||||
|
margin: auto 20% 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs a {
|
||||||
|
display: inline-block;
|
||||||
|
color: #242424;
|
||||||
|
padding: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs a.selected {
|
||||||
|
color: #7765E3;
|
||||||
|
border-bottom: 1px solid #7765E3;
|
||||||
|
}
|
||||||
|
@ -8,6 +8,12 @@
|
|||||||
{% block content %}
|
{% block content %}
|
||||||
<h1>{{ "All the articles of the Fediverse" | _ }}</h1>
|
<h1>{{ "All the articles of the Fediverse" | _ }}</h1>
|
||||||
|
|
||||||
|
{% if account %}
|
||||||
|
{{ macros::tabs(links=['/', '/feed', '/federated', '/local'], titles=['Latest articles', 'Your feed', 'Federated feed', 'Local feed'], selected=3) }}
|
||||||
|
{% else %}
|
||||||
|
{{ macros::tabs(links=['/', '/federated', '/local'], titles=['Latest articles', 'Federated feed', 'Local feed'], selected=2) }}
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
<div class="cards">
|
<div class="cards">
|
||||||
{% for article in articles %}
|
{% for article in articles %}
|
||||||
{{ macros::post_card(article=article) }}
|
{{ macros::post_card(article=article) }}
|
||||||
|
@ -10,6 +10,8 @@
|
|||||||
{{ "Your feed" | _ }}
|
{{ "Your feed" | _ }}
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
|
{{ macros::tabs(links=['/', '/feed', '/federated', '/local'], titles=['Latest articles', 'Your feed', 'Federated feed', 'Local feed'], selected=2) }}
|
||||||
|
|
||||||
{% if articles | length > 0 %}
|
{% if articles | length > 0 %}
|
||||||
<div class="cards">
|
<div class="cards">
|
||||||
{% for article in articles %}
|
{% for article in articles %}
|
||||||
|
@ -8,7 +8,12 @@
|
|||||||
{% block content %}
|
{% block content %}
|
||||||
<h1>{{ "Welcome on {{ instance_name | escape }}" | _(instance_name=instance.name) }}</h1>
|
<h1>{{ "Welcome on {{ instance_name | escape }}" | _(instance_name=instance.name) }}</h1>
|
||||||
|
|
||||||
<h2>{{ "Latest articles" | _ }}</h2>
|
{% if account %}
|
||||||
|
{{ macros::tabs(links=['/', '/feed', '/federated', '/local'], titles=['Latest articles', 'Your feed', 'Federated feed', 'Local feed'], selected=1) }}
|
||||||
|
{% else %}
|
||||||
|
{{ macros::tabs(links=['/', '/federated', '/local'], titles=['Latest articles', 'Federated feed', 'Local feed'], selected=1) }}
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
<div class="cards">
|
<div class="cards">
|
||||||
{% for article in recents %}
|
{% for article in recents %}
|
||||||
{{ macros::post_card(article=article) }}
|
{{ macros::post_card(article=article) }}
|
||||||
|
@ -8,6 +8,12 @@
|
|||||||
{% block content %}
|
{% block content %}
|
||||||
<h1>{{ "Articles from {{ instance.name }}" | _(instance=instance) }}</h1>
|
<h1>{{ "Articles from {{ instance.name }}" | _(instance=instance) }}</h1>
|
||||||
|
|
||||||
|
{% if account %}
|
||||||
|
{{ macros::tabs(links=['/', '/feed', '/federated', '/local'], titles=['Latest articles', 'Your feed', 'Federated feed', 'Local feed'], selected=4) }}
|
||||||
|
{% else %}
|
||||||
|
{{ macros::tabs(links=['/', '/federated', '/local'], titles=['Latest articles', 'Federated feed', 'Local feed'], selected=3) }}
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
<div class="cards">
|
<div class="cards">
|
||||||
{% for article in articles %}
|
{% for article in articles %}
|
||||||
{{ macros::post_card(article=article) }}
|
{{ macros::post_card(article=article) }}
|
||||||
|
@ -63,3 +63,11 @@
|
|||||||
{% endfor %}
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
{% endmacro %}
|
{% endmacro %}
|
||||||
|
{% macro tabs(links, titles, selected) %}
|
||||||
|
<div class="tabs">
|
||||||
|
{% for link in links %}
|
||||||
|
{% set idx = loop.index0 %}
|
||||||
|
<a href="{{ link }}" {% if loop.index == selected %}class="selected"{% endif %}>{{ titles[idx] | _ }}</a>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
{% endmacro %}
|
||||||
|
Loading…
Reference in New Issue
Block a user