Table of Contents
About the project
Hello there! We are the team behind the
Usage
-
Configure docsify-accordion-plugin:
<script>
window.$docsify = {
useSGDSAccordion: true
};
</script>
(back to top)
-
Insert style/script into docsify document:
<head>
<link rel="stylesheet" href="https://unpkg.com/@developerportalsg/docsify-accordion-plugin@latest/dist/accordion.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@govtechsg/sgds@1.4.0/css/sgds.css" />
</head>
<body>
<script src="https://unpkg.com/@developerportalsg/docsify-accordion-plugin@latest/dist/docsify-plugin-accordion.min.js"></script>
</body>
(back to top)
- Create an accordion how you would using markdown
<details>
<summary>This is a super cool title</summary>
<p>This is a super cool paragraph</p>
<small>This is a super cool small paragraph</small>
<b>Veni Vidi Vici</b>
</details>
<details>
<summary><h1>Very Big Title</h1></summary>
</details>
(back to top)
Options
Here are the attributes to customise the logic or styles of the accordion
<details is-open=true is-size="small" is-color="is-warning">
<summary>...</summary>
...
</details>
details Attributes | Type | Description |
---|
is-open | boolean | To expand the accordion on page load. |
is-*size* | string | Replace *size* with is-small, is-medium & is-large for various text sizes. |
is-*color* | string | Replace *color* with contextual text color classes (is-danger, is-warning, is-success etc.) for various background color. |
(back to top)
Contributing
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".
Don't forget to give the project a star! Thanks again!
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature
) - Commit your Changes (
git commit -m 'Add some AmazingFeature'
) - Push to the Branch (
git push origin feature/AmazingFeature
) - Open a Pull Request
(back to top)
Built with
Our plugin is built using Docsify, a lightweight documentation generator, along with other technologies such as HTML, JavaScript and CSS.
License
Distributed under the MIT License. See LICENSE.txt
for more information.
(back to top)
References
You can find our plugin on GitHub. Please refer to the README file for detailed instructions on how to use it.
(back to top)