example collapse

[ZhangChengLin]

Description

Motivation & Context

Add examples of different directions of collapse

Type of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Refactoring (non-breaking change)
• Breaking change (fix or feature that would change existing functionality)

Checklist

• I have read the contributing guidelines
• My code follows the code style of the project (using npm run lint)
• My change introduces changes to the documentation
• I have updated the documentation accordingly
• I have added tests to cover my changes
• All new and existing tests passed

Live previews

• https://deploy-preview-38558--twbs-bootstrap.netlify.app/docs/5.3/examples/collapse/

Related issues

[ZhangChengLin]

The image file is screenshotted by third-party software, so it is not clear whether there is a security problem.

For the folding part, you can use hugo's code reuse to save code bytes later.

Some naming structures are subject to optimization.

[julien-deramond]

Before reviewing the code, @mdo what do you think about having this new example?

[ZhangChengLin]

Maybe these examples are too simple. By using the existing css styles of bootstrap, you can complete the layout of the following pictures, and then cooperate with your own JavaScript to complete the layout of some small functions.

The URL below has a specific address, but because it contains more codes, it will not be displayed.

The specific direction of movement depends on the developer, and the example is just a starter of what these components can do.

https://jzeg-net.github.io/

[mdo]

It's a wild example lol! I'm into it though, it's something unexpected.