Fix alignment of deep link icon

Setting manual margins is fragile. Remove them to fix bad alignment in about pages, since the icon is vertically aligned already. It looks good to me as is, but if we want to change the alignment, we should change the SVG instead.
owid · Dec 17, 2024 · 84e67eb · 84e67eb
1 parent 6c26466
commit 84e67eb
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 38 deletions.
diff --git a/site/gdocs/components/ResearchAndWriting.scss b/site/gdocs/components/ResearchAndWriting.scss
@@ -15,10 +15,6 @@ $rw-margin-bottom-grid-cell: 4px;
     @include sm-up {
         margin: 32px 0 24px;
     }
-
-    a.deep-link {
-        margin-top: 11px;
-    }
 }
 
 .research-and-writing-row__heading {

diff --git a/site/gdocs/components/centered-article.scss b/site/gdocs/components/centered-article.scss
@@ -289,10 +289,6 @@ $banner-height: 200px;
 }
 
 .article-block__heading {
-    a.deep-link {
-        position: absolute;
-    }
-
     &:hover {
         a.deep-link {
             opacity: 1;
@@ -302,32 +298,20 @@ $banner-height: 200px;
 
 h1.article-block__heading {
     a.deep-link {
-        margin-top: 16px;
         height: 16px;
         width: 16px;
-        @include sm-only {
-            margin-top: 10px;
-        }
     }
 }
 h2.article-block__heading {
     a.deep-link {
-        margin-top: 11px;
         height: 14px;
         width: 14px;
-        @include sm-only {
-            margin-top: 10px;
-        }
     }
 }
 h3.article-block__heading {
     a.deep-link {
-        margin-top: 8px;
         height: 12px;
         width: 12px;
-        @include sm-only {
-            margin-top: 10px;
-        }
     }
 }
 

diff --git a/site/gdocs/components/topic-page.scss b/site/gdocs/components/topic-page.scss
@@ -203,38 +203,23 @@
     }
     h1.article-block__heading.h1-semibold {
         font-size: 2.25rem;
-        a.deep-link {
-            margin-top: 19px;
-        }
+
         @include sm-up {
             font-size: 2.625rem;
-            a.deep-link {
-                margin-top: 23px;
-            }
         }
     }
     h2.article-block__heading.h2-bold {
         font-size: 1.5rem;
-        a.deep-link {
-            margin-top: 13px;
-        }
+
         @include sm-up {
             font-size: 2rem;
-            a.deep-link {
-                margin-top: 19px;
-            }
         }
     }
     h3.article-block__heading.h3-bold {
         font-size: 1.25rem;
-        a.deep-link {
-            margin-top: 10px;
-        }
+
         @include sm-up {
             font-size: 1.5rem;
-            a.deep-link {
-                margin-top: 12px;
-            }
         }
     }
 }