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; } }