diff --git a/docs/doc-fragments/drawer.js b/docs/doc-fragments/drawer.js
index af00a98..5418fd0 100644
--- a/docs/doc-fragments/drawer.js
+++ b/docs/doc-fragments/drawer.js
@@ -29,7 +29,16 @@ module.exports = {
`You can combine the navigation bar element with the drawer menu for better results.`,
`Remember to apply the appropriate classes to any and all elements, as indicated in the examples. Failing to do so will result in the drawer menu not rendering or behaving properly.`
],
- customization: [],
+ customization: [
+ `Text color can be changed globally by changing the value of the --fore-color
variable. This will affect the text color of the toggle button and items inside the drawer container.`,
+ `Background color for the drawer container can be changed by changing the value of the --drawer-back-color
variable.`,
+ `Border color for the drawer container can be changed by changing the value of the --drawer-border-color
variable.`,
+ `Text color for the drawer close button can be changed by changing the values of the --drawer-close-color
.`,
+ `Background color for the drawer close button when focused or hovered over can be changed by changing the values of the --drawer-hover-back-color
.`,
+ `Universal margin for elements can be changed globally by changing the value of the --universal-margin
variable. As a rule of thumb, consider the universal margin to be the distance you want your paragraphs to have from the sides of the screen.`,
+ `Universal padding for elements can be changed globally by changing the value of the --universal-padding
variable.`,
+ `Universal border radius for elements can be changed globally by changing the value of the --universal-border-radius
variable.`
+ ],
modifiers: [
{
title : `Persistent drawer`,
diff --git a/docs/v3/DEVLOG.md b/docs/v3/DEVLOG.md
index 1f8f8dd..30843bb 100644
--- a/docs/v3/DEVLOG.md
+++ b/docs/v3/DEVLOG.md
@@ -177,8 +177,13 @@
- Documented `card` and `card section` to complete the `layout` module's docs.
- Altered the `dark` section colors, didn't really like them.
- Cleaned up certain parts of the docs just a little bit.
+
+## 20171118
- Documented `button` elements and input grouping.
- Documented `header`, `footer` and `nav`.
+
+## 20171119
+
- Documented `drawer`.
- Implemented search functionality, using `fuse`. It all works pretty well.
- Added `index.html` generation code in the build file, this will allow me to not load a script for the versioning.
@@ -188,3 +193,10 @@
- Updated links to open in new tabs when they are external.
- Generated new favicons.
- Everything should be ready to release `v3.0.0-alpha.1` tomorrow.
+
+## 20171120
+
+- Updated `.drawer` documentation to include customization.
+- Recompiled default flavor just in case.
+- Fixed the devlog showing wrong dates. **Hugging cat** was at it again, it seems!
+- Unleashed the first **Gluon** alpha unto the world!
diff --git a/docs/v3/docs.html b/docs/v3/docs.html
index 5ad66d0..47ac250 100644
--- a/docs/v3/docs.html
+++ b/docs/v3/docs.html
@@ -45,12 +45,12 @@
mini.css utilizes the ruleset of Normalize.css v7.0.0 to reliably deal with inconsistencies between browsers, while applying some tasteful defaults on top, such as using native font stack to figure out the best font for each device, setting the background and foreground colors, as well as the size of the text to 16px
and its line height to 1.5
.
/* Do not do this (use Sass instead) */ html { font-size: 14px; }
Don't: Avoid altering the base font size of 16px
directly in your CSS code, as it can cause problems with the display of certain elements.
--fore-color
variable.--back-color
variable.--border-color
variable. This affects the color of <hr>
elements.--universal-margin
variable. As a rule of thumb, consider the universal margin to be the distance you want your paragraphs to have from the sides of the screen.--universal-padding
variable.--a-link-color
and --a-visited-color
variables.--fore-color
variable. This will affect the color of the headings' main text.--secondary-fore-color
variable. This will affect the color of subheadings.--universal-margin
variable. As a rule of thumb, consider the universal margin to be the distance you want your paragraphs to have from the sides of the screen.--heading-ratio
variable. Bear in mind that the value of this variable must be unitless to work properly.alt
attribute to image elements on your web apps.<figcaption>
elements by changing the value of the --secondary-fore-color
variable.--universal-margin
variable. As a rule of thumb, consider the universal margin to be the distance you want your paragraphs to have from the sides of the screen.--fore-color
variable.--back-color
variable.--universal-margin
variable. As a rule of thumb, consider the universal margin to be the distance you want your paragraphs to have from the sides of the screen.--universal-padding
variable.cite
attribute of <blockquote>
elements is not mandatory and can be omitted. The element's sizing will be automatically adjusted according to the presence of the cite
attribute.--fore-color
variable. This will affect the text color of <code>
and <pre>
elements and background color of <kbd>
elements.--back-color
variable. This will affect the background color of <blockquote>
elements and text color of <kbd>
.<code>
and <pre>
elements by changing the value of the --secondary-back-color
variable.<blockquote>
elements by changing the value of the --secondary-fore-color
variable.<pre>
and <blockquote>
elements by changing the value of the --secondary-border-color
variable.<pre>
elements by changing the value of the --pre-color
variable.<blockquote>
elements by changing the value of the --blockquote-color
variable.--universal-margin
variable. As a rule of thumb, consider the universal margin to be the distance you want your paragraphs to have from the sides of the screen.--universal-padding
variable.--universal-border-radius
variable.<form> <fieldset> <legend>Simple form</legend> @@ -501,7 +501,7 @@Fluid & vertical grouping
You can make your input groups fluid (< </div> </div>
Don't: Avoid combining input groups with the grid system, as there might be overlapping styles.
The header element has been minimally styled, allowing you to create modern headers for your web apps. A header can include a logo element (.logo
), as well as buttons, links and labels, styled as buttons (.button
).
--nav-fore-color
variable.--nav-back-color
variable.--nav-border-color
variable.--nav-hover-back-color
variable.--nav-link-color
variable.--universal-margin
variable. As a rule of thumb, consider the universal margin to be the distance you want your paragraphs to have from the sides of the screen.--universal-padding
variable.--universal-border-radius
variable.--footer-fore-color
variable.--footer-back-color
variable.--footer-border-color
variable.--footer-link-color
variable.--universal-padding
variable.If you want your drawer menus to not expand into no <a href="#">Home</a> </div>
Don't: You should not place anything between the checkbox controlling the drawer and the container.
768px
wide.--fore-color
variable. This will affect the text color of the toggle button and items inside the drawer container.--drawer-back-color
variable.--drawer-border-color
variable.--drawer-close-color
.--drawer-hover-back-color
.--universal-margin
variable. As a rule of thumb, consider the universal margin to be the distance you want your paragraphs to have from the sides of the screen.--universal-padding
variable.--universal-border-radius
variable.