diff --git a/src/components/TypesetStyle/TypesetExample.js b/src/components/TypesetStyle/TypesetExample.js
index ee8eb2e51b3..e445a95af5b 100644
--- a/src/components/TypesetStyle/TypesetExample.js
+++ b/src/components/TypesetStyle/TypesetExample.js
@@ -32,9 +32,8 @@ const TypesetExample = (props) => (
)
);
- const currentBreakpointPx = values(breakpoints)[
- indexOfClosestLargerBreakpoint
- ];
+ const currentBreakpointPx =
+ values(breakpoints)[indexOfClosestLargerBreakpoint];
const currentBreakpointName = findKey(
breakpoints,
@@ -48,7 +47,9 @@ const TypesetExample = (props) => (
typeStylesUntilCurrentBreakpoint.push(
props.typeScale[type.key][item]
);
- if (item === breakpointName) {break;}
+ if (item === breakpointName) {
+ break;
+ }
}
return Object.assign(
{},
@@ -129,13 +130,13 @@ const TypesetExample = (props) => (
className={`${prefix}--typeset-example`}>
+ className={`${prefix}--typeset-example-description ${prefix}--col-md-6`}>
{type.description}
+ className={`${prefix}--typeset-example-specs ${prefix}--col-md-2 ${prefix}--padding`}>
{type.name}
diff --git a/src/components/TypesetStyle/typeset-example.scss b/src/components/TypesetStyle/typeset-example.scss
index 357b507e51b..4ea9d98b854 100644
--- a/src/components/TypesetStyle/typeset-example.scss
+++ b/src/components/TypesetStyle/typeset-example.scss
@@ -48,7 +48,7 @@
}
.bx--typeset-example-specs {
- padding: $spacing-05 $spacing-06;
+ padding: $spacing-05;
@include carbon--breakpoint('md') {
width: 33.3%;
diff --git a/src/components/TypesetStyle/typeset-style.scss b/src/components/TypesetStyle/typeset-style.scss
index 97d4c1f63bf..0a468c6e7b6 100644
--- a/src/components/TypesetStyle/typeset-style.scss
+++ b/src/components/TypesetStyle/typeset-style.scss
@@ -14,8 +14,6 @@ $prefix: 'bx';
@include carbon--breakpoint('lg') {
margin-top: 0;
- left: 0.5rem;
- margin-right: $spacing-03;
}
}