From 65c4ad141a43c46300b85ab2a39a3dde6ef050b2 Mon Sep 17 00:00:00 2001 From: Tomoyuki Aota Date: Fri, 13 Dec 2024 03:13:49 +0900 Subject: [PATCH] Indicate that the text is clickable by showing underline. This is simlar to the Google Search results. --- .../thumbnail-generation-status-bar.component.scss | 3 --- src/styles/_anchor-tag-like-text.scss | 6 +++++- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/src/app/thumbnail-generation/status-bar/component/thumbnail-generation-status-bar.component.scss b/src/app/thumbnail-generation/status-bar/component/thumbnail-generation-status-bar.component.scss index 351861a8..4524d52c 100644 --- a/src/app/thumbnail-generation/status-bar/component/thumbnail-generation-status-bar.component.scss +++ b/src/app/thumbnail-generation/status-bar/component/thumbnail-generation-status-bar.component.scss @@ -24,9 +24,6 @@ .anchor-tag-like-text { @include anchor-tag-like-text; - &:hover { - filter: brightness(50%); // To indicate that the text is clickable. Usually, changing the mouse cursor to "pointer" serves the purpose, but it's fixed to "pointer" due to .progress-bar-with-details. - } } .progress-bar-with-details { diff --git a/src/styles/_anchor-tag-like-text.scss b/src/styles/_anchor-tag-like-text.scss index 15a2857a..1cdbc016 100644 --- a/src/styles/_anchor-tag-like-text.scss +++ b/src/styles/_anchor-tag-like-text.scss @@ -2,7 +2,11 @@ @mixin anchor-tag-like-text { color: -webkit-link; cursor: pointer; - text-decoration: underline; + text-decoration: none; + + &:hover { + text-decoration: underline; // To indicate that the text is clickable. + } &:active { color: -webkit-activelink;