steevcss/index.html
2022-03-13 15:27:29 +01:00

62 lines
3.3 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>steevcss</title>
<link rel="stylesheet" href="https://steevlp.github.io/steevcss/dist/steevcss.bundled.min.css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.0/styles/default.min.css">
</head>
<body>
<header style="box-shadow: 0 2px 0px rgba(0, 0, 0, 0.356);">
<h1 class="nav-logo">SteevCSS</h1>
<input id="nav-toggle" type="checkbox" class="nav-toggle">
<label for="nav-toggle" class="nav-toggle-label">
<span></span>
</label>
<nav>
<ul>
<li><a href="/steevcss/">Home</a></li>
<li><a href="/steevcss/docs/index.html">DOCS</a></li>
</ul>
</nav>
</header>
<div class="embed" style="border-radius: 0; background-color: #3498db; color: white; padding: 2%;box-shadow: 0 2px 0px rgba(0, 0, 0, 0.356);">
<div class="container" style="text-align: center;">
<h1>SteevCSS</h1>
<p>A simple lightweig Web Development Library written in SASS and JavaScript</p>
</div>
</div>
<br>
<div class="container">
<div class="row">
<div class="col-2"></div>
<div class="col-8">
<h1>SteevCSS to boost your web design proccess</h1>
<p>With premade and customizable elements such as the embed or alert elements this library helps you on your first steps when starting your new webapp. SteevCSS is written so you have to barely use css to change colours and thats it</p>
</div>
<div class="col-2"></div>
</div>
<div class="row">
<div class="col-1"></div>
<div class="col-10">
<h1>Installation</h1>
<p>either by using the hosted version or by getting it from the <a target="_blank" class="link" href="https://github.com/steevLP/steevcss/releases">releases</a> tab on <a target="_blank" class="link" href="https://github.com/steevLP/steevcss">Github</a></p>
<pre>
<code class="language-html">
<link rel="stylesheet" href="https://steevlp.github.io/steevcss/dist/steevcss.bundled.min.css">
<!-- <script src="https://steevlp.github.io/steevcss/dist/steevcss.js"></script> -->
</code>
</pre>
due to an issue that only should appear when displying code the script tag for the optional Javascript file is commented out if using it, don't add it as comment.
</div>
<div class="col-1"></div>
</div>
</div>
<script src="https://steevlp.github.io/steevcss/dist/steevcss.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.0/highlight.min.js"></script>
<script>hljs.highlightAll();</script>
</body>
</html>