From 95abe6b8fdf6f33f4dc5128d94b5a5b0b6730fed Mon Sep 17 00:00:00 2001
From: Helen Chong <119173961+helenclx@users.noreply.github.com>
Date: Sat, 13 Jul 2024 01:00:59 +0800
Subject: [PATCH] Adjust exter link icon in link buttons

---
 src/assets/css/components.css | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/assets/css/components.css b/src/assets/css/components.css
index 48a09092..eaf782af 100644
--- a/src/assets/css/components.css
+++ b/src/assets/css/components.css
@@ -62,11 +62,12 @@
 }
 
 .link-btn {
+    --btn-right-padding: 0.8em;
     text-align: center;
     display: inline-block;
     border: 0.1em solid var(--clr-link-btn-bg);
     border-radius: 0.5em;
-    padding: 0.4em 0.8em;
+    padding: 0.4em var(--btn-right-padding);
     background: var(--clr-link-btn-bg);
     color: var(--clr-link-btn-txt);
     font-weight: 700;
@@ -86,6 +87,9 @@
     outline-offset: -0.25em;
 }
 
+.link-btn[href^="http"] { padding-right: calc(var(--btn-right-padding) + 1.1em); }
+.link-btn[href^="http"]::after { background-color: var(--clr-link-btn-txt); }
+
 /* Content Accordion */
 * + .content-accordion { margin-top: var(--sz-paragraph-margin); }
 .content-accordion { padding: 0.5em 0; }