Skip to content
Snippets Groups Projects
Normal view Permalink
index.html 3.12 KiB
Newer Older
  • Learn to ignore specific revisions
    • Arto Iijalainen's avatar
    Initial version of the design system library.
    Arto Iijalainen committed
    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 
    <!DOCTYPE html>
<html dir="ltr" lang="en">
  <head>
    <link
      rel="stylesheet"
      type="text/css"
      href="/build/hy-design-system-demo.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/hy-design-system-demo.esm.js"></script>
    <script nomodule src="/build/hy-design-system-demo.js"></script>
  </head>
  <body>
    <h1>Helsinki University web components demo</h1>
    <hy-docs-container>
    Markus Kaarto's avatar
    Git install  
    Markus Kaarto committed
    22 
          <hy-baseline>
    Arto Iijalainen's avatar
    Initial version of the design system library.
    Arto Iijalainen committed
    23 24 25 26 27 28 29 30 31 32 33 34 35 36 
            <hy-button icon="hy-icon-arrow-left" icon-right="hy-icon-arrow-right"
          >Hello there!</hy-button
        >
        <hy-button
          variant="secondary"
          icon="hy-icon-arrow-left"
          icon-right="hy-icon-arrow-right"
          >Hello there!</hy-button
        >
        <hy-button
          variant="outline"
          icon="hy-icon-hy-logo"
          icon-right="hy-icon-arrow-right"
          >Hello there!</hy-button
    Markus Kaarto's avatar
    Git install  
    Markus Kaarto committed
    37 38 39 40 41 42 43 44 45 
            ></hy-baseline
      >
      <hy-baseline
        ><hy-heading heading="h1">This is a Heading 1</hy-heading>
        <hy-heading heading="h2">This is a Heading 2</hy-heading>
        <hy-heading heading="h3">This is a Heading 3</hy-heading>
        <hy-heading heading="h4">This is a Heading 4</hy-heading>
        <hy-heading heading="h5">This is a Heading 5</hy-heading>
        <hy-heading heading="h6">This is a Heading 6</hy-heading></hy-baseline
    Arto Iijalainen's avatar
    Initial version of the design system library.
    Arto Iijalainen committed
    46 
          >
    Markus Kaarto's avatar
    New components  
    Markus Kaarto committed
    47 
          <hy-ingress>
    Markus Kaarto's avatar
    Axe puppeteer  
    Markus Kaarto committed
    48 49 50 51 
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac orci
        nisl. Nam at arcu eget enim interdum rhoncus eu nec turpis. Duis in est
        id nunc dictum lobortis. Nullam magna lectus, hendrerit tempus pharetra
        at, cursus sit amet orci
    Markus Kaarto's avatar
    New components  
    Markus Kaarto committed
    52 53 
          </hy-ingress>
      <hy-paragraph-text>
    Markus Kaarto's avatar
    Axe puppeteer  
    Markus Kaarto committed
    54 55 56 57 58 59 60 61 62 
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac orci
        nisl. Nam at arcu eget enim interdum rhoncus eu nec turpis. Duis in est
        id nunc dictum lobortis. Nullam magna lectus, hendrerit tempus pharetra
        at, cursus sit amet orci. Aenean in pulvinar mi. Nulla facilisi. Etiam
        elementum malesuada ante, quis facilisis arcu varius consectetur.
        Phasellus eu nisl elementum, laoreet sem condimentum, hendrerit urna. Ut
        eu lorem et nunc consectetur bibendum. Nulla sed orci urna. Vivamus ac
        lectus ex. Nam sit amet tincidunt leo. In sed nunc eu odio semper
        maximus vel suscipit ligula. In hac habitasse platea dictumst.
    Markus Kaarto's avatar
    New components  
    Markus Kaarto committed
    63 64 
          </hy-paragraph-text>
    Markus Kaarto's avatar
    Axe puppeteer  
    Markus Kaarto committed
    65 66 67 68 69 
          <hy-tiny-text
        >Lorem ipsum dolor sit amet, consectetur adipiscing elit.</hy-tiny-text
      >

      <hy-link
    Markus Kaarto's avatar
    New components  
    Markus Kaarto committed
    70 71 72 73 74 75 76 77 78 79 80 81 82 83 
            url="https://www.google.com"
        text-content="Regular link"
        aria-label="Regular link"
        is-external="false"
      >
      </hy-link>
      <hy-link
        variant="within-paragraph"
        text-content="Link within paragraph"
        aria-label="Link within paragraph"
        url="https://www.google.com"
        is-external="true"
      >
      </hy-link>
    Markus Kaarto's avatar
    dockerize development environment  
    Markus Kaarto committed
    84 
          <h1>This is docker!</h1>
    Arto Iijalainen's avatar
    Initial version of the design system library.
    Arto Iijalainen committed
    85 86 87 
        </hy-docs-container>
  </body>
</html>