[COMPONENTS][LeftPanel] Edit feeds page polish, existing links are shown in a grid, saving space

[COMPONENTS][Collection] Fixing details summary class [PLUGINS][WebMonetization] Fixing widget details summary class
This commit is contained in:
Eliseu Amaro 2022-01-21 19:51:13 +00:00 committed by Diogo Peralta Cordeiro
parent 402300fe93
commit 3d9edd1db8
Signed by: diogo
GPG Key ID: 18D2D35001FBFAB0
4 changed files with 37 additions and 24 deletions

View File

@ -1,6 +1,6 @@
<section class="frame-section collections"> <section class="frame-section collections">
<details class="section-details-title" title="Expand if you want to access more options."> <details class="section-details-title" title="Expand if you want to access more options.">
<summary class="details-title-summary"> <summary class="details-summary-title">
<h2>{{ctitle}}</h2> <h2>{{ctitle}}</h2>
</summary> </summary>
{% if has_collections %} {% if has_collections %}
@ -8,9 +8,9 @@
{{ form(add_form) }} {{ form(add_form) }}
</section> </section>
<details class="section-details-subtitle frame-section-padding" <details class="frame-section-padding section-details-subtitle"
title="Expand if you want to access more options."> title="Expand if you want to access more options.">
<summary class="details-subtitle-summary"> <summary class="details-summary-subtitle">
<strong>{% trans %}Other options{% endtrans %}</strong> <strong>{% trans %}Other options{% endtrans %}</strong>
</summary> </summary>
<section class="section-form"> <section class="section-form">

View File

@ -5,36 +5,49 @@
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css"> <link rel="stylesheet" href="{{ asset('assets/default_theme/css/pages/feeds.css') }}" type="text/css">
{% endblock stylesheets %} {% endblock stylesheets %}
{% macro edit_feeds_form_row(child) %}
<div class="form-row">
{{ form_label(child) }}
{{ form_widget(child) }}
</div>
{% endmacro %}
{% block body %} {% block body %}
<div class="frame-section"> <div class="frame-section">
<form class="section-form" action="{{ path('edit_feeds') }}" method="post"> <form class="section-form" action="{{ path('edit_feeds') }}" method="post">
<h1 class="frame-section-title">{{ "Edit feed navigation links" | trans }}</h1>
<fieldset>
<legend class="section-form-legend">{{ "Edit feed navigation links" | trans }}</legend>
{# Since the form is not separated into individual groups, this happened #} {# Since the form is not separated into individual groups, this happened #}
{{ form_start(edit_feeds) }} {{ form_start(edit_feeds) }}
{{ form_errors(edit_feeds) }} {{ form_errors(edit_feeds) }}
{% for child in edit_feeds.children %} <section class="container-grid">
{% if 'row_url' in child.vars.block_prefixes %} {% for child in edit_feeds.children %}
<div class="frame-section frame-section-padding"> {% if 'row_url' in child.vars.block_prefixes %}
{{ form_label(child) }} <div class="frame-section frame-section-padding">
{{ form_widget(child) }} {{ _self.edit_feeds_form_row(child) }}
{% elseif 'row_title' in child.vars.block_prefixes %} {% elseif 'row_title' in child.vars.block_prefixes %}
{{ form_label(child) }} {{ _self.edit_feeds_form_row(child) }}
{{ form_widget(child) }}
{% elseif 'row_order' in child.vars.block_prefixes %} {% elseif 'row_order' in child.vars.block_prefixes %}
{{ form_label(child) }} {{ _self.edit_feeds_form_row(child) }}
{{ form_widget(child) }}
{% elseif 'row_remove' in child.vars.block_prefixes %} {% elseif 'row_remove' in child.vars.block_prefixes %}
{{ form_label(child) }} {{ _self.edit_feeds_form_row(child) }}
{{ form_widget(child) }} </div>
</div> {% endif %}
{% endif %} {% endfor %}
{% endfor %} </section>
<div class="form-row">
{{ form_row(edit_feeds.update_exisiting) }}
{{ form_row(edit_feeds.reset) }}
</div>
<hr>
<section class="frame-section frame-section-padding">
<h2>{% trans %}Add a new feed{% endtrans %}</h2>
{{ form_rest(edit_feeds) }}
</section>
{{ form_end(edit_feeds) }} {{ form_end(edit_feeds) }}
</fieldset>
</form> </form>
</div> </div>

View File

@ -1,6 +1,6 @@
<section class="frame-section"> <section class="frame-section">
<details class="section-details-title" title="Expand if you want to access more options."> <details class="section-details-title" title="Expand if you want to access more options.">
<summary class="details-title-summary"> <summary class="details-summary-title">
<h2>Web Monetization</h2> <h2>Web Monetization</h2>
</summary> </summary>
<section class="section-form"> <section class="section-form">

View File

@ -57,7 +57,7 @@
.container-grid { .container-grid {
display: grid; display: grid;
gap: 10px; gap: var(--s);
grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
} }