Newer
Older
<!DOCTYPE html>
<html dir="ltr" lang="en">
<head>
<link rel="stylesheet" type="text/css" href="/build/huds-lib.css" />
<link rel="stylesheet" type="text/css" href="/fonts/fonts.css" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" />
<title>Stencil Component Starter</title>
<script type="module" src="/build/huds-lib.esm.js"></script>
<script nomodule src="/build/huds-lib.js"></script>
</head>
<body>
<h1>Helsinki University web components demo</h1>
<hy-baseline>
<hy-row>
<hy-button icon="hy-icon-arrow-left">Primary</hy-button>
<hy-button variant="secondary">Secondary</hy-button>
<hy-button disabled>Primary disabled</hy-button>
<hy-button disabled variant="secondary">Secondary Disabled</hy-button>
</hy-row>
<hy-row>
<hy-button variant="secondary" icon="hy-icon-arrow-left">Icon on left</hy-button>
<hy-button variant="secondary" icon-right="hy-icon-arrow-right">Icon on right</hy-button>
<hy-button variant="secondary" url="https://google.com" size="large"> Call to the action!</hy-button>