From a97fea6596ae4692eb019b19877e4f3a1fc5f3d0 Mon Sep 17 00:00:00 2001 From: Angelos Chalaris Date: Fri, 21 Oct 2016 17:26:20 +0300 Subject: [PATCH] New demo page for v2 --- docs/v2/DEVLOG.md | 1 + docs/v2/index.html | 113 +++++++++++++++++++++++++++++++++++++++++++-- 2 files changed, 110 insertions(+), 4 deletions(-) diff --git a/docs/v2/DEVLOG.md b/docs/v2/DEVLOG.md index e20a6ef..7bcc583 100644 --- a/docs/v2/DEVLOG.md +++ b/docs/v2/DEVLOG.md @@ -153,3 +153,4 @@ - Added definitions for small screen sizes, optimized, test on local demo. - Added definitions for medium and large screen sizes, optimized and tested locally. - Updated grid definitions to add `$grid-column-padding` so that users can customize the padding for columns. +- Rebuilt demo page from scratch for version 2, added a lot of nice styles etc. \ No newline at end of file diff --git a/docs/v2/index.html b/docs/v2/index.html index 6ac82cb..de764db 100644 --- a/docs/v2/index.html +++ b/docs/v2/index.html @@ -8,14 +8,119 @@ - - + + - +
+
+
+
+ +

mini.css

+ v2.0 +
+
+
+
+
+
+
+
+

Minimal

+ +

+

mini.css is one of the lightest front-end frameworks on the web: about 5KB gzipped. This helps your websites load faster, while still looking great!

+
+
+
+
+

Reponsive

+ +

+

mini.css is built in such a way that it will look great on most devices and especially phones and tablets. This allows you to easily tailor your websites to different users!

+
+
+
+
+

Style-agnostic

+ +

+

mini.css gives you the power of customization, using its fully moddable flavors. This will give you control over how your websites look and allow great designs to stand out!

+
+
+
+
+
+
+
+

Below you can see a showcase of the features and styles included in the default flavor of mini.css.

+
+
+
+
+
+
+

Typography Style for common textual elements

+
+
+
+
+
+

Heading 1 Subheading

+
+
+

Heading 2 Subheading

+
+
+

Heading 3 Subheading

+
+
+
+
+

Heading 4 Subheading

+
+
+
Heading 5 Subheading
+
+
+
Heading 6 Subheading
+
+
+
+
+
+
+

This is a paragraph with some sample text. Did you know mini.css v2.0 is codenamed Fermion? No? Well, now you do! Maybe you want to know what our inline elements look like. For example a link to the Github repository of mini.css looks like that! Neat, right? Maybe you want to see some inline code or some sample input. Oh, also small text is cool, along with its siblings: the subscripthi! and the superscripthello!. We use highlights quite a lot as well. Apart from the primary color, you can also try the secondary and tertiary colors. If you wanna be fancy, maybe use a tag or a bubble. All of these work well inside headings and the like. To finish our typography tour, check out the preformatted code block below.


+
+
+
function sum(num1, num2) {
+    var num3 = num1 + num2;
+    console.log('Result: ' + num3);
+}
+
+
+
+
+
+ + + \ No newline at end of file