Accordion

Use our custom accordion element to build vertically collapsing accordions. Bootstrap docs

Simple Accordion

Professional Design

Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel.

View example's code

import Accordion from 'components/reuseable/accordion';

<Accordion 
  no="One"
  type="plain" 
  expand={false} 
  heading="Professional Design"
  body="Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh"
/>

Accordion with Background

Professional Design

Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel.

View example's code

import Accordion from 'components/reuseable/accordion';

<Accordion 
  no="One" 
  expand={false} 
  heading="Professional Design"
  body="Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh"
/>

Accordion with Shadow

Professional Design

Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel.

View example's code

import Accordion from 'components/reuseable/accordion';

<Accordion 
  no="One" 
  expand={false} 
  type="shadow-lg" 
  heading="Professional Design"
  body="Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh"
/>

Props

Name	Type	Default
no*	string	-
heading*	string	-
body*	string	-
expand*	boolean	-
type	plain \| shadow-lg	empty

Think unique and be creative. Make a difference with Sandbox.

Everything you need to create your next unique and professional website, including impressive and ready-made blocks and pages.

Buy Sandbox

PROJECT PAGES

SINGLE PROJECTS

Usage

Styleguide

Elements

Accordion

Simple Accordion

Accordion with Background

Accordion with Shadow

Props

Think unique and be creative. Make a difference with Sandbox.