From f4a1401de0d6d39521d47a69c9379d4780a07bca Mon Sep 17 00:00:00 2001
From: Kevin Decherf <kevin@kdecherf.com>
Date: Mon, 13 Jul 2020 18:53:39 +0200
Subject: [PATCH] Reduce opacity of archived entries on tag view

Fixes #4466

Signed-off-by: Kevin Decherf <kevin@kdecherf.com>
---
 app/Resources/static/themes/material/css/cards.scss         | 5 +++++
 .../views/themes/material/Entry/_card_full_image.html.twig  | 2 +-
 .../views/themes/material/Entry/_card_list.html.twig        | 2 +-
 .../views/themes/material/Entry/_card_preview.html.twig     | 2 +-
 .../Resources/views/themes/material/Entry/entries.html.twig | 6 +++---
 5 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/app/Resources/static/themes/material/css/cards.scss b/app/Resources/static/themes/material/css/cards.scss
index 80c9f253c..966510185 100644
--- a/app/Resources/static/themes/material/css/cards.scss
+++ b/app/Resources/static/themes/material/css/cards.scss
@@ -293,6 +293,11 @@ a.original:not(.waves-effect) {
   }
 }
 
+.card.archived,
+.card-stacked.archived {
+  opacity: 0.5;
+}
+
 #content .collection .collection-item {
   min-height: 65px;
   height: auto;
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_full_image.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_full_image.html.twig
index ceb953819..1b1b4acb8 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_full_image.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_full_image.html.twig
@@ -1,4 +1,4 @@
-<div class="card">
+<div class="card{% if currentRoute == 'tag_entries' and entry.isArchived %} archived{% endif %}">
     <div class="card-body">
         <div class="card-fullimage">
             <ul class="card-entry-labels">
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_list.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_list.html.twig
index cb2f6f74a..470343f11 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_list.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_list.html.twig
@@ -1,4 +1,4 @@
-<div class="card-stacked">
+<div class="card-stacked{% if currentRoute == 'tag_entries' and entry.isArchived %} archived{% endif %}">
     {% include "@WallabagCore/themes/material/Entry/Card/_mass_checkbox.html.twig" with {'entry': entry} only %}
     <div class="card-preview">
         <a href="{{ path('view', { 'id': entry.id }) }}">
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_preview.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_preview.html.twig
index 581a1813b..e3be798f0 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_preview.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/_card_preview.html.twig
@@ -1,4 +1,4 @@
-<div class="card">
+<div class="card{% if currentRoute == 'tag_entries' and entry.isArchived %} archived{% endif %}">
     <div class="card-body">
         <div class="card-image waves-effect waves-block waves-light">
             <ul class="card-entry-labels">
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig
index 526e3cbb0..bc148f085 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig
@@ -57,11 +57,11 @@
         {% for entry in entries %}
             <li id="entry-{{ entry.id|e }}" class="entry col {% if listMode == 0 %}l3 m6{% else %}collection-item{% endif %} s12">
                 {% if listMode == 1 %}
-                    {% include "@WallabagCore/themes/material/Entry/_card_list.html.twig" with {'entry': entry} only %}
+                    {% include "@WallabagCore/themes/material/Entry/_card_list.html.twig" with {'entry': entry, 'currentRoute': currentRoute} only %}
                 {% elseif not entry.previewPicture is null and entry.mimetype starts with 'image/' %}
-                    {% include "@WallabagCore/themes/material/Entry/_card_full_image.html.twig" with {'entry': entry} only %}
+                    {% include "@WallabagCore/themes/material/Entry/_card_full_image.html.twig" with {'entry': entry, 'currentRoute': currentRoute} only %}
                 {% else %}
-                    {% include "@WallabagCore/themes/material/Entry/_card_preview.html.twig" with {'entry': entry} only %}
+                    {% include "@WallabagCore/themes/material/Entry/_card_preview.html.twig" with {'entry': entry, 'currentRoute': currentRoute} only %}
                 {% endif %}
             </li>
         {% endfor %}