Skip to content

Commit

Permalink
Deploying to gh-pages from @ 0291e51 🚀
Browse files Browse the repository at this point in the history
  • Loading branch information
fynnfeldpausch committed Nov 27, 2023
1 parent 89f5cc1 commit d7f6d5d
Showing 1 changed file with 1 addition and 1 deletion.
2 changes: 1 addition & 1 deletion index.html
Original file line number Diff line number Diff line change
Expand Up @@ -216,7 +216,7 @@
paginationDemo.addEventListener('catChange', function (event) {
console.log('Page changed!', event.detail);
});
</script> </section> <section id="radio"> <h2>Radio</h2> <cat-radio label="Label"></cat-radio> <h3>Group</h3> <cat-radio-group a11y-label="Radio Group 1" label-left=""> <cat-radio value="one" label="Option 1 - Group 1" checked=""></cat-radio> <cat-radio value="two" label="Option 2 - Group 1"></cat-radio> <cat-radio value="three" label="Option 3 - Group 3" disabled=""></cat-radio> </cat-radio-group> <h3>State</h3> <cat-radio label="Disabled" disabled=""></cat-radio> <cat-radio label="Checked" checked=""></cat-radio> <cat-radio label="Checked disabled" checked="" disabled=""></cat-radio> <h3>Alignment</h3> <cat-radio label="Label" label-left=""></cat-radio> <h3>Slots</h3> <cat-radio hint="This is a hint!"> <span slot="label">This is the <b>label</b></span> <span slot="hint">This is another!</span> </cat-radio> </section> <section id="scrollable"> <h2>Scrollable</h2> <cat-scrollable style="max-height: 8rem; width: 25vw;"> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> </cat-scrollable> </section> <section id="select"> <h2>Select</h2> <cat-select-demo></cat-select-demo> </section> <section id="skeleton"> <h2>Skeleton</h2> <cat-skeleton></cat-skeleton> <h3>Effect</h3> <cat-skeleton effect="plain"></cat-skeleton> <br> <cat-skeleton effect="sheen"></cat-skeleton> <br> <cat-skeleton effect="pulse"></cat-skeleton> <h3>Variant</h3> <cat-skeleton variant="square"></cat-skeleton> <cat-skeleton variant="circle"></cat-skeleton> <cat-skeleton variant="rectangle"></cat-skeleton> <cat-skeleton variant="head"></cat-skeleton> <cat-skeleton variant="body"></cat-skeleton> </section> <section id="spinner"> <h2>Spinner</h2> <cat-spinner></cat-spinner> <h3>Color</h3> <cat-spinner style="color: red;"></cat-spinner> <cat-spinner style="color: blue;"></cat-spinner> <cat-spinner style="color: green;"></cat-spinner> <h3>Size</h3> <cat-spinner size="xs"></cat-spinner> <cat-spinner size="s"></cat-spinner> <cat-spinner size="m"></cat-spinner> <cat-spinner size="l"></cat-spinner> <cat-spinner size="xl"></cat-spinner> <cat-spinner size="inline" style="font-size: 2.5rem;"></cat-spinner> </section> <section id="tabs"> <h2>Tabs</h2> <cat-tabs> <cat-tab id="tab1" label="First"></cat-tab> <cat-tab label="Second"></cat-tab> <cat-tab label="Third" icon="sparkle-filled"></cat-tab> </cat-tabs> <h3>Alignment</h3> <cat-tabs tabs-align="center"> <cat-tab label="First"></cat-tab> <cat-tab label="Second"></cat-tab> <cat-tab label="Third" icon="sparkle-filled"></cat-tab> </cat-tabs> <br> <br> <cat-tabs tabs-align="right"> <cat-tab label="First"></cat-tab> <cat-tab label="Second"></cat-tab> <cat-tab label="Third" icon="sparkle-filled"></cat-tab> </cat-tabs> <br> <br> <cat-tabs tabs-align="justify" active-tab="second"> <cat-tab label="First" deactivate=""></cat-tab> <cat-tab label="Second" id="second"></cat-tab> <cat-tab label="Third" icon="sparkle-filled"></cat-tab> </cat-tabs> <script>
</script> </section> <section id="radio"> <h2>Radio</h2> <cat-radio label="Label"></cat-radio> <h3>Group</h3> <cat-radio-group a11y-label="Radio Group 1" label-left=""> <cat-radio value="one" label="Option 1 - Group 1" checked=""></cat-radio> <cat-radio value="two" label="Option 2 - Group 1"></cat-radio> <cat-radio value="three" label="Option 3 - Group 1" disabled=""></cat-radio> </cat-radio-group> <h3>State</h3> <cat-radio label="Disabled" disabled=""></cat-radio> <cat-radio label="Checked" checked=""></cat-radio> <cat-radio label="Checked disabled" checked="" disabled=""></cat-radio> <h3>Alignment</h3> <cat-radio label="Label" label-left=""></cat-radio> <h3>Slots</h3> <cat-radio hint="This is a hint!"> <span slot="label">This is the <b>label</b></span> <span slot="hint">This is another!</span> </cat-radio> </section> <section id="scrollable"> <h2>Scrollable</h2> <cat-scrollable style="max-height: 8rem; width: 25vw;"> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p> </cat-scrollable> </section> <section id="select"> <h2>Select</h2> <cat-select-demo></cat-select-demo> </section> <section id="skeleton"> <h2>Skeleton</h2> <cat-skeleton></cat-skeleton> <h3>Effect</h3> <cat-skeleton effect="plain"></cat-skeleton> <br> <cat-skeleton effect="sheen"></cat-skeleton> <br> <cat-skeleton effect="pulse"></cat-skeleton> <h3>Variant</h3> <cat-skeleton variant="square"></cat-skeleton> <cat-skeleton variant="circle"></cat-skeleton> <cat-skeleton variant="rectangle"></cat-skeleton> <cat-skeleton variant="head"></cat-skeleton> <cat-skeleton variant="body"></cat-skeleton> </section> <section id="spinner"> <h2>Spinner</h2> <cat-spinner></cat-spinner> <h3>Color</h3> <cat-spinner style="color: red;"></cat-spinner> <cat-spinner style="color: blue;"></cat-spinner> <cat-spinner style="color: green;"></cat-spinner> <h3>Size</h3> <cat-spinner size="xs"></cat-spinner> <cat-spinner size="s"></cat-spinner> <cat-spinner size="m"></cat-spinner> <cat-spinner size="l"></cat-spinner> <cat-spinner size="xl"></cat-spinner> <cat-spinner size="inline" style="font-size: 2.5rem;"></cat-spinner> </section> <section id="tabs"> <h2>Tabs</h2> <cat-tabs> <cat-tab id="tab1" label="First"></cat-tab> <cat-tab label="Second"></cat-tab> <cat-tab label="Third" icon="sparkle-filled"></cat-tab> </cat-tabs> <h3>Alignment</h3> <cat-tabs tabs-align="center"> <cat-tab label="First"></cat-tab> <cat-tab label="Second"></cat-tab> <cat-tab label="Third" icon="sparkle-filled"></cat-tab> </cat-tabs> <br> <br> <cat-tabs tabs-align="right"> <cat-tab label="First"></cat-tab> <cat-tab label="Second"></cat-tab> <cat-tab label="Third" icon="sparkle-filled"></cat-tab> </cat-tabs> <br> <br> <cat-tabs tabs-align="justify" active-tab="second"> <cat-tab label="First" deactivate=""></cat-tab> <cat-tab label="Second" id="second"></cat-tab> <cat-tab label="Third" icon="sparkle-filled"></cat-tab> </cat-tabs> <script>
const tab = document.querySelector('#tab1');
setInterval(() => {
tab.deactivated = true;
Expand Down

0 comments on commit d7f6d5d

Please sign in to comment.