Html Start

<!doctype html>
<html class="no-js  fonts-loaded" lang="en" dir="ltr">

<head>
    <meta charset="utf-8" />
    <title>Kalong—Styleguide, v0.0.1-alpha.1 Home</title>
    <meta name="description" content="" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <link rel="apple-touch-icon" sizes="180x180" href="../../images/apple-touch-icon.png" />
    <link rel="icon" type="image/png" href="../../images/favicon-32x32.png" sizes="32x32" />
    <link rel="icon" type="image/png" href="../../images/favicon-16x16.png" sizes="16x16" />
    <link rel="manifest" href="/site.webmanifest" />
    <link rel="mask-icon" href="../../images/safari-pinned-tab.svg" color="#000000" />
    <meta name="msapplication-TileColor" content="#000000">
    <meta name="theme-color" content="#000000" />

    <!-- add any og/twitter-card stuff here -->

    <!-- you can/should remove the styleguide-styles for production -->
    <style>
        .styleguide-pattern-wrapper {
            margin: 0 0 20px;
        }
    </style>

    <link rel="stylesheet" href="../../styles/main.css" />

</head>

<body>
<!doctype html>
<html class="no-js{% if debug %}  fonts-loaded{% endif %}{% if site.modifiers %}  {{ site.modifiers }}{% endif %}" lang="{{ site.lang }}" dir="{{ site.dir }}">
  <head>
    <meta charset="utf-8" />
    <title>{{ site.title }}{% if page.title %} — {{ page .title }}{% else %} Home{%endif %}</title>
    <meta name="description" content="{% if page.description %}{{ page.description }}{% else %}{{ site.description }}{% endif %}" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <link rel="apple-touch-icon" sizes="180x180" href="{{ '/images/apple-touch-icon.png' | path }}" />
    <link rel="icon" type="image/png" href="{{ '/images/favicon-32x32.png' | path }}" sizes="32x32" />
    <link rel="icon" type="image/png" href="{{ '/images/favicon-16x16.png' | path }}" sizes="16x16" />
    <link rel="manifest" href="/site.webmanifest" />
    <link rel="mask-icon" href="{{ '/images/safari-pinned-tab.svg' | path }}" color="{{ site.themecolor }}" />
    <meta name="msapplication-TileColor" content="{{ site.themecolor }}">
    <meta name="theme-color" content="{{ site.themecolor }}" />

    <!-- add any og/twitter-card stuff here -->

    {% if styleguide %}
      <!-- you can/should remove the styleguide-styles for production -->
      <style>
        .styleguide-pattern-wrapper {
          margin: 0 0 20px;
        }
      </style>
    {% endif %}
    {% if debug %}
      <link rel="stylesheet" href="{{ '/styles/main.css' | path }}" />
    {% else %}
      <link rel="stylesheet" href="{{ '/styles/main.min.css' | path }}" />
      <link rel="preload" href="{{ '/fonts/roboto-regular.woff2' | path }}" as="font" type="font/woff2" crossorigin />
    {% endif %}
  </head>
  <body>
debug: true
styleguide: true
shared:
  breakpoints:
    s: 480
    m: 640
    l: 720
    xl: 960
    xxl: 1100
    xxxl: 1400
    custom: '(max-width: 30em)'
  fonts:
    default:
      family: Roboto
      fallback: sans-serif
      weight: 400
      style: normal
      fontface: true
      file: roboto-regular
site:
  lang: en
  dir: ltr
  title: 'Kalong—Styleguide, v0.0.1-alpha.1'
  description: null
  themecolor: '#000000'
  modifiers: null
globals:
  nav:
    main:
      - href: '#somepage'
        label: Somepage

There are no notes for this item.