3-variables edit

wm-element-styles  edit

styles for consistent headings & listings

/* scss/3-variables/_wm-element-styles.scss */

$h5-font-size: 1.48rem;
$h5-line-height: 1.3;
$h5-font-weight: 700;
$h5-font-family: font(heading-sans);
$h5-letter-spacing: 0.015rem;
$h5-color: var(--color-wmgreen-90);
$h5-top-margin: $text-heading-top-margin;
$h5-bottom-space: toRem(11); // this is set so the bottom margin stays consistent with spacing between paragraph lines

$h6-font-size: 1.14rem;
$h6-line-height: 1.3;
$h6-font-weight: 700;
$h6-font-family: font(heading-sans);
$h6-letter-spacing: 0.015rem;
$h6-color: var(--color-wmgreen-90);
$h6-top-margin: $text-heading-top-margin;
$h6-bottom-space: 0px; // this is set so the bottom margin stays consistent with spacing between paragraph lines

// listing font styles
$listing-title-font-size: toRem(18.24);
$listing-directory-title-font-size: toRem(22);
$listing-title-line-height: 1.3;
$listing-title-font-weight: 700;
$listing-title-font-family: font(heading-sans);
$listing-title-letter-spacing: 0.015rem;
$listing-title-color: var(--color-webgold-75);

$listing-byline-font-size: toRem(14);
$listing-byline-line-height: 1.5;
$listing-byline-font-family: font(heading-sans);
$listing-byline-letter-spacing: 0.015rem;
$listing-byline-color: var(--color-text-base);

// listing element spacing
$listing-title-next: 17px;
$listing-byline-content: 22px;
$listing-content-nextentry: 56px;

 
/* scss/3-variables/_wm-element-styles.scss */

$h5-font-size: 1.48rem;
$h5-line-height: 1.3;
$h5-font-weight: 700;
$h5-font-family: font(heading-sans);
$h5-letter-spacing: 0.015rem;
$h5-color: var(--color-wmgreen-90);
$h5-top-margin: $text-heading-top-margin;
$h5-bottom-space: toRem(11); // this is set so the bottom margin stays consistent with spacing between paragraph lines

$h6-font-size: 1.14rem;
$h6-line-height: 1.3;
$h6-font-weight: 700;
$h6-font-family: font(heading-sans);
$h6-letter-spacing: 0.015rem;
$h6-color: var(--color-wmgreen-90);
$h6-top-margin: $text-heading-top-margin;
$h6-bottom-space: 0px; // this is set so the bottom margin stays consistent with spacing between paragraph lines

// listing font styles
$listing-title-font-size: toRem(18.24);
$listing-directory-title-font-size: toRem(22);
$listing-title-line-height: 1.3;
$listing-title-font-weight: 700;
$listing-title-font-family: font(heading-sans);
$listing-title-letter-spacing: 0.015rem;
$listing-title-color: var(--color-webgold-75);

$listing-byline-font-size: toRem(14);
$listing-byline-line-height: 1.5;
$listing-byline-font-family: font(heading-sans);
$listing-byline-letter-spacing: 0.015rem;
$listing-byline-color: var(--color-text-base);

// listing element spacing
$listing-title-next: 17px;
$listing-byline-content: 22px;
$listing-content-nextentry: 56px;
Copy
Edit
<!-- components/3-variables/wm-element-styles.php --> <pre><code class="language-css"><?php echo outputFile('../scss/3-variables/_wm-element-styles.scss'); ?> </code></pre> <pre><code class="printableVars"><?php echo outputFile('../scss/3-variables/_wm-element-styles.scss'); ?></code></pre>
Cancel
Copy
Copy
Edit
/* scss/3-variables/_wm-element-styles.scss */ $h5-font-size: 1.48rem; $h5-line-height: 1.3; $h5-font-weight: 700; $h5-font-family: font(heading-sans); $h5-letter-spacing: 0.015rem; $h5-color: var(--color-wmgreen-90); $h5-top-margin: $text-heading-top-margin; $h5-bottom-space: toRem(11); // this is set so the bottom margin stays consistent with spacing between paragraph lines $h6-font-size: 1.14rem; $h6-line-height: 1.3; $h6-font-weight: 700; $h6-font-family: font(heading-sans); $h6-letter-spacing: 0.015rem; $h6-color: var(--color-wmgreen-90); $h6-top-margin: $text-heading-top-margin; $h6-bottom-space: 0px; // this is set so the bottom margin stays consistent with spacing between paragraph lines // listing font styles $listing-title-font-size: toRem(18.24); $listing-directory-title-font-size: toRem(22); $listing-title-line-height: 1.3; $listing-title-font-weight: 700; $listing-title-font-family: font(heading-sans); $listing-title-letter-spacing: 0.015rem; $listing-title-color: var(--color-webgold-75); $listing-byline-font-size: toRem(14); $listing-byline-line-height: 1.5; $listing-byline-font-family: font(heading-sans); $listing-byline-letter-spacing: 0.015rem; $listing-byline-color: var(--color-text-base); // listing element spacing $listing-title-next: 17px; $listing-byline-content: 22px; $listing-content-nextentry: 56px;
Cancel