mirror of
https://github.com/Chalarangelo/mini.css.git
synced 2025-04-22 13:21:56 +02:00
Releasing v1.1.0
This commit is contained in:
Angelos Chalaris
parent
63a6e2479a
commit
d5eeb24b1b
@ -13,6 +13,7 @@
|
||||
- Updated label style definitions for consistency.
|
||||
- Minor changes to progress component styling (should be virtually identical).
|
||||
- Minor changes to panel component styling (should be virtually identical).
|
||||
- Bootstrap flavor added.
|
||||
|
||||
## v1.0.2
|
||||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
# mini.css
|
||||
# mini.css v1.1.0
|
||||
## A minimal Sass-y responsive mobile-first style-agnostic CSS framework
|
||||
|
||||
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
<!-- For local testing only -->
|
||||
<!-- <link rel="stylesheet" href="../flavors/mini-default.min.css"> -->
|
||||
<!-- Correct link -->
|
||||
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v1.0.2/flavors/mini-default.min.css">
|
||||
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v1.1.0/flavors/mini-default.min.css">
|
||||
<style>
|
||||
.footer{background-color:#272727; color:#ddd;}
|
||||
.footer a, .footer a:hover, .footer a:visited, .footer a:visited:hover, .footer a:active, .footer a:visited:active{color: #fff;}
|
||||
@ -55,7 +55,7 @@
|
||||
<div class="col xs-12 md-10">
|
||||
<h1>mini.css<small> a minimal Sass-y responsive mobile-first style-agnostic CSS framework</small></h1>
|
||||
<p>If you want to create your own flavor, get involved or report an issue, head over to <strong>mini.css</strong>'s <a href="https://github.com/Chalarangelo/mini.css">Github repository</a> or the <a href="https://github.com/Chalarangelo/mini.css/wiki">wiki</a>. If you want to give <strong>mini.css</strong> a try using the default flavor, paste the following code inside your HTML page's <code><head></code> tag:</p>
|
||||
<pre style="overflow: auto;"><link rel=<span class="txt-green">"stylesheet"</span> href=<span class="txt-blue">"https://cdn.rawgit.com/Chalarangelo/mini.css/v1.0.2/flavors/mini-default.min.css"</span>></pre>
|
||||
<pre style="overflow: auto;"><link rel=<span class="txt-green">"stylesheet"</span> href=<span class="txt-blue">"https://cdn.rawgit.com/Chalarangelo/mini.css/v1.1.0/flavors/mini-default.min.css"</span>></pre>
|
||||
|
||||
<p>If you'd rather use a package manager, <strong>mini.css</strong> is available in both Bowser and NPM:</p>
|
||||
<pre style="margin-left: 1px; border-left: 5px solid #3f84b3; border-top-left-radius: 0; border-bottom-left-radius: 0;"> <span class="txt-blue">bower install</span> mini.css</pre>
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
<!-- For local testing only -->
|
||||
<!-- <link rel="stylesheet" href="../flavors/mini-niteowl.min.css"> -->
|
||||
<!-- Correct link -->
|
||||
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v1.0.2/flavors/mini-niteowl.min.css">
|
||||
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v1.1.0/flavors/mini-niteowl.min.css">
|
||||
<style>
|
||||
.panelcode{ border-top-left-radius:0; border-top-right-radius:0; margin-bottom:0; }
|
||||
pre{ overflow: auto; }
|
||||
@ -71,7 +71,7 @@
|
||||
<h1>mini.css<small> a minimal Sass-y responsive mobile-first style-agnostic CSS framework</small></h1>
|
||||
<p>Below you can see each module in action, along with certain suggestions on how to add functionality to the various components. Bear in mind that this demo is for the <strong>NiteOwl</strong> flavor. Naming conventions may vary between flavors, however the structure and functionality of the modules should be the same. Please refer to specific flavors for those differences. The <strong><a href="https://chalarangelo.github.io/mini.css/modules">Default</a></strong> flavor uses the same naming conventions for the module components, so you won't have any trouble. If you are migrating from Bootstrap and want to use the <strong>Bootstrap</strong> flavor, most naming conventions are based on the original naming conventions of Bootstrap 3.3.7.</p>
|
||||
<p><strong>To use the Default flavor, add the following code inside your HTML page's <code><head></code> tag:</strong></p>
|
||||
<pre style="overflow: auto;"><link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v1.0.2/flavors/mini-niteowl.min.css"></pre><br>
|
||||
<pre style="overflow: auto;"><link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v1.1.0/flavors/mini-niteowl.min.css"></pre><br>
|
||||
|
||||
<h2 id="base">Base</h2>
|
||||
<p>The Base module contains customized typography rules, colors and most of the functionality provided in <a href="https://necolas.github.io/normalize.css/">normalize.css</a>. Below we showcase some of the most important typography styles.</p>
|
||||
@ -611,6 +611,15 @@
|
||||
<span class="green" style="width:20%;"></span>
|
||||
<span style="width:40%;"></span>
|
||||
</div></pre>
|
||||
</div>
|
||||
|
||||
<h3>Progress spinners</h3>
|
||||
<div class="panel" ><h4 class="head">Example</h4><br>
|
||||
<p>Spinner dots: <span class="spinner-dots"></span></p>
|
||||
<p>Spinner round: <span class="spinner-round"></span></p>
|
||||
<br>
|
||||
<pre class="panelcode"><span class="spinner-dots"></span>
|
||||
<span class="spinner-round"></span></pre>
|
||||
</div><br>
|
||||
|
||||
<h2 id="carousel">Carousel</h2>
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
<!-- For local testing only -->
|
||||
<!-- <link rel="stylesheet" href="../flavors/mini-default.min.css"> -->
|
||||
<!-- Correct link -->
|
||||
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v1.0.2/flavors/mini-default.min.css">
|
||||
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v1.1.0/flavors/mini-default.min.css">
|
||||
<style>
|
||||
.panelcode{ border-top-left-radius:0; border-top-right-radius:0; margin-bottom:0; }
|
||||
pre{ overflow: auto; }
|
||||
@ -71,7 +71,7 @@
|
||||
<h1>mini.css<small> a minimal Sass-y responsive mobile-first style-agnostic CSS framework</small></h1>
|
||||
<p>Below you can see each module in action, along with certain suggestions on how to add functionality to the various components. Bear in mind that this demo is for the <strong>Default</strong> flavor. Naming conventions may vary between flavors, however the structure and functionality of the modules should be the same. Please refer to specific flavors for those differences. The <strong><a href="https://chalarangelo.github.io/mini.css/modules-niteowl">NiteOwl</a></strong> flavor uses the same naming conventions for the module components, so you won't have any trouble. If you are migrating from Bootstrap and want to use the <strong>Bootstrap</strong> flavor, most naming conventions are based on the original naming conventions of Bootstrap 3.3.7.</p>
|
||||
<p><strong>To use the Default flavor, add the following code inside your HTML page's <code><head></code> tag:</strong></p>
|
||||
<pre style="overflow: auto;"><link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v1.0.2/flavors/mini-default.min.css"></pre><br>
|
||||
<pre style="overflow: auto;"><link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v1.1.0/flavors/mini-default.min.css"></pre><br>
|
||||
|
||||
<h2 id="base">Base</h2>
|
||||
<p>The Base module contains customized typography rules, colors and most of the functionality provided in <a href="https://necolas.github.io/normalize.css/">normalize.css</a>. Below we showcase some of the most important typography styles.</p>
|
||||
@ -611,6 +611,15 @@
|
||||
<span class="green" style="width:20%;"></span>
|
||||
<span style="width:40%;"></span>
|
||||
</div></pre>
|
||||
</div>
|
||||
|
||||
<h3>Progress spinners</h3>
|
||||
<div class="panel" ><h4 class="head">Example</h4><br>
|
||||
<p>Spinner dots: <span class="spinner-dots"></span></p>
|
||||
<p>Spinner round: <span class="spinner-round"></span></p>
|
||||
<br>
|
||||
<pre class="panelcode"><span class="spinner-dots"></span>
|
||||
<span class="spinner-round"></span></pre>
|
||||
</div><br>
|
||||
|
||||
<h2 id="carousel">Carousel</h2>
|
||||
|
||||
@ -15,4 +15,9 @@ Below is a list of all the currently available flavors:
|
||||
- Light gray text on dark blue background
|
||||
- High contrast
|
||||
- Simple and clean styling
|
||||
- Full flavor
|
||||
|
||||
## Bootstrap
|
||||
|
||||
- Similar to the Bootstrap framework's style.
|
||||
- Full flavor
|
||||
Loading…
x
Reference in New Issue
Block a user