mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-19 03:49:34 +00:00
Code Issues Projects Releases Packages Wiki Activity

chore: stick to bx instead of cds class prefix

Browse source
This commit is contained in:
Gregor Wassmann 2022-10-12 00:17:15 +02:00
commit 526c574dd2
56 changed files with 191 additions and 193 deletions
Download patch file Download diff file Expand all files Collapse all files

2
docs/src/pages/components/Breakpoint.svx
View file

@ -8,7 +8,7 @@
The [Carbon Design System grid implementation](https://carbondesignsystem.com/guidelines/2x-grid/implementation#responsive-options) defines five responsive breakpoints:
<UnorderedList svx-ignore style="margin-bottom: var(--cds-spacing-08)">
<UnorderedList svx-ignore style="margin-bottom: var(--bx-spacing-08)">
<ListItem><strong>Small</strong>: less than 672px</ListItem>
<ListItem><strong>Medium</strong>: 672 - 1056px</ListItem>
<ListItem><strong>Large</strong>: 1056 - 1312px</ListItem>

4
docs/src/pages/components/FileUploader.svx
View file

@ -44,7 +44,7 @@ See the [item examples below](#item-uploading) for different statuses.
There are two ways to clear files in `FileUploader`:
<UnorderedList svx-ignore style="margin-bottom: var(--cds-spacing-08)">
<UnorderedList svx-ignore style="margin-bottom: var(--bx-spacing-08)">
<ListItem>programmatically using the <strong>clearFiles</strong> accessor</ListItem>
<ListItem>two-way binding by setting <strong>files</strong> to <strong>[]</strong></ListItem>
</UnorderedList>
@ -111,7 +111,7 @@ The following example accepts files smaller than 1 kB.
<FileUploaderDropContainer
multiple
labelText="Drag and drop files here or click to upload"
labelText="Drag and drop files here or click to upload"
validateFiles={files => {
return files.filter(file => file.size < 1_024)
}}

36
docs/src/pages/components/Popover.svx
View file

@ -10,7 +10,7 @@ By default, the position of the popover component is absolute.
<div data-outline>
Parent
<Popover open>
<div style="padding: var(--cds-spacing-05)">Content</div>
<div style="padding: var(--bx-spacing-05)">Content</div>
</Popover>
</div>
@ -21,7 +21,7 @@ Set `relative` to `true` to use a relative position.
<div data-outline>
Parent
<Popover relative open>
<div style="padding: var(--cds-spacing-05)">Content</div>
<div style="padding: var(--bx-spacing-05)">Content</div>
</Popover>
</div>
@ -32,7 +32,7 @@ Set `closeOnOutsideClick` to set `open` to `false` when clicking outside of the
<div data-outline>
Parent
<Popover open closeOnOutsideClick on:click:outside={() => {console.log('on:click:outside')}}>
<div style="padding: var(--cds-spacing-05)">Content</div>
<div style="padding: var(--bx-spacing-05)">Content</div>
</Popover>
</div>
@ -45,67 +45,67 @@ The default `align` value is `"top"`.
<div data-outline>
Parent
<Popover open align="top-left">
<div style="padding: var(--cds-spacing-05)">top-left</div>
<div style="padding: var(--bx-spacing-05)">top-left</div>
</Popover>
</div>
<div data-outline>
Parent
<Popover open align="top-right">
<div style="padding: var(--cds-spacing-05)">top-right</div>
<div style="padding: var(--bx-spacing-05)">top-right</div>
</Popover>
</div>
<div data-outline>
Parent
<Popover open align="bottom">
<div style="padding: var(--cds-spacing-05)">bottom</div>
<div style="padding: var(--bx-spacing-05)">bottom</div>
</Popover>
</div>
<div data-outline>
Parent
<Popover open align="bottom-left">
<div style="padding: var(--cds-spacing-05)">bottom-left</div>
<div style="padding: var(--bx-spacing-05)">bottom-left</div>
</Popover>
</div>
<div data-outline>
Parent
<Popover open align="bottom-right">
<div style="padding: var(--cds-spacing-05)">bottom-right</div>
<div style="padding: var(--bx-spacing-05)">bottom-right</div>
</Popover>
</div>
<div data-outline>
Parent
<Popover open align="left">
<div style="padding: var(--cds-spacing-05)">left</div>
<div style="padding: var(--bx-spacing-05)">left</div>
</Popover>
</div>
<div data-outline>
Parent
<Popover open align="left-bottom">
<div style="padding: var(--cds-spacing-05)">left-bottom</div>
<div style="padding: var(--bx-spacing-05)">left-bottom</div>
</Popover>
</div>
<div data-outline>
Parent
<Popover open align="left-right">
<div style="padding: var(--cds-spacing-05)">left-right</div>
<div style="padding: var(--bx-spacing-05)">left-right</div>
</Popover>
</div>
<div data-outline>
Parent
<Popover open align="right">
<div style="padding: var(--cds-spacing-05)">right</div>
<div style="padding: var(--bx-spacing-05)">right</div>
</Popover>
</div>
<div data-outline>
Parent
<Popover open align="right-bottom">
<div style="padding: var(--cds-spacing-05)">right-bottom</div>
<div style="padding: var(--bx-spacing-05)">right-bottom</div>
</Popover>
</div>
<div data-outline>
Parent
<Popover open align="right-top">
<div style="padding: var(--cds-spacing-05)">right-top</div>
<div style="padding: var(--bx-spacing-05)">right-top</div>
</Popover>
</div>
@ -114,7 +114,7 @@ The default `align` value is `"top"`.
<div data-outline>
Parent
<Popover caret open>
<div style="padding: var(--cds-spacing-05)">Content</div>
<div style="padding: var(--bx-spacing-05)">Content</div>
</Popover>
</div>
@ -127,7 +127,7 @@ Possible `align` values include `"top"`, `"top-left"`, `"top-right"`, `"bottom"`
<div data-outline>
Parent
<Popover caret align="top-left" open>
<div style="padding: var(--cds-spacing-05)">Content</div>
<div style="padding: var(--bx-spacing-05)">Content</div>
</Popover>
</div>
@ -136,7 +136,7 @@ Possible `align` values include `"top"`, `"top-left"`, `"top-right"`, `"bottom"`
<div data-outline>
Parent
<Popover light open>
<div style="padding: var(--cds-spacing-05)">Content</div>
<div style="padding: var(--bx-spacing-05)">Content</div>
</Popover>
</div>
@ -145,7 +145,7 @@ Possible `align` values include `"top"`, `"top-left"`, `"top-right"`, `"bottom"`
<div data-outline>
Parent
<Popover highContrast open>
<div style="padding: var(--cds-spacing-05)">Content</div>
<div style="padding: var(--bx-spacing-05)">Content</div>
</Popover>
</div>