<section class="section" id="buttons">
	<h2 class="section-title">Buttons</h2>

	<div class="block">
		<button class="btn btn-primary">Primary</button>
		<button class="btn btn-primary with-icon"><i class="ph ph-house"></i> Primary</button>
		<button class="btn btn-secondary with-icon"><i class="ph ph-code"></i> Secondary</button>
		<button class="btn btn-accent with-icon"><i class="ph ph-envelope-simple"></i> Accent</button>
		<button class="btn btn-info with-icon"><i class="ph ph-question"></i> Info</button>
		<button class="btn btn-danger with-icon"><i class="ph ph-brackets-curly"></i> Danger</button>
		<button class="btn btn-warning with-icon"><i class="ph ph-warning"></i> Warning</button>
		<button class="btn btn-success with-icon"><i class="ph ph-codepen-logo"></i> Success</button>
	</div>

	<div class="block">
		<button class="btn btn-primary btn-small">Small</button>
		<button class="btn btn-primary">Normal</button>
		<button class="btn btn-primary btn-large">Large</button>
	</div>

	<div class="block">
		<button class="btn btn-primary" disabled>Disabled</button>
		<button class="btn btn-primary with-icon" disabled>
			<i class="ph ph-warning"></i> Disabled
		</button>
	</div>
</section>