Accordion Web Component Using Stencil with Sass

Accordion Web Component Overview

Accordion Web Component is a simple and lightweight web component built with Stencil.js.

Using this Accordion Component

Installation via Node Modules

Install the component using NPM:
```
npm i stencil-sass-accordion
```

Include the script tag in your HTML file:

<script type="module" src="/node_modules/stencil-sass-accordion/dist/stencil-sass-accordion/stencil-sass-accordion.esm.js"></script>

CDN Integration

Alternatively, include the component directly from a CDN:

<script type="module" src="https://cdn.jsdelivr.net/npm/stencil-sass-accordion@0.0.5/dist/stencil-sass-accordion/stencil-sass-accordion.esm.js"></script>

Integration in HTML

After importing the component, integrate it into your HTML file:

<kh-accordion button-title="Button Title" panel-text="Panel Text"></kh-accordion>

Customization Options

Easily customize the accordion by updating the button-title and panel-text attributes:

<kh-accordion button-title="New Title" panel-text="New Text"></kh-accordion>

Example Using CDN

For a quick start, check out the example below using CDN:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script type="module" src="https://cdn.jsdelivr.net/npm/stencil-sass-accordion@0.0.5/dist/stencil-sass-accordion/stencil-sass-accordion.esm.js"></script>
  <title>Accordion Example</title>
</head>
<body>
  <kh-accordion button-title="Sample Title" panel-text="Sample Text"></kh-accordion>
</body>
</html>

khaledsAlshibani/stencil-sass-accordion