fixes for bulma not having good dark support

This commit is contained in:
Vivianne Langdon 2022-04-09 00:06:10 -07:00
parent d3992802f2
commit 64b623df32
5 changed files with 20 additions and 5 deletions

View file

@ -84,6 +84,13 @@ $progress-value-background-color: $border-light;
$family-primary: $family-sans-serif; $family-primary: $family-sans-serif;
$family-secondary: $family-sans-serif; $family-secondary: $family-sans-serif;
.has-text-muted {
color: $grey-lighter !important;
}
.has-text-more-muted {
color: $grey-light !important;
}
@import "../bookwyrm.scss"; @import "../bookwyrm.scss";
@import "../vendor/icons.css"; @import "../vendor/icons.css";

View file

@ -57,5 +57,13 @@ $invisible-overlay-background-color: rgba($scheme-invert, 0.66);
$family-primary: $family-sans-serif; $family-primary: $family-sans-serif;
$family-secondary: $family-sans-serif; $family-secondary: $family-sans-serif;
.has-text-muted {
color: $grey-dark !important;
}
.has-text-more-muted {
color: $grey !important;
}
@import "../bookwyrm.scss"; @import "../bookwyrm.scss";
@import "../vendor/icons.css"; @import "../vendor/icons.css";

View file

@ -47,12 +47,12 @@
{% block preview %} {% block preview %}
<div class="notification py-2 {% if notification.id in unread %}is-primary is-light{% else %}has-background-body has-text-grey-dark{% endif %}"> <div class="notification py-2 {% if notification.id in unread %}is-primary is-light{% else %}has-background-body has-text-muted{% endif %}">
<div class="columns"> <div class="columns">
<div class="column is-clipped"> <div class="column is-clipped">
{% include 'snippets/status_preview.html' with status=related_status %} {% include 'snippets/status_preview.html' with status=related_status %}
</div> </div>
<div class="column is-narrow has-grey-dark"> <div class="column is-narrow has-text-muted">
{{ related_status.published_date|timesince }} {{ related_status.published_date|timesince }}
{% include 'snippets/privacy-icons.html' with item=related_status %} {% include 'snippets/privacy-icons.html' with item=related_status %}
</div> </div>

View file

@ -47,12 +47,12 @@
{% block preview %} {% block preview %}
<div class="notification py-2 {% if notification.id in unread %}is-primary is-light{% else %}has-background-body has-text-grey-dark{% endif %}"> <div class="notification py-2 {% if notification.id in unread %}is-primary is-light{% else %}has-background-body has-text-muted{% endif %}">
<div class="columns"> <div class="columns">
<div class="column is-clipped"> <div class="column is-clipped">
{% include 'snippets/status_preview.html' with status=related_status %} {% include 'snippets/status_preview.html' with status=related_status %}
</div> </div>
<div class="column is-narrow has-grey-dark"> <div class="column is-narrow has-text-muted">
{{ related_status.published_date|timesince }} {{ related_status.published_date|timesince }}
{% include 'snippets/privacy-icons.html' with item=related_status %} {% include 'snippets/privacy-icons.html' with item=related_status %}
</div> </div>

View file

@ -1,7 +1,7 @@
{% load notification_page_tags %} {% load notification_page_tags %}
{% related_status notification as related_status %} {% related_status notification as related_status %}
<div class="notification {% if notification.id in unread %}has-background-primary{% endif %}"> <div class="notification {% if notification.id in unread %}has-background-primary{% endif %}">
<div class="columns is-mobile {% if notification.id in unread %}has-text-white{% else %}has-text-grey{% endif %}"> <div class="columns is-mobile {% if notification.id in unread %}has-text-white{% else %}has-text-more-muted{% endif %}">
<div class="column is-narrow is-size-3"> <div class="column is-narrow is-size-3">
<a class="icon" href="{% block primary_link %}{% endblock %}"> <a class="icon" href="{% block primary_link %}{% endblock %}">
{% block icon %}{% endblock %} {% block icon %}{% endblock %}