Add CSS to invert Matrix and Mattermost logos in dark mode

This commit is contained in:
Pēteris Caune 2021-07-05 17:55:13 +03:00
parent 92a9910092
commit c94e39c9d3
No known key found for this signature in database
GPG Key ID: E28D7679E9A9EDE2
2 changed files with 11 additions and 3 deletions

View File

@ -235,3 +235,11 @@ table.channels-table > tbody > tr > th {
.channel-modal .modal-body { .channel-modal .modal-body {
padding: 15px 40px; padding: 15px 40px;
} }
body.dark .icon.mattermost {
filter: invert();
}
body.dark .icon.matrix {
filter: invert();
}

View File

@ -30,7 +30,7 @@
<tr class="channel-row kind-{{ ch.kind }}"> <tr class="channel-row kind-{{ ch.kind }}">
<td class="icon-cell"> <td class="icon-cell">
<img src="{% static ch.icon_path %}" <img src="{% static ch.icon_path %}"
class="icon" class="icon {{ ch.kind }}"
alt="{{ ch.get_kind_display }} icon" /> alt="{{ ch.get_kind_display }} icon" />
</td> </td>
<td> <td>
@ -263,7 +263,7 @@
{% if enable_matrix %} {% if enable_matrix %}
<li> <li>
<img src="{% static 'img/integrations/matrix.png' %}" <img src="{% static 'img/integrations/matrix.png' %}"
class="icon" alt="Matrix icon" /> class="icon matrix" alt="Matrix icon" />
<h2>Matrix</h2> <h2>Matrix</h2>
<p>Post notifications to a Matrix room.</p> <p>Post notifications to a Matrix room.</p>
@ -274,7 +274,7 @@
{% if enable_mattermost %} {% if enable_mattermost %}
<li> <li>
<img src="{% static 'img/integrations/mattermost.png' %}" <img src="{% static 'img/integrations/mattermost.png' %}"
class="icon" alt="Mattermost icon" /> class="icon mattermost" alt="Mattermost icon" />
<h2>Mattermost</h2> <h2>Mattermost</h2>
<p>High Trust Messaging for the Enterprise.</p> <p>High Trust Messaging for the Enterprise.</p>