aziz/AstralRinth
0
0
Fork 0
forked from xxxOFFxxx/AstralRinth
Code Pull Requests Activity

Run prettier

Browse Source
This commit is contained in:
venashial
2022-06-04 00:46:23 -07:00
parent 597c071c3d
commit c9ec9f14de
49 changed files with 1515 additions and 1469 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/routes/components/Avatar.md
View File

@@ -2,12 +2,14 @@ Avatars are used for project icons and user profile pictures. Low resolution ima
```svelte example raised
<script lang="ts">
import { Avatar } from "omorphia";
import { Avatar } from 'omorphia'
</script>
<Avatar size="lg" circle src="https://avatars3.githubusercontent.com/u/44736536?v=4" />
<Avatar size="md" src="https://cdn.modrinth.com/data/AANobbMI/icon.png" />
<Avatar size="md" src="https://staging-cdn.modrinth.com/data/d1SqMrzw/9a39b0c80a49976b0c04053682708374e18105fe.png" />
<Avatar
size="md"
src="https://staging-cdn.modrinth.com/data/d1SqMrzw/9a39b0c80a49976b0c04053682708374e18105fe.png" />
<Avatar size="sm" />
<Avatar size="xs" circle src="https://avatars1.githubusercontent.com/u/6166773?v=4" />
```

2
src/routes/components/Badge.md
View File

@@ -1,6 +1,6 @@
```svelte example raised
<script lang="ts">
import { Badge } from "omorphia";
import { Badge } from 'omorphia'
</script>
<Badge color="red" label="Tomato" />

38
src/routes/components/Button.md
View File

@@ -2,8 +2,8 @@
```svelte example
<script lang="ts">
import { Button } from "omorphia";
import IconDownload from 'virtual:icons/heroicons-outline/download'
import { Button } from 'omorphia'
import IconDownload from 'virtual:icons/heroicons-outline/download'
</script>
<Button color="raised"><IconDownload /> Download</Button>
@@ -13,21 +13,21 @@
```svelte example raised
<script lang="ts">
import { Button } from "omorphia";
import IconDownload from 'virtual:icons/heroicons-outline/download'
import { Button } from 'omorphia'
import IconDownload from 'virtual:icons/heroicons-outline/download'
</script>
<div class="button-group">
<Button>Default</Button>
<Button color="raised">Raised</Button>
<Button color="primary">Primary</Button>
<Button color="primary-light">Light primary</Button>
<Button color="secondary">Secondary</Button>
<Button color="tertiary">Tertiary</Button>
<Button color="danger">Danger</Button>
<Button color="danger-light">Light danger</Button>
<Button color="transparent">Transparent</Button>
<Button disabled>Disabled</Button>
<Button>Default</Button>
<Button color="raised">Raised</Button>
<Button color="primary">Primary</Button>
<Button color="primary-light">Light primary</Button>
<Button color="secondary">Secondary</Button>
<Button color="tertiary">Tertiary</Button>
<Button color="danger">Danger</Button>
<Button color="danger-light">Light danger</Button>
<Button color="transparent">Transparent</Button>
<Button disabled>Disabled</Button>
</div>
```
@@ -35,13 +35,13 @@
```svelte example raised
<script lang="ts">
import { Button } from "omorphia";
import IconDownload from 'virtual:icons/heroicons-outline/download'
import IconHeart from 'virtual:icons/heroicons-outline/heart'
import { Button } from 'omorphia'
import IconDownload from 'virtual:icons/heroicons-outline/download'
import IconHeart from 'virtual:icons/heroicons-outline/heart'
</script>
<div class="button-group">
<Button color="primary"><IconDownload /></Button>
<Button><IconHeart /> Follow mod </Button>
<Button color="primary"><IconDownload /></Button>
<Button><IconHeart /> Follow mod</Button>
</div>
```

8
src/routes/components/Checkbox.md
View File

@@ -2,7 +2,7 @@
```svelte example raised
<script lang="ts">
import { Checkbox } from "omorphia";
import { Checkbox } from 'omorphia'
</script>
<Checkbox>Extra components</Checkbox>
@@ -12,9 +12,9 @@
```svelte example raised
<script lang="ts">
import { Checkbox } from "omorphia";
import IconCarrot from 'virtual:icons/lucide/carrot'
import { Checkbox } from 'omorphia'
import IconCarrot from 'virtual:icons/lucide/carrot'
</script>
<Checkbox><IconCarrot /> Food </Checkbox>
<Checkbox><IconCarrot /> Food</Checkbox>
```

55
src/routes/components/CheckboxList.md
View File

@@ -1,37 +1,36 @@
```svelte example raised
<script lang="ts">
import { CheckboxList } from "omorphia";
import IconSquare from 'virtual:icons/lucide/square'
import IconCircle from 'virtual:icons/lucide/circle'
import IconTriangle from 'virtual:icons/lucide/triangle'
import { CheckboxList } from 'omorphia'
import IconSquare from 'virtual:icons/lucide/square'
import IconCircle from 'virtual:icons/lucide/circle'
import IconTriangle from 'virtual:icons/lucide/triangle'
let selected = []
let selected = []
</script>
<CheckboxList
bind:value={selected}
options={[
{
label: 'Circle',
icon: IconCircle,
value: 'CIR',
},
{
label: 'Triangle',
icon: IconTriangle,
value: 'TRI',
},
{
label: 'Square',
icon: IconSquare,
value: 'SQU',
},
{
label: 'Blank',
value: 'BLA',
},
]}
/>
bind:value={selected}
options={[
{
label: 'Circle',
icon: IconCircle,
value: 'CIR',
},
{
label: 'Triangle',
icon: IconTriangle,
value: 'TRI',
},
{
label: 'Square',
icon: IconSquare,
value: 'SQU',
},
{
label: 'Blank',
value: 'BLA',
},
]} />
Selected: {selected}
```

26
src/routes/components/CheckboxVirtualList.md
View File

@@ -1,23 +1,21 @@
```svelte example raised
<script lang="ts">
import { CheckboxVirtualList } from "omorphia";
import IconStar from 'virtual:icons/heroicons-outline/star'
import { uniqueId } from 'omorphia/utils/uniqueId'
import { CheckboxVirtualList } from 'omorphia'
import IconStar from 'virtual:icons/heroicons-outline/star'
import { uniqueId } from 'omorphia/utils/uniqueId'
let options = Array(100).fill({})
.map(option => ({
label: 'Star-' + uniqueId(),
icon: IconStar,
value: uniqueId(),
}))
let options = Array(100)
.fill({})
.map((option) => ({
label: 'Star-' + uniqueId(),
icon: IconStar,
value: uniqueId(),
}))
let selected = ['2', '6']
let selected = ['2', '6']
</script>
<CheckboxVirtualList
bind:value={selected}
{options}
/>
<CheckboxVirtualList bind:value={selected} {options} />
Selected: {selected}
```

58
src/routes/components/Chips.md
View File

@@ -2,42 +2,46 @@
```svelte example raised
<script lang="ts">
import { Chips } from "omorphia";
import { Chips } from 'omorphia'
</script>
<Chips options={[
{
label: 'One',
value: 'one'
},
{
label: 'Two',
value: 'two'
}]}
/>
<Chips
options={[
{
label: 'One',
value: 'one',
},
{
label: 'Two',
value: 'two',
},
]} />
```
### Force an option to be selected with `neverEmpty`
```svelte example raised
<script lang="ts">
import { Chips } from "omorphia";
import { Chips } from 'omorphia'
let foo = 'modpack'
let foo = 'modpack'
</script>
<Chips neverEmpty bind:value={foo} options={[
{
label: 'Mod',
value: 'mod'
},
{
label: 'Modpack',
value: 'modpack'
},
{
label: 'World',
value: 'world'
}]}
/>
<Chips
neverEmpty
bind:value={foo}
options={[
{
label: 'Mod',
value: 'mod',
},
{
label: 'Modpack',
value: 'modpack',
},
{
label: 'World',
value: 'world',
},
]} />
```

10
src/routes/components/FormField.md
View File

@@ -1,14 +1,14 @@
```svelte example raised
<script lang="ts">
import { FormField } from "omorphia";
import { Slider } from "omorphia";
import { TextInput } from "omorphia";
import { FormField } from 'omorphia'
import { Slider } from 'omorphia'
import { TextInput } from 'omorphia'
</script>
<FormField label="Favorite number">
<Slider min=0 max=100 value=69 />
<Slider min="0" max="100" value="69" />
</FormField>
<FormField label="Favorite color">
<TextInput placeholder="Enter another color..." />
<TextInput placeholder="Enter another color..." />
</FormField>
```

34
src/routes/components/NavRow.md
View File

@@ -2,25 +2,25 @@
```svelte example raised
<script lang="ts">
import { NavRow } from "omorphia";
import { NavRow } from 'omorphia'
</script>
<NavRow
level={1}
links={[
{
href: '/Button',
label: 'Button'
},
{
href: '/Chips',
label: 'Chips'
},
{
href: '/NavRow',
label: 'NavRow'
}
]}>
Click for fun
level={1}
links={[
{
href: '/Button',
label: 'Button',
},
{
href: '/Chips',
label: 'Chips',
},
{
href: '/NavRow',
label: 'NavRow',
},
]}>
Click for fun
</NavRow>
```

2
src/routes/components/Pagination.md
View File

@@ -2,7 +2,7 @@ Use pagination to show a set of page numbers and navigation directions to move t
```svelte example
<script lang="ts">
import { Pagination } from "omorphia"
import { Pagination } from 'omorphia'
</script>
<Pagination page={20} count={50} />

22
src/routes/components/Select.md
View File

@@ -1,19 +1,17 @@
```svelte example raised
<script lang="ts">
import { Select } from "omorphia";
import { Select } from 'omorphia'
let sortMethod = "downloads"
let sortMethod = 'downloads'
</script>
<Select
color="raised"
options={[
{ value: "", label: "Relevance" },
{ value: "downloads", label: "Downloads" },
{ value: "follows", label: "Followers" },
{ value: "newest", label: "Recently created" },
{ value: "updated", label: "Recently updated" },
]}
bind:value={sortMethod}
/>
options={[
{ value: '', label: 'Relevance' },
{ value: 'downloads', label: 'Downloads' },
{ value: 'follows', label: 'Followers' },
{ value: 'newest', label: 'Recently' },
{ value: 'updated', label: 'Recently updated really fast whoot' },
]}
bind:value={sortMethod} />
```

4
src/routes/components/Slider.md
View File

@@ -1,7 +1,7 @@
```svelte example raised
<script lang="ts">
import { Slider } from "omorphia";
import { Slider } from 'omorphia'
</script>
<Slider min=0 max=10 value=4 />
<Slider min="0" max="10" value="4" />
```

4
src/routes/components/TextInput.md
View File

@@ -1,7 +1,7 @@
```svelte example raised
<script lang="ts">
import { TextInput } from "omorphia";
import IconSearch from 'virtual:icons/heroicons-outline/search'
import { TextInput } from 'omorphia'
import IconSearch from 'virtual:icons/heroicons-outline/search'
</script>
<TextInput placeholder="Enter another color..." />