diff --git a/addons/rose/addon/styles/rose/components/form/_radio.scss b/addons/rose/addon/styles/rose/components/form/_radio.scss index 7ef3ddcea..353912dfe 100644 --- a/addons/rose/addon/styles/rose/components/form/_radio.scss +++ b/addons/rose/addon/styles/rose/components/form/_radio.scss @@ -1,6 +1,7 @@ @use '../../variables/sizing'; @use '../../utilities/type'; -@use 'sass:math'; +@use '../../variables/typography'; + $radio-svg: ( 'default': "", @@ -32,12 +33,11 @@ $data-svg-prefix: 'data:image/svg+xml;utf-8,'; position: relative; margin-bottom: sizing.rems(xs); color: var(--ui-gray); - .rose-form-radio-label.helper-text { + .helper-text { display: flex; .rose-form-helper-text { margin-left: sizing.rems(xxs); - $lineHeight: math.div(20, 14); - line-height: $lineHeight; + line-height: typography.line-height(m); } } .rose-form-radio-label { diff --git a/addons/rose/addon/styles/rose/components/form/_radioCard.scss b/addons/rose/addon/styles/rose/components/form/_radioCard.scss new file mode 100644 index 000000000..f24a15dae --- /dev/null +++ b/addons/rose/addon/styles/rose/components/form/_radioCard.scss @@ -0,0 +1,17 @@ +.rose-form-radio-card { + position: relative; + width: 370px; + height: 115px; + background: #FFFFFF; + border: 1px solid #BAC1CC; + box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); + border-radius: 2px; + .rose-form-radio-field { + top: 89px; + right: 176px; + position: absolute; + } + .rose-form-radio-label { + color: #000; + } +} \ No newline at end of file