From 2eca674fd27473f0871f44c3fe0fa054d97d8ea4 Mon Sep 17 00:00:00 2001
From: developomp <developomp@gmail.com>
Date: Thu, 29 Jun 2023 14:14:42 +0900
Subject: [PATCH] refactor(blog): use scroll margin

---
 apps/blog/src/styles/anchor.ts      | 2 --
 apps/blog/src/styles/globalStyle.ts | 1 +
 apps/blog/src/styles/header.ts      | 3 ++-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/apps/blog/src/styles/anchor.ts b/apps/blog/src/styles/anchor.ts
index 2c43c18..824a09e 100644
--- a/apps/blog/src/styles/anchor.ts
+++ b/apps/blog/src/styles/anchor.ts
@@ -19,7 +19,6 @@ export default css`
 	a.header-anchor {
 		/* compensate for navbar height*/
 		display: inline-block;
-		margin-top: 4.5rem;
 
 		color: ${(props) => props.theme.theme.component.anchor.color.header};
 	}
@@ -27,6 +26,5 @@ export default css`
 	/* footnote anchors */
 	a[id^="fnref"] {
 		display: inline;
-		padding-top: 4.5rem;
 	}
 `
diff --git a/apps/blog/src/styles/globalStyle.ts b/apps/blog/src/styles/globalStyle.ts
index 46c62b6..9d81708 100644
--- a/apps/blog/src/styles/globalStyle.ts
+++ b/apps/blog/src/styles/globalStyle.ts
@@ -50,6 +50,7 @@ const globalCSS = css`
 	* {
 		transition: color 0.1s linear;
 		scroll-behavior: smooth;
+		scroll-margin: 4rem;
 	}
 `
 
diff --git a/apps/blog/src/styles/header.ts b/apps/blog/src/styles/header.ts
index fea6731..ecf6195 100644
--- a/apps/blog/src/styles/header.ts
+++ b/apps/blog/src/styles/header.ts
@@ -7,7 +7,8 @@ export default css`
 	h4,
 	h5,
 	h6 {
-		margin-top: -2rem;
+		margin-top: 3rem;
+		padding-top: 0.5rem;
 		margin-bottom: 0.5rem;
 		font-weight: 700;
 	}