fix(notecard): misaligned icon, excessive internal padding (#11467)

mdn · Jul 30, 2024 · 5bc2965 · 5bc2965
1 parent b493ff2
commit 5bc2965
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 16 deletions.
diff --git a/client/src/document/index.scss b/client/src/document/index.scss
@@ -189,12 +189,6 @@
       margin-bottom: 1rem;
       margin-left: 1rem;
 
-      .notecard {
-        p {
-          padding-left: 0;
-        }
-      }
-
       dl {
         /* Nested definition list. */
         border-left: 1px solid var(--border-primary);

diff --git a/client/src/ui/molecules/notecards/index.scss b/client/src/ui/molecules/notecards/index.scss
@@ -31,7 +31,7 @@
     mask-repeat: no-repeat;
     mask-size: contain;
     position: absolute;
-    top: 1.5rem;
+    top: 1.35rem;
     width: 1rem;
   }
 
@@ -103,17 +103,24 @@
 
   // extra classes added to fix specificity.
 
-  ul,
-  ol {
-    padding-left: 2rem;
-  }
+  &,
+  .main-page-content &,
+  dd & {
+    ul,
+    ol {
+      padding-left: 1rem;
+    }
 
-  ul,
-  p {
-    padding-bottom: 0.5rem;
+    ul,
+    ol,
+    li,
+    p {
+      margin: 0;
+      padding-bottom: 0.5rem;
 
-    &:last-child {
-      padding-bottom: 0;
+      &:last-child {
+        padding-bottom: 0;
+      }
     }
   }