Don't set font-size, use ems consistently (#377)

davidjgoss · web-flow · commit d06afe5132e6 · 2025-04-07T08:34:26.000+01:00
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 - Make keyword spacing look right ([#376](https://github.com/cucumber/react-components/pull/376))
 
 ### Changed
+- Inherit font-size instead of setting at 14px ([#377](https://github.com/cucumber/react-components/pull/377))
 - BREAKING CHANGE: Remove props from `<StatusesSummary/>`, `<ExecutionSummary/>` and `<SearchBar/>` components, use contexts for state ([#374](https://github.com/cucumber/react-components/pull/374))
 
 ### Removed
diff --git a/src/components/CucumberReact.module.scss b/src/components/CucumberReact.module.scss
@@ -1,7 +1,6 @@
 @import '../styles/theming';
 
 .cucumberReact {
-  font-size: 14px;
   font-family: $sansFamily;
   color: $textColor;
   background: $backgroundColor;
diff --git a/src/components/gherkin/Examples.module.scss b/src/components/gherkin/Examples.module.scss
@@ -1,3 +1,3 @@
 .example {
-  margin-left: 1rem;
+  margin-left: 1em;
 }
diff --git a/src/components/gherkin/StepItem.module.scss b/src/components/gherkin/StepItem.module.scss
@@ -7,7 +7,6 @@ $statusWidth: 1.5em;
 
 .status {
   width: $statusWidth;
-  padding-top: 0.1em;
 }
 
 .content {
diff --git a/src/components/gherkin/Title.module.scss b/src/components/gherkin/Title.module.scss
@@ -7,10 +7,10 @@
 
 h1.title,
 h2.title {
-  font-size: 1.5em;
+  font-size: 1.25em;
 }
 
 h3.title,
 h4.title {
-  font-size: 1.125em;
+  font-size: 1em;
 }

Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,3 @@`
`1`	`1`	`.example {`
`2`		`- margin-left: 1rem;`
	`2`	`+ margin-left: 1em;`
`3`	`3`	`}`
Original file line number	Diff line number	Diff line change
`@@ -7,7 +7,6 @@ $statusWidth: 1.5em;`
`7`	`7`
`8`	`8`	`.status {`
`9`	`9`	`width: $statusWidth;`
`10`		`- padding-top: 0.1em;`
`11`	`10`	`}`
`12`	`11`
`13`	`12`	`.content {`
Original file line number	Diff line number	Diff line change
`@@ -7,10 +7,10 @@`
`7`	`7`
`8`	`8`	`h1.title,`
`9`	`9`	`h2.title {`
`10`		`- font-size: 1.5em;`
	`10`	`+ font-size: 1.25em;`
`11`	`11`	`}`
`12`	`12`
`13`	`13`	`h3.title,`
`14`	`14`	`h4.title {`
`15`		`- font-size: 1.125em;`
	`15`	`+ font-size: 1em;`
`16`	`16`	`}`