Merge pull request #1651 from bookwyrm-social/feed-settings-style

Creates consistent styling for details element
This commit is contained in:
Mouse Reeve 2021-12-04 11:29:20 -08:00 committed by GitHub
commit 18f7863eac
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 59 additions and 39 deletions

View file

@ -115,6 +115,21 @@ input[type=file]::file-selector-button:hover {
color: #363636;
}
summary::marker {
content: none;
}
.detail-pinned-button summary {
position: absolute;
right: 0;
}
.detail-pinned-button form {
float: left;
width: -webkit-fill-available;
margin-top: 1em;
}
/** Shelving
******************************************************************************/

View file

@ -6,6 +6,8 @@
<h1 class="title">
{{ tab.name }}
</h1>
<div class="block is-clipped">
<div class="is-pulled-left">
<div class="tabs">
<ul>
{% for stream in streams %}
@ -15,18 +17,20 @@
{% endfor %}
</ul>
</div>
</div>
{# feed settings #}
<details class="mb-5" {% if settings_saved %}open{% endif %}>
<summary>
<span class="has-text-weight-bold">
{{ _("Feed settings") }}
<details class="detail-pinned-button" {% if settings_saved %}open{% endif %}>
<summary class="control">
<span class="button">
<span class="icon icon-dots-three m-0-mobile" aria-hidden="true"></span>
<span class="is-sr-only-mobile">{{ _("Feed settings") }}</span>
</span>
{% if settings_saved %}
<span class="tag is-success is-light ml-2">{{ _("Saved!") }}</span>
{% endif %}
</summary>
<form class="level is-align-items-flex-end" method="post" action="/{{ tab.key }}#feed">
<form class="notification level is-align-items-flex-end" method="post" action="/{{ tab.key }}#feed">
{% csrf_token %}
<div class="level-left">
@ -49,6 +53,7 @@
</div>
</form>
</details>
</div>
{# announcements and system messages #}
{% if not activities.number > 1 %}