diff --git a/gulpfile.js b/gulpfile.js
index 3401661..5d65eed 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -58,6 +58,7 @@ gulp.task('minify-css', ['minify-404-css', 'minify-auth-css'], function () {
var imgSrc = [
'src/assets/img/*',
'src/assets/pictures/*',
+ 'src/app/lookAndFeel/thumbs/*',
'src/app/pages/dashboard/widgets/timeline/img/*',
'src/app/pages/profile/img/*',
'src/app/pages/icons/widgets/kameleon-img/*',
diff --git a/src/app/components/contentTop/_contentTop.scss b/src/app/components/contentTop/_contentTop.scss
index f87f06e..267c520 100644
--- a/src/app/components/contentTop/_contentTop.scss
+++ b/src/app/components/contentTop/_contentTop.scss
@@ -24,4 +24,13 @@ h1.al-title {
font-size: 18px;
font-weight: 100;
}
+}
+
+.al-look {
+ float: right;
+ margin-right: 10px;
+ padding-top: 10px;
+ > a {
+ font-size: 19px;
+ }
}
\ No newline at end of file
diff --git a/src/app/components/contentTop/contentTop.html b/src/app/components/contentTop/contentTop.html
index 10304c7..1aec116 100644
--- a/src/app/components/contentTop/contentTop.html
+++ b/src/app/components/contentTop/contentTop.html
@@ -6,4 +6,8 @@
Home
{{ activePageTitle }}
+
\ No newline at end of file
diff --git a/src/app/tplSkin/thumbs/01_default.jpg b/src/app/tplSkin/thumbs/01_default.jpg
new file mode 100644
index 0000000..67bb1a8
Binary files /dev/null and b/src/app/tplSkin/thumbs/01_default.jpg differ
diff --git a/src/app/tplSkin/thumbs/02_transparent.jpg b/src/app/tplSkin/thumbs/02_transparent.jpg
new file mode 100644
index 0000000..bf253ad
Binary files /dev/null and b/src/app/tplSkin/thumbs/02_transparent.jpg differ
diff --git a/src/app/tplSkin/thumbs/03_blue.jpg b/src/app/tplSkin/thumbs/03_blue.jpg
new file mode 100644
index 0000000..1a16f0e
Binary files /dev/null and b/src/app/tplSkin/thumbs/03_blue.jpg differ
diff --git a/src/app/tplSkin/thumbs/04_peachy.jpg b/src/app/tplSkin/thumbs/04_peachy.jpg
new file mode 100644
index 0000000..004f409
Binary files /dev/null and b/src/app/tplSkin/thumbs/04_peachy.jpg differ
diff --git a/src/app/tplSkin/thumbs/05_material.jpg b/src/app/tplSkin/thumbs/05_material.jpg
new file mode 100644
index 0000000..cb9d6f4
Binary files /dev/null and b/src/app/tplSkin/thumbs/05_material.jpg differ
diff --git a/src/app/tplSkin/thumbs/06_transblue.jpg b/src/app/tplSkin/thumbs/06_transblue.jpg
new file mode 100644
index 0000000..355c260
Binary files /dev/null and b/src/app/tplSkin/thumbs/06_transblue.jpg differ
diff --git a/src/app/tplSkin/thumbs/07_grey.jpg b/src/app/tplSkin/thumbs/07_grey.jpg
new file mode 100644
index 0000000..7655371
Binary files /dev/null and b/src/app/tplSkin/thumbs/07_grey.jpg differ
diff --git a/src/app/tplSkin/tplSkin.constants.js b/src/app/tplSkin/tplSkin.constants.js
new file mode 100644
index 0000000..69ec7c6
--- /dev/null
+++ b/src/app/tplSkin/tplSkin.constants.js
@@ -0,0 +1,52 @@
+/**
+ * @author v.lugovsky
+ * created on 18.11.2015
+ */
+(function() {
+ 'use strict';
+
+ var SKIN_CLASS_PREFIX = 'badmin';
+
+ var ADMIN_STYLES = [
+ {
+ name: 'Default',
+ bodyClass: '',
+ thumbnailUrl: 'img/01_default.jpg'
+ },
+ {
+ name: 'Transparent',
+ bodyClass: SKIN_CLASS_PREFIX + '-transparent',
+ thumbnailUrl: 'img/02_transparent.jpg'
+ },
+ {
+ name: 'Blue',
+ bodyClass: SKIN_CLASS_PREFIX + '-blue',
+ thumbnailUrl: 'img/03_blue.jpg'
+ },
+ {
+ name: 'Peachy',
+ bodyClass: SKIN_CLASS_PREFIX + '-peachy',
+ thumbnailUrl: 'img/04_peachy.jpg'
+ },
+ {
+ name: 'Material',
+ bodyClass: SKIN_CLASS_PREFIX + '-material',
+ thumbnailUrl: 'img/05_material.jpg'
+ },
+ {
+ name: 'Transblue',
+ bodyClass: SKIN_CLASS_PREFIX + '-transblue',
+ thumbnailUrl: 'img/06_transblue.jpg'
+ },
+ {
+ name: 'Grey',
+ bodyClass: SKIN_CLASS_PREFIX + '-grey',
+ thumbnailUrl: 'img/07_grey.jpg'
+ }
+ ];
+
+ blurAdminApp
+ .constant('tplSkinClassPrefix', SKIN_CLASS_PREFIX)
+ .constant('tplSkinEnum', ADMIN_STYLES);
+
+})();
diff --git a/src/app/tplSkin/tplSkinManager.service.js b/src/app/tplSkin/tplSkinManager.service.js
new file mode 100644
index 0000000..1868df6
--- /dev/null
+++ b/src/app/tplSkin/tplSkinManager.service.js
@@ -0,0 +1,39 @@
+/**
+ * @author v.lugovsky
+ * created on 18.11.2015
+ */
+(function() {
+ 'use strict';
+
+ blurAdminApp
+ .service('tplSkinManager', tplSkinManager);
+
+ tplSkinManager.$inject = ['$document', 'tplSkinClassPrefix'];
+ function tplSkinManager($document, tplSkinClassPrefix) {
+
+ var activeSkin = null;
+
+ this.setActiveSkin = function(skin) {
+ activeSkin = skin;
+ if (activeSkin) {
+ _removeSkinBodyClassIfPresent();
+ _addSkinBodyClass(activeSkin);
+ }
+ };
+
+ function _removeSkinBodyClassIfPresent() {
+ var body = $document[0].body;
+ var $body = angular.element(body);
+ body.className.split(/\s+/).forEach(function(className) {
+ if (className.indexOf(tplSkinClassPrefix) === 0) {
+ $body.removeClass(className);
+ }
+ });
+ }
+
+ function _addSkinBodyClass(skin) {
+ angular.element($document[0].body).addClass(skin.bodyClass);
+ }
+ }
+
+})();
diff --git a/src/app/tplSkin/tplSkinPanel.directive.js b/src/app/tplSkin/tplSkinPanel.directive.js
new file mode 100644
index 0000000..ee279de
--- /dev/null
+++ b/src/app/tplSkin/tplSkinPanel.directive.js
@@ -0,0 +1,25 @@
+/**
+ * @author v.lugovsky
+ * created on 18.11.2015
+ */
+(function() {
+ 'use strict';
+
+ blurAdminApp
+ .directive('tplSkinPanel', tplSkinPanel);
+
+ tplSkinPanel.$inject = ['tplSkinEnum', 'tplSkinManager'];
+ function tplSkinPanel(tplSkinEnum, tplSkinManager) {
+ return {
+ templateUrl: 'app/tplSkin/tplSkinPanel.html',
+ link: function(scope) {
+ scope.skins = tplSkinEnum;
+
+ scope.setActiveSkin = function(option) {
+ tplSkinManager.setActiveSkin(option);
+ };
+ }
+ };
+ }
+
+})();
diff --git a/src/app/tplSkin/tplSkinPanel.html b/src/app/tplSkin/tplSkinPanel.html
new file mode 100644
index 0000000..76906f8
--- /dev/null
+++ b/src/app/tplSkin/tplSkinPanel.html
@@ -0,0 +1,10 @@
+
+
+
+
+
![]()
+
+
+
+
+