From 56d9da358bd29200781e8099d0bfc213a93fd92b Mon Sep 17 00:00:00 2001
From: Vladimir Lugovsky <lugovsky.v@gmail.com>
Date: Mon, 16 May 2016 15:48:44 +0300
Subject: [PATCH] Update 2016-05-16T12:48:41.169Z

---
 articles/001-getting-started/index.html       |  1 +
 .../002-installation-guidelines/index.html    |  1 +
 articles/011-changing-color-scheme/index.html | 48 +++++-------
 articles/012-project-structure/index.html     |  1 +
 articles/013-create-new-page/index.html       |  1 +
 articles/014-switch-to-blur-theme/index.html  | 78 +++++++++++++++++++
 articles/051-sidebar/index.html               |  1 +
 index.html                                    |  2 +-
 8 files changed, 104 insertions(+), 29 deletions(-)
 create mode 100644 articles/014-switch-to-blur-theme/index.html

diff --git a/articles/001-getting-started/index.html b/articles/001-getting-started/index.html
index aa3bbff..edbd312 100644
--- a/articles/001-getting-started/index.html
+++ b/articles/001-getting-started/index.html
@@ -33,6 +33,7 @@
           <div class="nav-docs section">
             <h3>Customization</h3>
             <ul>
+              <li><a href="/blur-admin/articles/014-switch-to-blur-theme/">Switching to Blur Theme</a></li>
               <li><a href="/blur-admin/articles/011-changing-color-scheme/">Changing Color Scheme</a></li>
               <li><a href="/blur-admin/articles/012-project-structure/">Project Structure</a></li>
               <li><a href="/blur-admin/articles/013-create-new-page/">Create New Page</a></li>
diff --git a/articles/002-installation-guidelines/index.html b/articles/002-installation-guidelines/index.html
index 33a5df9..c541753 100644
--- a/articles/002-installation-guidelines/index.html
+++ b/articles/002-installation-guidelines/index.html
@@ -33,6 +33,7 @@
           <div class="nav-docs section">
             <h3>Customization</h3>
             <ul>
+              <li><a href="/blur-admin/articles/014-switch-to-blur-theme/">Switching to Blur Theme</a></li>
               <li><a href="/blur-admin/articles/011-changing-color-scheme/">Changing Color Scheme</a></li>
               <li><a href="/blur-admin/articles/012-project-structure/">Project Structure</a></li>
               <li><a href="/blur-admin/articles/013-create-new-page/">Create New Page</a></li>
diff --git a/articles/011-changing-color-scheme/index.html b/articles/011-changing-color-scheme/index.html
index cc45c77..aee3291 100644
--- a/articles/011-changing-color-scheme/index.html
+++ b/articles/011-changing-color-scheme/index.html
@@ -33,6 +33,7 @@
           <div class="nav-docs section">
             <h3>Customization</h3>
             <ul>
+              <li><a href="/blur-admin/articles/014-switch-to-blur-theme/">Switching to Blur Theme</a></li>
               <li><a href="/blur-admin/articles/011-changing-color-scheme/" class="active">Changing Color Scheme</a></li>
               <li><a href="/blur-admin/articles/012-project-structure/">Project Structure</a></li>
               <li><a href="/blur-admin/articles/013-create-new-page/">Create New Page</a></li>
@@ -47,40 +48,31 @@
         </div>
         <div class="inner-content">
           <h1>Changing Color Scheme</h1>
-          <div class="subHeader"></div><p>If you want to change template color scheme, you just need to do 4 simple&nbsp;steps:</p>
-<p>1) Change color scheme in javascript (<code>src/app/theme/theme.constants.js</code>):</p>
-<pre><code class="lang-javascript">  <span class="comment">// main color scheme</span>
-  <span class="keyword">var</span> colorScheme = {
-    primary: <span class="string">'#209e91'</span>,
-    info: <span class="string">'#2dacd1'</span>,
-    success: <span class="string">'#90b900'</span>,
-    warning: <span class="string">'#dfb81c'</span>,
-    danger: <span class="string">'#e85656'</span>,
-  };
+          <div class="subHeader"></div><p>If you want to change template color scheme, you need to do 4 simple&nbsp;steps:</p>
+<p>1) Override theme and colors in config (<code>src/app/theme/theme.config.js</code>):</p>
+<pre><code class="lang-javascript">  baConfigProvider.changeTheme({blur: <span class="literal">true</span>});
 
-  <span class="comment">// background color palette</span>
-  <span class="keyword">var</span> bgColorPalette = {
-    blueStone: <span class="string">'#005562'</span>,
-    surfieGreen: <span class="string">'#0e8174'</span>,
-    silverTree: <span class="string">'#6eba8c'</span>,
-    gossip: <span class="string">'#b9f2a1'</span>,
-    white: <span class="string">'#ffffff'</span>,
-  };
+  baConfigProvider.changeColors({
+    <span class="keyword">default</span>: <span class="string">'rgba(#000000, 0.2)'</span>,
+    defaultText: <span class="string">'#ffffff'</span>,
+    dashboard: {
+      white: <span class="string">'#ffffff'</span>,
+    },
+  });
 </code></pre>
+<p>Note:</p>
 <ul>
-<li>css colors and javascript colors in colorScheme object should be the&nbsp;same</li>
-<li>background color palette is used for the pie traffic chart and calendar on the dashboard&nbsp;page</li>
+<li>you shouldn’t change default config directly (<code>theme.configProvider.js</code>). Instead of that you can override color scheme on the configuration step (<code>theme.config.js</code>)</li>
 </ul>
-<p>2) Change colors in css (<code>src/sass/theme/conf/_colorScheme.scss</code>):</p>
-<pre><code class="lang-scss"><span class="variable">$primary</span>: <span class="number">#209e91</span> !default;
-<span class="variable">$info</span>: <span class="number">#2dacd1</span> !default;
-<span class="variable">$success</span>: <span class="number">#90b900</span> !default;
-<span class="variable">$warning</span>: <span class="number">#dfb81c</span> !default;
-<span class="variable">$danger</span>: <span class="number">#e85656</span> !default;
+<p>2) Create your own color scheme, like <code>src/sass/theme/conf/colorScheme/_mint.scss</code> and <code>src/sass/theme/conf/colorScheme/_blur.scss</code>. And replace it in <code>src/sass/theme/common.scss</code> file:</p>
+<pre><code class="lang-scss">@<span class="keyword">import</span> <span class="string">'theme/conf/colorScheme/mint'</span>;
+</code></pre>
+<p>to</p>
+<pre><code class="lang-scss">@<span class="keyword">import</span> <span class="string">'theme/conf/colorScheme/custom'</span>;
 </code></pre>
 <p>3) Replace background images: <code>src/app/assets/img/blur-bg.jpg</code> and <code>src/app/assets/img/blur-bg-blurred.jpg</code></p>
-<p>4) build source files and run application: <code>gulp</code> and <code>gulp serve</code></p>
-<p>Below is an example of template with another color&nbsp;scheme:</p>
+<p>4) Run application <code>gulp serve</code></p>
+<p>Here’s an example of template with another color&nbsp;scheme:</p>
 <p><img src="/blur-admin/articles/011-changing-color-scheme/new-color-scheme.jpg" alt=""></p>
 
         </div>
diff --git a/articles/012-project-structure/index.html b/articles/012-project-structure/index.html
index 7edf7d3..c869d30 100644
--- a/articles/012-project-structure/index.html
+++ b/articles/012-project-structure/index.html
@@ -33,6 +33,7 @@
           <div class="nav-docs section">
             <h3>Customization</h3>
             <ul>
+              <li><a href="/blur-admin/articles/014-switch-to-blur-theme/">Switching to Blur Theme</a></li>
               <li><a href="/blur-admin/articles/011-changing-color-scheme/">Changing Color Scheme</a></li>
               <li><a href="/blur-admin/articles/012-project-structure/" class="active">Project Structure</a></li>
               <li><a href="/blur-admin/articles/013-create-new-page/">Create New Page</a></li>
diff --git a/articles/013-create-new-page/index.html b/articles/013-create-new-page/index.html
index aaa4790..d164a0f 100644
--- a/articles/013-create-new-page/index.html
+++ b/articles/013-create-new-page/index.html
@@ -33,6 +33,7 @@
           <div class="nav-docs section">
             <h3>Customization</h3>
             <ul>
+              <li><a href="/blur-admin/articles/014-switch-to-blur-theme/">Switching to Blur Theme</a></li>
               <li><a href="/blur-admin/articles/011-changing-color-scheme/">Changing Color Scheme</a></li>
               <li><a href="/blur-admin/articles/012-project-structure/">Project Structure</a></li>
               <li><a href="/blur-admin/articles/013-create-new-page/" class="active">Create New Page</a></li>
diff --git a/articles/014-switch-to-blur-theme/index.html b/articles/014-switch-to-blur-theme/index.html
new file mode 100644
index 0000000..4292243
--- /dev/null
+++ b/articles/014-switch-to-blur-theme/index.html
@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    <meta name="viewport" content="width=device-width">
+    <meta name="keywords" content="admin,dashboard,template,angular,bootstrap,blur,panel,html,css,javascript">
+    <title>BlurAdmin documentation - Switching to Blur Theme</title>
+    <link rel="alternate" href="http://localhost:8080/feed.xml" type="application/rss+xml" title="Ramblings of an immor(t)al demigod">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900italic,900|Anonymous+Pro:400,700,400italic,700italic&amp;subset=latin,greek,greek-ext,vietnamese,cyrillic-ext,latin-ext,cyrillic">
+    <link rel="stylesheet" href="/blur-admin/css/main.css">
+    <link rel="shortcut icon" href="/blur-admin/images/favicon.png">
+  </head>
+  <body>
+    <div class="container">
+      <div class="nav-main">
+        <div class="wrap"><a href="/blur-admin/" class="nav-home"><img src="/blur-admin/images/blur-admin-logo.png" width="36" height="36" class="nav-logo">&nbsp;<span class="blur-label">Blur</span>Admin</a>
+          <ul class="nav-site nav-site-internal">
+            <li><a href="/blur-admin/">Home</a></li>
+            <li><a href="/blur-admin/articles/001-getting-started/" class="active">Docs</a></li>
+          </ul><span class="nav-docs-right">Need some help? Let us know! <a href="mailto:contact@akveo.com">contact@akveo.com</a></span>
+        </div>
+      </div>
+      <section class="content wrap documentationContent">
+        <div class="nav-docs">
+          <div class="nav-docs section">
+            <h3>Quick Start</h3>
+            <ul>
+              <li><a href="/blur-admin/articles/001-getting-started/">Getting Started</a></li>
+              <li><a href="/blur-admin/articles/002-installation-guidelines/">Installation Guidelines</a></li>
+            </ul>
+          </div>
+          <div class="nav-docs section">
+            <h3>Customization</h3>
+            <ul>
+              <li><a href="/blur-admin/articles/014-switch-to-blur-theme/" class="active">Switching to Blur Theme</a></li>
+              <li><a href="/blur-admin/articles/011-changing-color-scheme/">Changing Color Scheme</a></li>
+              <li><a href="/blur-admin/articles/012-project-structure/">Project Structure</a></li>
+              <li><a href="/blur-admin/articles/013-create-new-page/">Create New Page</a></li>
+            </ul>
+          </div>
+          <div class="nav-docs section">
+            <h3>Components</h3>
+            <ul>
+              <li><a href="/blur-admin/articles/051-sidebar/">Sidebar</a></li>
+            </ul>
+          </div>
+        </div>
+        <div class="inner-content">
+          <h1>Switching to Blur Theme</h1>
+          <div class="subHeader"></div><p>If you want to switch theme to the blur, you need to do 2 simple&nbsp;steps:</p>
+<p>1) Override theme and colors in config (<code>src/app/theme/theme.config.js</code>):</p>
+<pre><code class="lang-javascript">  baConfigProvider.changeTheme({blur: <span class="literal">true</span>});
+
+  baConfigProvider.changeColors({
+    <span class="keyword">default</span>: <span class="string">'rgba(#000000, 0.2)'</span>,
+    defaultText: <span class="string">'#ffffff'</span>,
+    dashboard: {
+      white: <span class="string">'#ffffff'</span>,
+    },
+  });
+</code></pre>
+<p>2) Replace theme in <code>src/sass/theme/common.scss</code> file:</p>
+<pre><code class="lang-scss">@<span class="keyword">import</span> <span class="string">'theme/conf/colorScheme/mint'</span>;
+</code></pre>
+<p>to</p>
+<pre><code class="lang-scss">@<span class="keyword">import</span> <span class="string">'theme/conf/colorScheme/blur'</span>;
+</code></pre>
+
+        </div>
+      </section>
+      <footer class="wrap">
+        <div class="left">Powered by Angular, Bootsrap, Gulp and more...</div>
+        <div class="right">© 2015–2016 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
+      </footer>
+    </div>
+  </body>
+</html>
\ No newline at end of file
diff --git a/articles/051-sidebar/index.html b/articles/051-sidebar/index.html
index 4860f0b..d1cd87b 100644
--- a/articles/051-sidebar/index.html
+++ b/articles/051-sidebar/index.html
@@ -33,6 +33,7 @@
           <div class="nav-docs section">
             <h3>Customization</h3>
             <ul>
+              <li><a href="/blur-admin/articles/014-switch-to-blur-theme/">Switching to Blur Theme</a></li>
               <li><a href="/blur-admin/articles/011-changing-color-scheme/">Changing Color Scheme</a></li>
               <li><a href="/blur-admin/articles/012-project-structure/">Project Structure</a></li>
               <li><a href="/blur-admin/articles/013-create-new-page/">Create New Page</a></li>
diff --git a/index.html b/index.html
index 15958e4..fc50bc5 100644
--- a/index.html
+++ b/index.html
@@ -25,7 +25,7 @@
         <div class="hero-content">
           <div class="wrap">
             <div class="text"><strong>Blur<span class="white-text">Admin</span></strong></div>
-            <div class="minitext">Angular admin dashboard front-end framework</div>
+            <div class="minitext">Angular admin panel front-end framework</div>
             <div class="buttons-unit"><a href="/blur-admin/articles/002-installation-guidelines/" class="button">Installation guidelines</a><a href="/blur-admin/articles/001-getting-started/" class="button">Documentation</a></div>
             <div class="admin-screenshots">
               <div class="admin-screenshot">