From d919f833f1c2797d6e2e3fbfd0b1de97b8dc1cf8 Mon Sep 17 00:00:00 2001
From: Cotes Chung <11371340+cotes2020@users.noreply.github.com>
Date: Thu, 9 Dec 2021 20:45:20 +0800
Subject: [PATCH] Show heading anchor on touch devices

---
 _sass/addon/commons.scss |  2 +-
 _sass/addon/module.scss  | 23 ++++++++++++++---------
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/_sass/addon/commons.scss b/_sass/addon/commons.scss
index 438193a..9683c67 100644
--- a/_sass/addon/commons.scss
+++ b/_sass/addon/commons.scss
@@ -62,7 +62,7 @@ h2 {
 h3 {
   @extend %heading;
   @extend %section;
-  @extend %anchor-relative;
+  @extend %anchor;
 
   font-size: 1.2rem;
 }
diff --git a/_sass/addon/module.scss b/_sass/addon/module.scss
index da4bf1e..9f705a8 100644
--- a/_sass/addon/module.scss
+++ b/_sass/addon/module.scss
@@ -19,19 +19,24 @@
 
 %anchor {
   > a {
-    font-size: 70%;
-    visibility: hidden;
+    font-size: 1rem;
     margin-left: 0.5rem;
-    border-bottom: none !important;
-    opacity: 0;
-    transition: opacity 0.25s ease-in, visibility 0s ease-in 0.25s;
   }
 
-  &:hover {
+  @media (hover: hover) {
     > a {
-      visibility: visible;
-      opacity: 1;
-      transition: opacity 0.25s ease-in, visibility 0s ease-in 0s;
+      border-bottom: none !important;
+      visibility: hidden;
+      opacity: 0;
+      transition: opacity 0.25s ease-in, visibility 0s ease-in 0.25s;
+    }
+
+    &:hover {
+      > a {
+        visibility: visible;
+        opacity: 1;
+        transition: opacity 0.25s ease-in, visibility 0s ease-in 0s;
+      }
     }
   }
 }