<div data-ui="header" class="header">
    <div data-ui="label" class="label">Label</div>
    <div data-ui="icon" class="icon">
        <div class="open">
            <svg width="100%" height="100%" viewBox="0 0 30 30" version="1.1" xmlns="http://www.w3.org/2000/svg">
                <g>        
                    <line x1="5" y1="15" x2="25" y2="15" stroke-width="4" fill="#ffffff" stroke="#ffffff"/>
                </g>
            </svg>
        </div>
        <div class="closed">
            <svg width="100%" height="100%" viewBox="0 0 30 30" version="1.1" xmlns="http://www.w3.org/2000/svg">
                <g>        
                    <line x1="5" y1="15" x2="25" y2="15" stroke-width="4" fill="#ffffff" stroke="#ffffff"/>
                    <line x1="15" y1="5" x2="15" y2="25" stroke-width="4" fill="#ffffff" stroke="#ffffff"/>
                </g>
            </svg>
        </div>
    </div>
</div>
<div data-ui="content-wrapper" class="content-wrapper">
    <div class="button-list">
        <div data-ui="button"></div>
        <div data-ui="button"></div>
        <div data-ui="button"></div>
        <div data-ui="button"></div>
    </div>
    <div data-ui="content" class="content">
        <!-- content-template will be inserted here -->
    </div>
</div>