mirror/mini-css
1
0
Fork 0
mirror of https://github.com/Chalarangelo/mini.css.git synced 2025-04-21 21:01:51 +02:00
Code Issues Releases Wiki Activity

Ready to release v2.0.2

Browse Source
This commit is contained in:
Angelos Chalaris 2017-01-02 17:54:23 +02:00
parent f003c7b658
commit d32fb49f54
18 changed files with 68 additions and 58 deletions

6
CHANGELOG.md

@ -1,5 +1,11 @@
# Changelog
## v2.0.2
- Added a new flavor, **sucroa**.
- Updated color palette for **default** flavor to deal with colorblindness issues.
- Added hugging cat.
## v2.0.1
- Updated module structure. `_core.scss` no longer contains all `@import` statements, but they are now included in the flavor files.

3
README.md

@ -1,4 +1,4 @@
# mini.css v2.0.1
# mini.css v2.0.2
## A minimal, responsive, style-agnostic CSS toolkit
![Logo](/docs/page_thumb.PNG)
@ -49,6 +49,7 @@ To develop some other part of **mini.css**:
## Contributors
- Angelos Chalaris (@chalarangelo)
- Angeliki Daskalakis (@angiedaskalakis)
- Rory Primrose (@roryprimrose)
## License

10
docs/card.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Card</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;
@ -57,13 +57,13 @@
border-top: 1px solid #bdbdbd;
}
}
.box-colored.green { background: #1b5e20; }
.box-colored.green { background: #689f38; }
.do {
border-top: 15px solid #558b2f;
border-top: 15px solid #689f38;
padding-top: 10px;
}
.dont {
border-top: 15px solid #f44336;
border-top: 15px solid #e53935;
padding-top: 10px;
}
.box-colored {

10
docs/contextual.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Contextual</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;
@ -57,13 +57,13 @@
border-top: 1px solid #bdbdbd;
}
}
.box-colored.green { background: #1b5e20; }
.box-colored.green { background: #689f38; }
.do {
border-top: 15px solid #558b2f;
border-top: 15px solid #689f38;
padding-top: 10px;
}
.dont {
border-top: 15px solid #f44336;
border-top: 15px solid #e53935;
padding-top: 10px;
}
.box-colored {

4
docs/core.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Core</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;

4
docs/customization.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Customization</title>
<meta charset="utf-8">
@ -28,7 +28,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;

4
docs/flavors.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Flavors</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;

10
docs/grid.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Grid</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;
@ -57,13 +57,13 @@
border-top: 1px solid #bdbdbd;
}
}
.box-colored.green { background: #1b5e20; }
.box-colored.green { background: #689f38; }
.do {
border-top: 15px solid #558b2f;
border-top: 15px solid #689f38;
padding-top: 10px;
}
.dont {
border-top: 15px solid #f44336;
border-top: 15px solid #e53935;
padding-top: 10px;
}
.box-colored {

6
docs/index.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Minimal, responsive, style-agnostic CSS toolkit</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;
@ -109,7 +109,7 @@
<div class="col-sm">
<h2>Setup &amp; usage</h2>
<p>You can import the default flavor of <strong>mini.css</strong> in your webpage by simply adding the following reference inside your HTML page's <code>&lt;head&gt;</code> tag:</p>
<pre>&lt;<span class="fore-tertiary">link</span> <span class="fore-secondary">rel</span>=<span class="fore-primary">&quot;stylesheet&quot;</span> <span class="fore-secondary">href</span>=<span class="fore-primary">&quot;https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css&quot;</span>&gt;</pre><br>
<pre>&lt;<span class="fore-tertiary">link</span> <span class="fore-secondary">rel</span>=<span class="fore-primary">&quot;stylesheet&quot;</span> <span class="fore-secondary">href</span>=<span class="fore-primary">&quot;https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css&quot;</span>&gt;</pre><br>
<p>If you want to download the package using your favorite package manager, you can use either <strong>Bower</strong> or <strong>NPM</strong>:</p>
<div class="row">
<div class="col-sm-12 col-md-6">

10
docs/input_control.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Input Control</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;
@ -57,13 +57,13 @@
border-top: 1px solid #bdbdbd;
}
}
.box-colored.green { background: #1b5e20; }
.box-colored.green { background: #689f38; }
.do {
border-top: 15px solid #558b2f;
border-top: 15px solid #689f38;
padding-top: 10px;
}
.dont {
border-top: 15px solid #f44336;
border-top: 15px solid #e53935;
padding-top: 10px;
}
.box-colored {

4
docs/modules.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Modules</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;

10
docs/navigation.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Navigation</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;
@ -57,13 +57,13 @@
border-top: 1px solid #bdbdbd;
}
}
.box-colored.green { background: #1b5e20; }
.box-colored.green { background: #689f38; }
.do {
border-top: 15px solid #558b2f;
border-top: 15px solid #689f38;
padding-top: 10px;
}
.dont {
border-top: 15px solid #f44336;
border-top: 15px solid #e53935;
padding-top: 10px;
}
.box-colored {

10
docs/progress.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Progress</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;
@ -57,13 +57,13 @@
border-top: 1px solid #bdbdbd;
}
}
.box-colored.green { background: #1b5e20; }
.box-colored.green { background: #689f38; }
.do {
border-top: 15px solid #558b2f;
border-top: 15px solid #689f38;
padding-top: 10px;
}
.dont {
border-top: 15px solid #f44336;
border-top: 15px solid #e53935;
padding-top: 10px;
}
.box-colored {

6
docs/quick_reference.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Quick Reference</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;
@ -108,7 +108,7 @@
</div>
<div class="section">
<p>You can import the default flavor of <strong>mini.css</strong> in your webpage by simply adding the following reference inside your HTML page's <code>&lt;head&gt;</code> tag:</p>
<pre>&lt;<span class="fore-tertiary">link</span> <span class="fore-secondary">rel</span>=<span class="fore-primary">&quot;stylesheet&quot;</span> <span class="fore-secondary">href</span>=<span class="fore-primary">&quot;https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css&quot;</span>&gt;</pre><br>
<pre>&lt;<span class="fore-tertiary">link</span> <span class="fore-secondary">rel</span>=<span class="fore-primary">&quot;stylesheet&quot;</span> <span class="fore-secondary">href</span>=<span class="fore-primary">&quot;https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css&quot;</span>&gt;</pre><br>
<p>If you want to download the package using your favorite package manager, you can use either <strong>Bower</strong> or <strong>NPM</strong>:</p>
<div class="row">
<div class="col-sm-12 col-md-6">

10
docs/tab.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Tab</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;
@ -57,13 +57,13 @@
border-top: 1px solid #bdbdbd;
}
}
.box-colored.green { background: #1b5e20; }
.box-colored.green { background: #689f38; }
.do {
border-top: 15px solid #558b2f;
border-top: 15px solid #689f38;
padding-top: 10px;
}
.dont {
border-top: 15px solid #f44336;
border-top: 15px solid #e53935;
padding-top: 10px;
}
.box-colored {

10
docs/table.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Table</title>
<meta charset="utf-8">
@ -33,7 +33,7 @@
}
.box-centered { text-align: center; }
.box-colored { background: #0277bd; border-radius: 2px; padding: 14px; margin-bottom: 8px; min-height: 14px;}
.box-colored.red { background: #b71c1c; }
.box-colored.red { background: #e53935; }
.box-centered > .card.fluid {
-webkit-box-pack: start;
-webkit-box-align: start;
@ -57,13 +57,13 @@
border-top: 1px solid #bdbdbd;
}
}
.box-colored.green { background: #1b5e20; }
.box-colored.green { background: #689f38; }
.do {
border-top: 15px solid #558b2f;
border-top: 15px solid #689f38;
padding-top: 10px;
}
.dont {
border-top: 15px solid #f44336;
border-top: 15px solid #e53935;
padding-top: 10px;
}
.box-colored {

6
docs/utility.html

@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.1/dist/mini-default.min.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v2.0.2/dist/mini-default.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>mini.css - Utility</title>
<meta charset="utf-8">
@ -59,11 +59,11 @@
}
.box-colored.green { background: #1b5e20; }
.do {
border-top: 15px solid #558b2f;
border-top: 15px solid #689f38;
padding-top: 10px;
}
.dont {
border-top: 15px solid #f44336;
border-top: 15px solid #e53935;
padding-top: 10px;
}
.box-colored {

3
docs/v2/DEVLOG.md

@ -727,3 +727,6 @@
- Merged pull request for `sucroa` flavor.
- Documented `sucroa` flavor in `flavors.html`.
- Updated `README` and `CHANGELOG`.
- Updated `.do` and `.dont` classes for doc pages.
- Doc pages updated to use v2.0.2.