Merge pull request #3496 from Automattic/fix/tweak-newspack-ui-css-2

fix: override button, text styles
Automattic · Oct 25, 2024 · f4aecfe · f4aecfe
2 parents ccb8653 + a42970d
commit f4aecfe
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 11 deletions.
diff --git a/src/newspack-ui/scss/elements/_typography.scss b/src/newspack-ui/scss/elements/_typography.scss
@@ -6,6 +6,8 @@
 	-webkit-font-smoothing: antialiased;
 
 	p {
+		font-size: inherit;
+		line-height: inherit;
 		margin: var(--newspack-ui-spacer-2) 0;
 	}
 
@@ -17,6 +19,8 @@
 	h6 {
 		font-family: var(--newspack-ui-font-family);
 		font-weight: var(--newspack-ui-font-weight-strong);
+		letter-spacing: unset;
+		text-transform: unset;
 	}
 
 	strong,
@@ -28,57 +32,57 @@
 		font-weight: normal;
 	}
 
-	&__font--2xs {
+	& &__font--2xs {
 		font-size: var(--newspack-ui-font-size-2xs);
 		line-height: var(--newspack-ui-line-height-2xs);
 	}
 
-	&__font--xs {
+	& &__font--xs {
 		font-size: var(--newspack-ui-font-size-xs);
 		line-height: var(--newspack-ui-line-height-xs);
 	}
 
-	&__font--s {
+	& &__font--s {
 		font-size: var(--newspack-ui-font-size-s);
 		line-height: var(--newspack-ui-line-height-s);
 	}
 
-	&__font--m {
+	& &__font--m {
 		font-size: var(--newspack-ui-font-size-m);
 		line-height: var(--newspack-ui-line-height-m);
 	}
 
-	&__font--l {
+	& &__font--l {
 		font-size: var(--newspack-ui-font-size-l);
 		line-height: var(--newspack-ui-line-height-l);
 	}
 
-	&__font--xl {
+	& &__font--xl {
 		font-size: var(--newspack-ui-font-size-xl);
 		line-height: var(--newspack-ui-line-height-xl);
 	}
 
-	&__font--2xl {
+	& &__font--2xl {
 		font-size: var(--newspack-ui-font-size-2xl);
 		line-height: var(--newspack-ui-line-height-2xl);
 	}
 
-	&__font--3xl {
+	& &__font--3xl {
 		font-size: var(--newspack-ui-font-size-3xl);
 		line-height: var(--newspack-ui-line-height-3xl);
 	}
 
-	&__font--4xl {
+	& &__font--4xl {
 		font-size: var(--newspack-ui-font-size-4xl);
 		line-height: var(--newspack-ui-line-height-4xl);
 	}
 
-	&__font--5xl {
+	& &__font--5xl {
 		font-size: var(--newspack-ui-font-size-5xl);
 		line-height: var(--newspack-ui-line-height-5xl);
 	}
 
-	&__font--6xl {
+	& &__font--6xl {
 		font-size: var(--newspack-ui-font-size-6xl);
 		line-height: var(--newspack-ui-line-height-6xl);
 	}

diff --git a/src/newspack-ui/scss/elements/forms/_buttons.scss b/src/newspack-ui/scss/elements/forms/_buttons.scss
@@ -9,6 +9,7 @@
 		display: inline-flex;
 		font-family: var(--newspack-ui-font-family);
 		font-size: var(--newspack-ui-font-size-s);
+		font-style: normal;
 		font-weight: 600;
 		gap: calc(var(--newspack-ui-spacer-base) / 2);
 		letter-spacing: initial; // Override for custom styles.