style(docs): apply code-01 styles to component api type, default value

This commit is contained in:
Eric Liu 2022-08-27 10:54:34 -07:00
commit dbbf8ed3c6
3 changed files with 15 additions and 14 deletions

View file

@ -95,16 +95,18 @@
{type} {type}
</OutboundLink> </OutboundLink>
{:else if type in typeMap} {:else if type in typeMap}
<code>{typeMap[type]}</code> <code class="code-01">{typeMap[type]}</code>
{:else if type.startsWith("(")} {:else if type.startsWith("(")}
<code>{type}</code> <code class="code-01">{type}</code>
{:else} {:else}
<InlineSnippet code="{type}" /> <InlineSnippet code="{type}" />
{/if} {/if}
</div> </div>
{/each} {/each}
</StructuredListCell> </StructuredListCell>
<StructuredListCell><code>{prop.value}</code></StructuredListCell> <StructuredListCell
><code class="code-01">{prop.value}</code></StructuredListCell
>
<StructuredListCell> <StructuredListCell>
{#if prop.description} {#if prop.description}
{#each prop.description.split("\n") as line} {#each prop.description.split("\n") as line}

View file

@ -177,6 +177,13 @@ html[theme="g90"] .code-override {
overflow-y: auto; overflow-y: auto;
} }
.code-01 {
font-size: var(--cds-code-01-font-size);
font-weight: var(--cds-code-01-font-weight);
letter-spacing: var(--cds-code-01-letter-spacing);
line-height: var(--cds-code-01-line-height);
}
.body-short-01 { .body-short-01 {
font-size: var(--cds-body-short-01-font-size); font-size: var(--cds-body-short-01-font-size);
font-weight: var(--cds-body-short-01-font-weight); font-weight: var(--cds-body-short-01-font-weight);

View file

@ -50,8 +50,9 @@
</svelte:fragment> </svelte:fragment>
<span slot="platform" class="platform-name"> <span slot="platform" class="platform-name">
Carbon Components Svelte Carbon Components Svelte &nbsp;<code class="code-01"
<code>v{process.env.VERSION || ""}</code> >v{process.env.VERSION || ""}</code
>
</span> </span>
<HeaderUtilities> <HeaderUtilities>
@ -135,15 +136,6 @@
align-items: baseline; align-items: baseline;
} }
.platform-name code {
margin-left: var(--cds-spacing-02);
font-size: var(--cds-code-01-font-size);
font-weight: var(--cds-code-01-font-weight);
letter-spacing: var(--cds-code-01-letter-spacing);
line-height: var(--cds-code-01-line-height);
color: #c6c6c6;
}
@media (max-width: 580px) { @media (max-width: 580px) {
.platform-name code { .platform-name code {
display: none; display: none;