197197/// ===========================================================================
198198
199199$pfe-expand_button--LineHeight : 1.5 ;
200+ $pfe-expand_button--Padding : #{pfe-var (container-spacer )} ;
200201$pfe-expand_button--Padding--factor : .75 ;
201- $pfe-expand_button--Padding--wide : calc ( #{ pfe-var ( container-spacer )} * 1.5 ) ;
202+ $pfe-expand_button--Padding--wide : #{ $ pfe-expand_button--Padding * 1.5 } ;
202203
203204$pfe-expand_chevron--size : .4em ;
204205$pfe-expand_chevron--weight : .1em ;
@@ -215,7 +216,7 @@ $pfe-expand_chevron--placement: #{$pfe-expand_button--LineHeight / 2 - $pfe
215216 --pfe -#{$component-name } --main : transparent ;
216217 --pfe -#{$component-name } --aux : #{pfe-color (surface--lightest--text )} ;
217218 --pfe -#{$component-name } --focus : #{pfe-color (surface--lightest--link )} ;
218- --pfe -#{$component-name } --border-left : #{pfe-var (surface--border-width-thick )} #{pfe-var (surface--border-style )} transparent ;
219+ --pfe -#{$component-name } --border-left : #{pfe-var (surface--border-width-heavy )} #{pfe-var (surface--border-style )} transparent ;
219220 --pfe -#{$component-name } --border-right : #{pfe-var (surface--border-width )} #{pfe-var (surface--border-style )} transparent ;
220221 --pfe -#{$component-name } --border-bottom : 0 ;
221222
@@ -255,9 +256,9 @@ $pfe-expand_chevron--placement: #{$pfe-expand_button--LineHeight / 2 - $pfe
255256 border : 0 ;
256257 }
257258 @if $align == right {
258- padding : #{pfe-var ( container-spacer ) } $pfe-expand_button--Padding--wide #{pfe-var ( container-spacer ) } 50px ;
259+ padding : #{$ pfe-expand_button--Padding } $pfe-expand_button--Padding--wide #{$ pfe-expand_button--Padding } 50px ;
259260 } @else {
260- padding : #{pfe-var ( container-spacer ) } 50px #{pfe-var ( container-spacer ) } $pfe-expand_button--Padding--wide ;
261+ padding : #{$ pfe-expand_button--Padding } 50px #{$ pfe-expand_button--Padding } $pfe-expand_button--Padding--wide ;
261262 }
262263 // @TODO later, type scale support
263264 // [scale="large"] & {
@@ -312,14 +313,14 @@ $pfe-expand_chevron--placement: #{$pfe-expand_button--LineHeight / 2 - $pfe
312313 --pfe -#{$component-name } --main : #{pfe-color (surface--darker )} ;
313314 --pfe -#{$component-name } --aux : #{pfe-color (surface--darkest--text )} ;
314315 --pfe -#{$component-name } --focus : #{pfe-color (surface--lightest )} ;
315- --pfe -#{$component-name } --border-left : #{pfe-var (surface--border-width-thick )} #{pfe-var (surface--border-style )} #{pfe-color (surface--border-darkest )} ;
316+ --pfe -#{$component-name } --border-left : #{pfe-var (surface--border-width-heavy )} #{pfe-var (surface--border-style )} #{pfe-color (surface--border-darkest )} ;
316317 --pfe -#{$component-name } --border-right : #{pfe-var (surface--border-width )} #{pfe-var (surface--border-style )} #{pfe-color (surface--border-darkest )} ;
317318 }
318319 @else {
319320 --pfe -#{$component-name } --main : #{pfe-color (surface--lightest )} ;
320321 --pfe -#{$component-name } --aux : #{pfe-color (surface--lightest--text )} ;
321322 --pfe -#{$component-name } --focus : #{pfe-color (surface--lightest--link )} ;
322- --pfe -#{$component-name } --border-left : #{pfe-var (surface--border-width-thick )} #{pfe-var (surface--border-style )} #{pfe-color (surface--lightest--link )} ;
323+ --pfe -#{$component-name } --border-left : #{pfe-var (surface--border-width-heavy )} #{pfe-var (surface--border-style )} #{pfe-color (surface--lightest--link )} ;
323324 --pfe -#{$component-name } --border-right : #{pfe-var (surface--border-width )} #{pfe-var (surface--border-style )} #{pfe-color (surface--border--lightest )} ;
324325 }
325326}
0 commit comments