mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-15 10:21:05 +00:00
Code Issues Projects Releases Packages Wiki Activity

docs: use expressive typography

Browse source
This commit is contained in:
Eric Liu 2020-10-17 10:17:11 -07:00
commit 58574a47af
2 changed files with 31 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

64
docs/src/pages/_layout.svelte
View file

@ -36,34 +36,28 @@
<style global>
.bx--col > h1 {
font-size: var(--cds-productive-heading-07-font-size);
font-weight: var(--cds-productive-heading-07-font-weight);
letter-spacing: var(--cds-productive-heading-07-letter-spacing);
line-height: var(--cds-productive-heading-07-line-height);
font-size: var(--cds-display-01-font-size);
font-weight: var(--cds-display-01-font-weight);
letter-spacing: var(--cds-display-01-letter-spacing);
line-height: var(--cds-display-01-line-height);
margin-bottom: var(--cds-layout-01);
}
.big-paragraph {
font-size: 1.5rem;
font-weight: var(--cds-productive-heading-03-font-weight);
letter-spacing: var(--cds-productive-heading-03-letter-spacing);
line-height: var(--cds-productive-heading-03-line-height);
font-size: var(--cds-expressive-heading-03-font-size);
font-weight: var(--cds-expressive-heading-03-font-weight);
letter-spacing: var(--cds-expressive-heading-03-letter-spacing);
line-height: var(--cds-expressive-heading-03-line-height);
margin-top: var(--cds-layout-03);
margin-bottom: var(--cds-layout-05);
margin-bottom: var(--cds-layout-06);
}
.big-link,
.bx--col > .big-paragraph > code {
font-size: var(--cds-productive-heading-03-font-size);
font-weight: var(--cds-productive-heading-03-font-weight);
letter-spacing: var(--cds-productive-heading-03-letter-spacing);
line-height: var(--cds-productive-heading-03-line-height);
}
.big-link {
font-size: 1.5rem;
font-weight: var(--cds-productive-heading-03-font-weight);
letter-spacing: var(--cds-productive-heading-03-letter-spacing);
line-height: var(--cds-productive-heading-03-line-height);
font-size: var(--cds-expressive-heading-03-font-size);
font-weight: var(--cds-expressive-heading-03-font-weight);
letter-spacing: var(--cds-expressive-heading-03-letter-spacing);
line-height: var(--cds-expressive-heading-03-line-height);
}
.bx--col > p {
@ -81,28 +75,28 @@
}
.bx--col > h2 {
font-size: var(--cds-productive-heading-06-font-size);
font-weight: var(--cds-productive-heading-06-font-weight);
letter-spacing: var(--cds-productive-heading-06-letter-spacing);
line-height: var(--cds-productive-heading-06-line-height);
padding-top: var(--cds-layout-03);
font-size: var(--cds-expressive-heading-05-font-size);
font-weight: var(--cds-expressive-heading-05-font-weight);
letter-spacing: var(--cds-expressive-heading-05-letter-spacing);
line-height: var(--cds-expressive-heading-05-line-height);
padding-top: var(--cds-layout-04);
margin-bottom: var(--cds-layout-01);
}
.bx--col > h3 {
font-size: var(--cds-productive-heading-04-font-size);
font-weight: var(--cds-productive-heading-04-font-weight);
letter-spacing: var(--cds-productive-heading-04-letter-spacing);
line-height: var(--cds-productive-heading-04-line-height);
padding-top: var(--cds-layout-03);
margin-bottom: var(--cds-layout-02);
font-size: var(--cds-expressive-heading-04-font-size);
font-weight: var(--cds-expressive-heading-04-font-weight);
letter-spacing: var(--cds-expressive-heading-04-letter-spacing);
line-height: var(--cds-expressive-heading-04-line-height);
padding-top: var(--cds-layout-04);
margin-bottom: var(--cds-layout-01);
}
.bx--col > h4 {
font-size: var(--cds-productive-heading-02-font-size);
font-weight: var(--cds-productive-heading-02-font-weight);
letter-spacing: var(--cds-productive-heading-02-letter-spacing);
line-height: var(--cds-productive-heading-02-line-height);
font-size: var(--cds-expressive-heading-02-font-size);
font-weight: var(--cds-expressive-heading-02-font-weight);
letter-spacing: var(--cds-expressive-heading-02-letter-spacing);
line-height: var(--cds-expressive-heading-02-line-height);
padding-top: var(--cds-layout-04);
margin-bottom: var(--cds-layout-01);
}