mirrors/bookwyrm
1
0
Fork 1
mirror of https://github.com/bookwyrm-social/bookwyrm.git synced 2024-06-22 06:50:39 +00:00
Code Issues Projects Releases Wiki Activity

chore: use bulma override for mobile dropdown instead of classes

Browse source
This commit is contained in:
Dustin Steiner 2023-01-31 18:33:44 +00:00
parent f30a0ae714
commit 96097f3b58
No known key found for this signature in database
GPG key ID: 918D51522D8CB8F2
5 changed files with 75 additions and 69 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

120
bookwyrm/static/css/bookwyrm/overrides/_bulma_overrides.scss
View file

@ -1,111 +1,117 @@
.summary-on-open {
display: none;
display: none;
}
@media only screen and (max-width: 768px) {
.navbar-menu {
text-align: right;
padding-right: 1rem;
.navbar-menu {
text-align: right;
padding-right: 1rem;
.tags {
justify-content: flex-end;
}
.tags {
justify-content: flex-end;
}
#navbar-dropdown {
&[open] {
.summary-on-open {
display: initial;
position: fixed;
top: 0;
left: 0;
right: 0;
height: 3rem;
z-index: 31;
background-color: $dropdown-content-background-color;
padding: 1rem 1.75rem;
line-height: 1;
}
}
#navbar-dropdown {
&[open] {
.summary-on-open {
display: initial;
position: fixed;
top: 0;
left: 0;
right: 0;
height: 3rem;
z-index: 31;
background-color: $dropdown-content-background-color;
padding: 1rem 1.75rem;
line-height: 1;
}
}
.dropdown-menu {
padding-top: 0;
top: 3rem;
}
.dropdown-menu {
padding-top: 0;
top: 3rem;
}
.dropdown-content {
padding-top: 0;
box-shadow: none;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.dropdown-content {
padding-top: 0;
box-shadow: none;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.navbar-item {
// see ../components/_details.scss :: Navbar details
padding-right: 1.75rem;
font-size: 1rem;
}
}
}
.navbar-item {
// see ../components/_details.scss :: Navbar details
padding-right: 1.75rem;
font-size: 1rem;
}
}
}
}
.image {
overflow: hidden;
overflow: hidden;
}
.navbar .logo {
max-height: 50px;
max-height: 50px;
}
.card {
overflow: visible;
overflow: visible;
}
.card.has-border {
border: 1px solid $border;
border: 1px solid $border;
}
.scroll-x {
overflow: hidden;
overflow-x: auto;
overflow: hidden;
overflow-x: auto;
}
.modal-card {
pointer-events: none;
pointer-events: none;
}
.modal-card > * {
pointer-events: all;
pointer-events: all;
}
/* stylelint-disable no-descending-specificity */
.modal-card:focus {
outline-style: auto;
outline-style: auto;
}
.modal-card:focus:not(:focus-visible) {
outline-style: initial;
outline-style: initial;
}
.modal-card:focus-visible {
outline-style: auto;
outline-style: auto;
}
/* stylelint-enable no-descending-specificity */
.modal-card.is-fullwidth {
min-width: 75% !important;
min-width: 75% !important;
}
@media only screen and (min-width: 769px) {
.modal-card.is-thin {
width: 350px !important;
}
.modal-card.is-thin {
width: 350px !important;
}
}
.modal-card-body {
max-height: 70vh;
max-height: 70vh;
}
.clip-text {
max-height: 35em;
overflow: hidden;
max-height: 35em;
overflow: hidden;
}
@include mobile {
.dropdown-menu .button {
font-size: $size-6;
}
}

6
bookwyrm/templates/snippets/shelf_selector.html
View file

@ -31,7 +31,7 @@
</li>
{% else%}
{% comparison_bool shelf.identifier active_shelf.shelf.identifier as is_current %}
{% with button_class="is-fullwidth is-small is-size-6-mobile shelf-option is-radiusless has-background-body" %}
{% with button_class="is-fullwidth is-small shelf-option is-radiusless has-background-body" %}
<li role="menuitem" class="dropdown-item p-0">
{% if shelf.identifier == 'reading' %}
@ -77,7 +77,7 @@
{% csrf_token %}
<input type="hidden" name="book" value="{{ book.id }}">
<input type="hidden" name="shelf" value="{{ user_shelf.id }}">
<button class="button is-fullwidth is-small is-size-6-mobile is-radiusless is-danger is-light" type="submit">
<button class="button is-fullwidth is-small is-radiusless is-danger is-light" type="submit">
{% blocktrans with name=user_shelf|translate_shelf_name %}Remove from {{ name }}{% endblocktrans %}
</button>
</form>
@ -91,7 +91,7 @@
{% csrf_token %}
<input type="hidden" name="book" value="{{ book.id }}">
<input type="hidden" name="shelf" value="{{ shelf.id }}">
<button class="button is-fullwidth is-small is-size-6-mobile is-radiusless is-danger is-light" type="submit">{% trans "Remove from" %} {{ shelf.name }}</button>
<button class="button is-fullwidth is-small is-radiusless is-danger is-light" type="submit">{% trans "Remove from" %} {{ shelf.name }}</button>
</form>
</li>
{% endif %}

2
bookwyrm/templates/snippets/shelve_button/shelve_button_dropdown.html
View file

@ -7,5 +7,5 @@
{% endblock %}
{% block dropdown-list %}
{% include 'snippets/shelve_button/shelve_button_dropdown_options.html' with active_shelf=active_shelf shelves=user_shelves dropdown=True class="shelf-option is-fullwidth is-small is-size-6-mobile is-radiusless has-background-body" %}
{% include 'snippets/shelve_button/shelve_button_dropdown_options.html' with active_shelf=active_shelf shelves=user_shelves dropdown=True class="shelf-option is-fullwidth is-small is-radiusless has-background-body" %}
{% endblock %}

10
bookwyrm/templates/snippets/status/status_options.html
View file

@ -13,7 +13,7 @@
<li role="menuitem" class="dropdown-item p-0">
<form name="delete-{{ status.id|uuid }}" action="/delete-status/{{ status.id }}" method="post">
{% csrf_token %}
<button class="button is-radiusless is-danger is-light is-fullwidth is-small is-size-6-mobile" type="submit">
<button class="button is-radiusless is-danger is-light is-fullwidth is-small" type="submit">
{% trans "Delete status" %}
</button>
</form>
@ -21,7 +21,7 @@
{% if status.status_type != 'GeneratedNote' and status.status_type != 'Rating' %}
<li role="menuitem" class="dropdown-item p-0">
<span class="control">
<a href="{% url 'edit-status' status.id %}" class="button is-radiusless is-fullwidth is-small is-size-6-mobile" type="submit">
<a href="{% url 'edit-status' status.id %}" class="button is-radiusless is-fullwidth is-small" type="submit">
{% trans "Edit" %}
</a>
</span>
@ -31,16 +31,16 @@
{# things you can do to other people's statuses #}
<li role="menuitem" class="dropdown-item p-0">
<span class="control">
<a href="{% url 'direct-messages-user' status.user|username %}" class="button is-small has-background-body is-radiusless is-fullwidth is-size-6-mobile">
<a href="{% url 'direct-messages-user' status.user|username %}" class="button is-small has-background-body is-radiusless is-fullwidth">
{% trans "Send direct message" %}
</a>
</span>
</li>
<li role="menuitem" class="dropdown-item p-0">
{% include 'snippets/report_button.html' with user=status.user status=status class="is-size-6-mobile" %}
{% include 'snippets/report_button.html' with user=status.user status=status %}
</li>
<li role="menuitem" class="dropdown-item p-0">
{% include 'snippets/block_button.html' with user=status.user class="is-fullwidth is-size-6-mobile" blocks=False %}
{% include 'snippets/block_button.html' with user=status.user class="is-fullwidth" blocks=False %}
</li>
{% endif %}
{% endblock %}

6
bookwyrm/templates/snippets/user_options.html
View file

@ -11,13 +11,13 @@
{% block dropdown-list %}
<li role="menuitem">
<div class="control">
<a href="{% url 'direct-messages-user' user|username %}" class="button is-fullwidth is-small is-size-6-mobile">{% trans "Send direct message" %}</a>
<a href="{% url 'direct-messages-user' user|username %}" class="button is-fullwidth is-small">{% trans "Send direct message" %}</a>
</div>
</li>
<li role="menuitem">
{% include 'snippets/report_button.html' with user=user class="is-fullwidth is-size-6-mobile" %}
{% include 'snippets/report_button.html' with user=user class="is-fullwidth" %}
</li>
<li role="menuitem">
{% include 'snippets/block_button.html' with user=user class="is-fullwidth is-size-6-mobile" blocks=False %}
{% include 'snippets/block_button.html' with user=user class="is-fullwidth" blocks=False %}
</li>
{% endblock %}