<span class="caption-call to action">call to action Default</span>
{{#if isInput}}
{{> '@form-input' inputCaption}}
{{else if isSelect}}
{{> '@form-select' selectCaption}}
{{else}}
<span class="caption{{type}}">{{{text}}}</span>
{{/if}}
{
"type": "-call to action",
"text": "call to action Default"
}
[class*='caption-'] {
font-family: var(--font-family-sans-low);
letter-spacing: var(--font-letter-spacing-wide);
}
.caption {
/* extend class: btn molecule */
&-call-to-action {
font-size: var(--font-size-4);
line-height: var(--font-line-height-3);
font-family: var(--font-family-sans-mid);
}
&-placeholder-L, &-placeholder-l{
font-size: var(--font-size-10);
line-height: var(--font-line-height-6);
font-family: var(--font-family-news-low);
.access-select__option,
&::placeholder {
font-size: var(--font-size-10);
line-height: var(--font-line-height-6);
font-family: var(--font-family-news-low);
}
}
&-placeholder-M, &-placeholder-m {
font-size: var(--font-size-4);
line-height: var(--font-line-height-3);
font-family: var(--font-family-sans-low);
.access-select__option,
&::placeholder {
font-size: var(--font-size-4);
line-height: var(--font-line-height-3);
font-family: var(--font-family-sans-low);
}
}
/* extend class: label atom */
&-label {
font-size: var(--font-size-1);
line-height: var(--font-line-height-1);
font-family: var(--font-family-sans-mid);
letter-spacing: var(--font-letter-spacing-label);
text-transform: uppercase;
}
}
No notes defined.