Created Tabs (markdown)

Tabs.md

@@ -0,0 +1,50 @@
+**mini.css** provides you with a tab system based entirely on CSS elements. You can customize your tab system very easily, using the `make-tabs` **mixin** provided in the [_tab.scss](https://github.com/Chalarangelo/mini.css/blob/master/scss/mini-extra/_tab.scss) partial file.
+
+## Definition
+
+	make-tabs(
+		$tabs-name, 
+		$tabs-min-height, 
+		$tabs-label-spacing, 
+		$tabs-label-height,
+		$tabs-label-padding,  
+		$tabs-label-color, 
+		$tabs-label-bg-color,
+		$tabs-active-label-color, 
+		$tabs-active-label-bg-color,
+		$tabs-border-color, 
+		$tabs-label-border-radius, 
+		$tabs-active-label-stripe,
+		$tabs-inactive-label-hover-style, 
+		$tabs-inactive-label-hover-style-percentage,
+		$tabs-content-bg-color, 
+		$tabs-content-padding)
+
+## Parameters
+
+- $tabs-name                                  :	The class name for the tab system's container.
+- $tabs-label-spacing                         :	The spacing between tab labels.
+- $tabs-label-height                          : The height of the tab labels.
+- $tabs-label-padding                         :	The padding of the tab labels.
+- $tabs-label-color                           :	The text color of the tab labels.
+- $tabs-label-bg-color                        : The background color of the tab labels.
+- $tabs-active-label-color                    : The text color of the active tab's label.
+- $tabs-active-label-bg-color                 :	The background color of the active tab's label.
+- $tabs-border-color                          :	Border color for the tab system. [1]
+- $tabs-label-border-radius                   : Border radius for the tab labels.
+- $tabs-active-label-stripe                   : The style of the colored stripe that appears on the active tab's label. [2]
+- $tabs-inactive-label-hover-style            :	Hover/active/focus style of the tab labels. [3]
+- $tabs-inactive-label-hover-style-percentage :	Hover/active/focus style of the tab labels percentage modifier.
+- $tabs-content-bg-color                      : The background color of the active tab's content.
+- $tabs-content-padding                       :	The padding of the active tab's content.
+
+**Notes:**
+
+- [1] : The color specified in $tabs-border-color applies to all borders in the tab system. This includes borders in the tab labels and active tab's content.
+- [2] : The style of the colored stripe is a border style so you should specify it as such.
+- [3] : The values that $tabs-hover-style can take are `lighten` and `darken`. The inside condition only checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
+
+## Remarks
+
+- The text in the active tab's content pane is colored based on the `body` element's color. This can be manually changed.
+- Some design decisions are already made beforehand to make sure styling choices by the user appear correctly on most devices. This includes some margins, positioning etc. These properties can be manually changed by tweaking the mixin itself or the resulting CSS file.