// -------------------------------- // (START) Global Editor code https://codyhouse.co/ds/globals/typography // -------------------------------- @import url('https://rsms.me/inter/inter.css'); :root { // font family --font-primary: Inter, sans-serif; // body font size --text-base-size: 1em; // type scale --text-scale-ratio: 1.2; --text-xs: calc((1em / var(--text-scale-ratio)) / var(--text-scale-ratio)); --text-sm: calc(var(--text-xs) * var(--text-scale-ratio)); --text-md: calc(var(--text-sm) * var(--text-scale-ratio) * var(--text-scale-ratio)); --text-lg: calc(var(--text-md) * var(--text-scale-ratio)); --text-xl: calc(var(--text-lg) * var(--text-scale-ratio)); --text-xxl: calc(var(--text-xl) * var(--text-scale-ratio)); --text-xxxl: calc(var(--text-xxl) * var(--text-scale-ratio)); // line-height --body-line-height: 1.4; --heading-line-height: 1.2; // capital letters - used in combo with the lhCrop mixin --font-primary-capital-letter: 0.95; } @supports(--css: variables) { :root { @include breakpoint(md) { --text-base-size: 1.25em; --text-scale-ratio: 1.28; } } } body { font-family: var(--font-primary); } h1, h2, h3, h4 { font-family: var(--font-primary); font-weight: 600; } //font family .font-primary { font-family: var(--font-primary);} // color .color-secondary { color: alpha(var(--color-secondary), var(--color-o, 1));} // -------------------------------- // (END) Global Editor Code // -------------------------------- // link style a, .link {} mark { background-color: alpha(var(--color-accent), 0.2); color: inherit; } .text-component { --line-height-multiplier: 1; --text-vspace-multiplier: 1; blockquote { padding-left: 1em; border-left: 4px solid var(--color-contrast-low); } hr { background: var(--color-contrast-low); height: 1px; } figcaption { font-size: var(--text-sm); color: var(--color-contrast-medium); } } .article { // e.g., blog posts --body-line-height: 1.58; // set body line-height --text-vspace-multiplier: 1.2; // increase vertical spacing }