mirror of
https://github.com/shoelace-style/webawesome.git
synced 2026-01-12 20:19:13 +00:00
74 lines
3.1 KiB
HTML
74 lines
3.1 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||
<meta name="description" content="For when you don’t need the whole boot.">
|
||
<link rel="icon" href="../source/img/favicon.png">
|
||
<link rel="stylesheet" href="../source/css/shoelace.css">
|
||
<link rel="stylesheet" href="../source/css/_homepage.css">
|
||
<link rel="stylesheet" href="https://cdn.rawgit.com/AGMStudio/prism-theme-one-dark/f81fe477/prism-onedark.css">
|
||
<title>Shoelace.css – a back to the basics CSS starter kit</title>
|
||
</head>
|
||
<body>
|
||
|
||
<header id="head" class="text-center">
|
||
<h1><img src="../source/img/wordmark.svg" alt="Shoelace logo"></h1>
|
||
|
||
<p class="text-muted text-small">
|
||
A back to the basics CSS starter kit. For when you don’t need the whole boot.
|
||
</p>
|
||
</header>
|
||
|
||
<main id="wrap">
|
||
<div id="content">
|
||
<p>
|
||
Shoelace.css is a starter kit, not a framework. Think of it as a CSS reset sprinkled with
|
||
helpful components. Bootstrap users will find it familiar, yet refreshing.
|
||
</p>
|
||
|
||
<p>
|
||
Shoelace is highly customizable through CSS variables. It doesn’t require Less, Sass, or any
|
||
preprocessing at all. Just link to <code>shoelace.css</code> and add customizations directly
|
||
to your stylesheet.
|
||
</p>
|
||
|
||
<pre><code class="language-html"><link rel="stylesheet" href="shoelace.css">
|
||
|
||
<style>
|
||
:root {
|
||
--body-color: white;
|
||
--body-bg-color: black;
|
||
--color-primary: #09d;
|
||
}
|
||
</style></code></pre>
|
||
|
||
<p>
|
||
Shoelace was created by <a href="https://twitter.com/claviska">@claviska</a> for
|
||
<a href="https://www.surrealcms.com/">Surreal CMS</a>. You can use it for free under the
|
||
terms of the MIT license.
|
||
</p>
|
||
|
||
<div class="margin-y-medium text-center">
|
||
<a href="docs/installing.html" class="button button-big">Documentation →</a>
|
||
</div>
|
||
|
||
<p class="text-center">
|
||
<a class="github-button" href="https://github.com/claviska/shoelace-css/fork" data-size="large" aria-label="Fork claviska/shoelace-css on GitHub">Fork</a>
|
||
<a class="github-button" href="https://github.com/claviska/shoelace-css/releases" data-icon="octicon-cloud-download" data-size="large" aria-label="Download claviska/shoelace-css on GitHub">Download</a>
|
||
<a class="github-button" href="https://github.com/claviska/shoelace-css/issues" data-icon="octicon-issue-opened" data-size="large" aria-label="Issue claviska/shoelace-css on GitHub">Report a Bug</a>
|
||
<a class="github-button" href="https://github.com/claviska/shoelace-css" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star claviska/shoelace-css on GitHub">Star</a>
|
||
</p>
|
||
|
||
<p class="text-center text-small text-muted">
|
||
© A Beautiful Site, LLC
|
||
</p>
|
||
</div>
|
||
</main>
|
||
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.6.0/prism.min.js"></script>
|
||
<script async defer src="https://buttons.github.io/buttons.js"></script>
|
||
</body>
|
||
</html>
|