@gov-design-system-ce/components 4.2.9 → 4.6.0

package/dist/collection/pages/Button.js

@@ -1,1450 +0,0 @@
-class ButtonPage extends HTMLElement {
-    connectedCallback() {
-        this.innerHTML = `
-			<h3>Buttons</h3>
-
-				<gov-button color="primary" size="s" type="solid" >
-				Test Více
-			</gov-button>
-
-			<h4>Dropdown</h4>
-
-			<gov-layout>
-				<gov-layout-column>
-					<div class="container-view">
-						<gov-dropdown>
-							<gov-button color="primary" size="l" type="solid">
-								Více
-							</gov-button>
-							<ul slot="list" role="menu">
-								<li role="presentation">
-									<gov-button color="primary" type="base" size="l" expanded role="menuitem">
-										A další nabídka
-										<gov-icon slot="icon-end" name="search"></gov-icon>
-									</gov-button>
-								</li>
-								<li role="presentation">
-									<gov-button color="primary" type="base" size="l" expanded role="menuitem">
-										A další dlouhá nabídka
-										<gov-icon slot="icon-end" name="search"></gov-icon>
-									</gov-button>
-								</li>
-								<li role="presentation">
-									<gov-button color="primary" type="base" size="l" expanded role="menuitem">
-										A další
-										<gov-icon slot="icon-end" name="search"></gov-icon>
-									</gov-button>
-								</li>
-							</ul>
-						</gov-dropdown>
-					</div>
-				</gov-layout-column>
-				<gov-layout-column>
-					<div class="container-view">
-						<gov-dropdown position="right">
-							<gov-button color="primary" size="s" type="solid">
-								Více
-							</gov-button>
-							<ul slot="list" role="menu">
-								<li role="presentation">
-									<gov-button color="neutral" type="base" size="s" expanded role="menuitem">
-										A další nabídka
-										<gov-icon slot="icon-end" name="chevron-right"></gov-icon>
-									</gov-button>
-								</li>
-								<li role="presentation">
-									<gov-button color="neutral" type="base" size="s" expanded role="menuitem">
-										A další dlouhá nabídka
-										<gov-icon slot="icon-end" name="chevron-right"></gov-icon>
-									</gov-button>
-								</li>
-								<li role="presentation">
-									<gov-button color="neutral" type="base" size="s" expanded role="menuitem">
-										A další
-										<gov-icon slot="icon-end" name="chevron-right"></gov-icon>
-									</gov-button>
-								</li>
-							</ul>
-						</gov-dropdown>
-					</div>
-				</gov-layout-column>
-			</gov-layout>
-
-			<h4>Primary - solid</h4>
-
-			<div class="container-view">
-				<gov-button color="primary" size="xs" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" size="s" type="solid" href="http://localhost:3333/button">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" size="m" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" size="l" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" size="xl" type="solid" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-			</div>
-			<div class="container-view">
-				<gov-button color="primary" size="xs" type="solid" loading="0">
-					Odeslat
-				</gov-button>
-				<gov-button color="primary" size="s" type="solid" loading="0">
-					Odeslat
-				</gov-button>
-				<gov-button color="primary" size="s" type="solid" loading="1" disabled>
-					Odeslat
-				</gov-button>
-				<gov-button color="primary" type="solid" href="http://localhost:3333/button" loading="0">
-					Odeslat
-				</gov-button>
-				<gov-button color="primary" type="solid" href="http://localhost:3333/button" loading="1" disabled focusable="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="primary" size="l" type="solid" loading="true">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Odeslat
-				</gov-button>
-				<gov-button color="primary" size="l" type="solid" loading="true" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Odeslat
-				</gov-button>
-				<gov-button color="primary" size="xl" type="solid" loading="false">
-					Odeslat
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" size="xl" type="solid" loading="true" disabled>
-					Odeslat
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-			</div>
-			<div class="container-view">
-				<gov-button color="primary" size="xs" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" size="s" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" size="m" type="solid" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" size="l" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" size="xl" type="solid" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" size="m" type="solid" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" size="m" type="solid" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Primary - solid - expanded</h4>
-			<div class="container-view" style="display: flex; gap: 8px;">
-				<gov-button color="primary" type="solid" expanded="true">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Expanded
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="solid" expanded="true">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Expanded
-				</gov-button>
-				<gov-button color="primary" type="solid" expanded="true" loading="1">
-					Expanded
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="solid" expanded="true" loading="true">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Expanded
-				</gov-button>
-				<gov-button color="primary" type="solid" expanded="true" loading="false">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Expanded
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-			</div>
-			<gov-button color="primary" type="solid" expanded="true" loading="false">
-				<gov-icon slot="icon-start" name="search"></gov-icon>
-				Expanded
-				<gov-icon slot="icon-end" name="search"></gov-icon>
-			</gov-button>
-			<br>
-			<h4>Primary - solid - expanded mobile</h4>
-			<gov-button color="primary" type="solid" expanded-mobile="true" loading="false">
-				<gov-icon slot="icon-start" name="search"></gov-icon>
-				Expanded
-				<gov-icon slot="icon-end" name="search"></gov-icon>
-			</gov-button>
-			<br>
-			<gov-button color="primary" type="solid" expanded-mobile="true" loading="true">
-				<gov-icon slot="icon-start" name="search"></gov-icon>
-				Expanded
-				<gov-icon slot="icon-end" name="search"></gov-icon>
-			</gov-button>
-
-			<h4>Primary - outlined</h4>
-			<div class="container-view">
-				<gov-button color="primary" type="outlined" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="outlined" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="outlined" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="outlined" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="outlined" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="primary" type="outlined" href="http://localhost:3333/button" loading="true">
-					Odeslat
-				</gov-button>
-				<gov-button color="primary" type="outlined" href="http://localhost:3333/button" loading="false" disabled focusable="false">
-					Odeslat
-				</gov-button>
-			</div>
-
-			<div class="container-view">
-				<gov-button color="primary" type="outlined" size="xs">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="outlined" size="s">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="outlined" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="outlined" size="l">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="outlined" size="xl" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="outlined" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="outlined" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Primary - base</h4>
-			<div class="container-view">
-				<gov-button color="primary" type="base" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="base" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="base" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="base" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="base" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="primary" type="base" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="primary" type="base" href="http://localhost:3333/button" loading="true" disabled focusable="false">
-					Odeslat
-				</gov-button>
-			</div>
-
-			<div class="container-view">
-				<gov-button color="primary" type="base" size="xs">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="base" size="s">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="base" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="base" size="l">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="base" size="xl" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="base" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="base" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Primary - link</h4>
-			<div class="container-view">
-				<gov-button color="primary" type="link" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="link" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="link" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="link" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="primary" type="link" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large Primary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="primary" type="link" size="l" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="primary" type="link" size="l" href="http://localhost:3333/button" loading="1">
-					Odeslat
-				</gov-button>
-				<gov-button color="primary" type="link" size="m" href="http://localhost:3333/button" loading="0" disabled focusable="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="primary" type="link" size="m" href="http://localhost:3333/button" loading="true" disabled focusable="false">
-					Odeslat
-				</gov-button>
-			</div>
-			<br><br>
-
-			<h4>Neutral - solid</h4>
-			<div class="container-view">
-				<gov-button color="neutral" size="xs" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" size="s" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="solid" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" size="l" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" size="xl" type="solid" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="neutral" type="solid" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="neutral" type="solid" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-			<div class="container-view">
-				<gov-button color="neutral" size="xs" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" size="s" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="solid" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" size="l" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" size="xl" type="solid" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="solid" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="solid" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Neutral - outlined</h4>
-			<div class="container-view">
-				<gov-button color="neutral" type="outlined" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="outlined" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="outlined" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="outlined" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="outlined" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="neutral" type="outlined" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="neutral" type="outlined" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-
-			<div class="container-view">
-				<gov-button color="neutral" type="outlined" size="xs">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="outlined" size="s">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="outlined" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="outlined" size="l">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="outlined" size="xl" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="outlined" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="outlined" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Neutral - base</h4>
-			<div class="container-view">
-				<gov-button color="neutral" type="base" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="base" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="base" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="base" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="base" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="neutral" type="base" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="neutral" type="base" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-
-			<div class="container-view">
-				<gov-button color="neutral" type="base" size="xs">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="base" size="s">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="base" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="base" size="l">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="base" size="xl" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="base" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="base" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Neutral - link</h4>
-			<div class="container-view">
-				<gov-button color="neutral" type="link" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small Neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="link" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small Neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="link" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal Neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="link" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large Neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="neutral" type="link" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large Neutral
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="neutral" type="link" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="neutral" type="link" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-			<br><br>
-
-			<h4>Secondary - solid</h4>
-			<div class="container-view">
-				<gov-button color="secondary" size="xs" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" size="s" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="solid" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" size="l" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" size="xl" type="solid" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="secondary" type="solid" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="secondary" type="solid" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-			<div class="container-view">
-				<gov-button color="secondary" size="xs" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" size="s" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="solid" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" size="l" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" size="xl" type="solid" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="solid" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="solid" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Secondary - outlined</h4>
-			<div class="container-view">
-				<gov-button color="secondary" type="outlined" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="outlined" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="outlined" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="outlined" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="outlined" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="secondary" type="outlined" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="secondary" type="outlined" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-
-			<div class="container-view">
-				<gov-button color="secondary" type="outlined" size="xs">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="outlined" size="s">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="outlined" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="outlined" size="l">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="outlined" size="xl" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="outlined" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="outlined" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Secondary - base</h4>
-			<div class="container-view">
-				<gov-button color="secondary" type="base" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="base" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="base" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="base" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="base" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="secondary" type="base" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="secondary" type="base" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-
-			<div class="container-view">
-				<gov-button color="secondary" type="base" size="xs">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="base" size="s">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="base" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="base" size="l">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="base" size="xl" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="base" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="base" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Secondary - link</h4>
-			<div class="container-view">
-				<gov-button color="secondary" type="link" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small Secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="link" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small Secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="link" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal Secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="link" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large Secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="secondary" type="link" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large Secondary
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="secondary" type="link" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="secondary" type="link" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-			<br><br>
-
-			<h4>Warning - solid</h4>
-			<div class="container-view">
-				<gov-button color="warning" size="xs" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" size="s" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="solid" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" size="l" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" size="xl" type="solid" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="warning" type="solid" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="warning" type="solid" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-			<div class="container-view">
-				<gov-button color="warning" size="xs" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" size="s" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="solid" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" size="l" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" size="xl" type="solid" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="solid" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="solid" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Warning - outlined</h4>
-			<div class="container-view">
-				<gov-button color="warning" type="outlined" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="outlined" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="outlined" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="outlined" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="outlined" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="warning" type="outlined" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="warning" type="outlined" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-
-			<div class="container-view">
-				<gov-button color="warning" type="outlined" size="xs">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="outlined" size="s">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="outlined" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="outlined" size="l">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="outlined" size="xl" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="outlined" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="outlined" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Warning - base</h4>
-			<div class="container-view">
-				<gov-button color="warning" type="base" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="base" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="base" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="base" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="base" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="warning" type="base" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="warning" type="base" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-
-			<div class="container-view">
-				<gov-button color="warning" type="base" size="xs">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="base" size="s">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="base" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="base" size="l">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="base" size="xl" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="base" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="base" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Warning - link</h4>
-			<div class="container-view">
-				<gov-button color="warning" type="link" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="link" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="link" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="link" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="warning" type="link" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large warning
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="warning" type="link" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="warning" type="link" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-			<br><br>
-
-			<h4>Success - solid</h4>
-			<div class="container-view">
-				<gov-button color="success" size="xs" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" size="s" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="solid" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" size="l" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" size="xl" type="solid" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="success" type="solid" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="success" type="solid" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-			<div class="container-view">
-				<gov-button color="success" size="xs" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" size="s" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="solid" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" size="l" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" size="xl" type="solid" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="solid" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="solid" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Success - outlined</h4>
-			<div class="container-view">
-				<gov-button color="success" type="outlined" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="outlined" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="outlined" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="outlined" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="outlined" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="success" type="outlined" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="success" type="outlined" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-
-			<div class="container-view">
-				<gov-button color="success" type="outlined" size="xs">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="outlined" size="s">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="outlined" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="outlined" size="l">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="outlined" size="xl" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="outlined" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="outlined" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Success - base</h4>
-			<div class="container-view">
-				<gov-button color="success" type="base" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="base" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="base" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="base" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="base" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="success" type="base" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="success" type="base" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-
-			<div class="container-view">
-				<gov-button color="success" type="base" size="xs">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="base" size="s">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="base" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="base" size="l">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="base" size="xl" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="base" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="base" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Success - link</h4>
-			<div class="container-view">
-				<gov-button color="success" type="link" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="link" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="link" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="link" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="success" type="link" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large success
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="success" type="link" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="success" type="link" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-			<br><br>
-
-			<h4>Error - solid</h4>
-			<div class="container-view">
-				<gov-button color="error" size="xs" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" size="s" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="solid" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" size="l" type="solid">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" size="xl" type="solid" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="error" type="solid" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="error" type="solid" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-			<div class="container-view">
-				<gov-button color="error" size="xs" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" size="s" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="solid" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" size="l" type="solid">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" size="xl" type="solid" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="solid" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="solid" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Error - outlined</h4>
-			<div class="container-view">
-				<gov-button color="error" type="outlined" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="outlined" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="outlined" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="outlined" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="outlined" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="error" type="outlined" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="error" type="outlined" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-
-			<div class="container-view">
-				<gov-button color="error" type="outlined" size="xs">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="outlined" size="s">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="outlined" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="outlined" size="l">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="outlined" size="xl" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="outlined" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="outlined" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Error - base</h4>
-			<div class="container-view">
-				<gov-button color="error" type="base" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="base" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="base" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="base" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="base" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="error" type="base" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="error" type="base" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-
-			<div class="container-view">
-				<gov-button color="error" type="base" size="xs">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="base" size="s">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="base" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="base" size="l">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="base" size="xl" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="base" loading="false">
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="base" loading="true" disabled>
-					<gov-icon slot="icon-start" name="x-lg"></gov-icon>
-				</gov-button>
-			</div>
-
-			<h4>Error - link</h4>
-			<div class="container-view">
-				<gov-button color="error" type="link" size="xs">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Small error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="link" size="s">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Small error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="link" disabled>
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Normal error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="link" size="l">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					Large error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<gov-button color="error" type="link" disabled size="xl">
-					<gov-icon slot="icon-start" name="search"></gov-icon>
-					X-Large error
-					<gov-icon slot="icon-end" name="search"></gov-icon>
-				</gov-button>
-				<br>
-				<gov-button color="error" type="link" href="http://localhost:3333/button" loading="false">
-					Odeslat
-				</gov-button>
-				<gov-button color="error" type="link" href="http://localhost:3333/button" loading="true" disabled>
-					Odeslat
-				</gov-button>
-			</div>
-		`;
-    }
-}
-if (customElements.get('button-page') === undefined) {
-    customElements.define('button-page', ButtonPage);
-}
-//# sourceMappingURL=Button.js.map