From d2f8c1a4b3ca4c5331a9ba325df6e34383eebd14 Mon Sep 17 00:00:00 2001 From: KostyaDanovsky Date: Fri, 13 May 2016 22:18:49 +0300 Subject: [PATCH] refactor(colorScheme): move colors to config provider --- .../amCharts/areaChart/AreaChartCtrl.js | 3 +- .../charts/amCharts/barChart/BarChartCtrl.js | 3 +- .../combinedChart/combinedChartCtrl.js | 3 +- .../amCharts/funnelChart/FunnelChartCtrl.js | 3 +- .../amCharts/ganttChart/ganttChartCtrl.js | 2 +- .../amCharts/lineChart/LineChartCtrl.js | 3 +- .../charts/amCharts/pieChart/PieChartCtrl.js | 3 +- src/app/pages/charts/chartist/chartistCtrl.js | 4 +- src/app/pages/charts/morris/morris.module.js | 3 +- src/app/pages/charts/morris/morrisCtrl.js | 3 +- .../DashboardCalendarCtrl.js | 4 +- .../DashboardLineChartCtrl.js | 5 +- .../dashboardMap/DashboardMapCtrl.js | 3 +- .../DashboardPieChartCtrl.js | 4 +- .../dashboardTodo/DashboardTodoCtrl.js | 6 +- .../trafficChart/TrafficChartCtrl.js | 6 +- .../maps/map-bubbles/MapBubblePageCtrl.js | 3 +- .../pages/maps/map-lines/MapLinesPageCtrl.js | 3 +- src/app/theme/amChartConfig.js | 3 +- src/app/theme/chartJsConfig.js | 3 +- .../components/baPanel/baPanel.directive.js | 6 +- src/app/theme/theme.config.js | 23 +++++ src/app/theme/theme.configProvider.js | 87 +++++++++++++++++++ src/app/theme/theme.constants.js | 76 ++-------------- src/app/theme/theme.service.js | 6 +- src/sass/common.scss | 2 +- 26 files changed, 167 insertions(+), 103 deletions(-) create mode 100644 src/app/theme/theme.config.js create mode 100644 src/app/theme/theme.configProvider.js diff --git a/src/app/pages/charts/amCharts/areaChart/AreaChartCtrl.js b/src/app/pages/charts/amCharts/areaChart/AreaChartCtrl.js index 82663f3..e5f1264 100644 --- a/src/app/pages/charts/amCharts/areaChart/AreaChartCtrl.js +++ b/src/app/pages/charts/amCharts/areaChart/AreaChartCtrl.js @@ -9,7 +9,8 @@ .controller('AreaChartCtrl', AreaChartCtrl); /** @ngInject */ - function AreaChartCtrl($scope, layoutColors, $element, layoutPaths) { + function AreaChartCtrl($scope, baConfig, $element, layoutPaths) { + var layoutColors = baConfig.colors; var id = $element[0].getAttribute('id'); var areaChart = AmCharts.makeChart(id, { type: 'serial', diff --git a/src/app/pages/charts/amCharts/barChart/BarChartCtrl.js b/src/app/pages/charts/amCharts/barChart/BarChartCtrl.js index 55eaede..2c40e31 100644 --- a/src/app/pages/charts/amCharts/barChart/BarChartCtrl.js +++ b/src/app/pages/charts/amCharts/barChart/BarChartCtrl.js @@ -9,7 +9,8 @@ .controller('BarChartCtrl', BarChartCtrl); /** @ngInject */ - function BarChartCtrl($scope, layoutColors, $element, layoutPaths) { + function BarChartCtrl($scope, baConfig, $element, layoutPaths) { + var layoutColors = baConfig.colors; var id = $element[0].getAttribute('id'); var barChart = AmCharts.makeChart(id, { type: 'serial', diff --git a/src/app/pages/charts/amCharts/combinedChart/combinedChartCtrl.js b/src/app/pages/charts/amCharts/combinedChart/combinedChartCtrl.js index ab201dc..723fdbc 100644 --- a/src/app/pages/charts/amCharts/combinedChart/combinedChartCtrl.js +++ b/src/app/pages/charts/amCharts/combinedChart/combinedChartCtrl.js @@ -9,7 +9,8 @@ .controller('combinedChartCtrl', combinedChartCtrl); /** @ngInject */ - function combinedChartCtrl($element, layoutColors, layoutPaths) { + function combinedChartCtrl($element, baConfig, layoutPaths) { + var layoutColors = baConfig.colors; var id = $element[0].getAttribute('id'); var chart = AmCharts.makeChart(id, { "type": "serial", diff --git a/src/app/pages/charts/amCharts/funnelChart/FunnelChartCtrl.js b/src/app/pages/charts/amCharts/funnelChart/FunnelChartCtrl.js index 98fb7c1..249c3f9 100644 --- a/src/app/pages/charts/amCharts/funnelChart/FunnelChartCtrl.js +++ b/src/app/pages/charts/amCharts/funnelChart/FunnelChartCtrl.js @@ -9,7 +9,8 @@ .controller('FunnelChartCtrl', FunnelChartCtrl); /** @ngInject */ - function FunnelChartCtrl($scope, $element, layoutPaths, layoutColors) { + function FunnelChartCtrl($scope, $element, layoutPaths, baConfig) { + var layoutColors = baConfig.colors; var id = $element[0].getAttribute('id'); var funnelChart = AmCharts.makeChart(id, { type: 'funnel', diff --git a/src/app/pages/charts/amCharts/ganttChart/ganttChartCtrl.js b/src/app/pages/charts/amCharts/ganttChart/ganttChartCtrl.js index 1508b05..64bad8e 100644 --- a/src/app/pages/charts/amCharts/ganttChart/ganttChartCtrl.js +++ b/src/app/pages/charts/amCharts/ganttChart/ganttChartCtrl.js @@ -9,7 +9,7 @@ .controller('ganttChartCtrl', ganttChartCtrl); /** @ngInject */ - function ganttChartCtrl(layoutColors, $element) { + function ganttChartCtrl($element) { var id = $element[0].getAttribute('id'); var chart = AmCharts.makeChart( id, { "type": "gantt", diff --git a/src/app/pages/charts/amCharts/lineChart/LineChartCtrl.js b/src/app/pages/charts/amCharts/lineChart/LineChartCtrl.js index c90da6e..d3d769f 100644 --- a/src/app/pages/charts/amCharts/lineChart/LineChartCtrl.js +++ b/src/app/pages/charts/amCharts/lineChart/LineChartCtrl.js @@ -9,7 +9,8 @@ .controller('LineChartCtrl', LineChartCtrl); /** @ngInject */ - function LineChartCtrl($scope, layoutColors, $element, layoutPaths) { + function LineChartCtrl($scope, baConfig, $element, layoutPaths) { + var layoutColors = baConfig.colors; var id = $element[0].getAttribute('id'); var lineChart = AmCharts.makeChart(id, { type: 'serial', diff --git a/src/app/pages/charts/amCharts/pieChart/PieChartCtrl.js b/src/app/pages/charts/amCharts/pieChart/PieChartCtrl.js index 26498ac..8d7a7d5 100644 --- a/src/app/pages/charts/amCharts/pieChart/PieChartCtrl.js +++ b/src/app/pages/charts/amCharts/pieChart/PieChartCtrl.js @@ -9,7 +9,8 @@ .controller('PieChartCtrl', PieChartCtrl); /** @ngInject */ - function PieChartCtrl($element, layoutPaths, layoutColors) { + function PieChartCtrl($element, layoutPaths, baConfig) { + var layoutColors = baConfig.colors; var id = $element[0].getAttribute('id'); var pieChart = AmCharts.makeChart(id, { type: 'pie', diff --git a/src/app/pages/charts/chartist/chartistCtrl.js b/src/app/pages/charts/chartist/chartistCtrl.js index de0a818..7ff8098 100644 --- a/src/app/pages/charts/chartist/chartistCtrl.js +++ b/src/app/pages/charts/chartist/chartistCtrl.js @@ -9,10 +9,10 @@ .controller('chartistCtrl', chartistCtrl); /** @ngInject */ - function chartistCtrl($scope, $timeout, layoutColors) { + function chartistCtrl($scope, $timeout, baConfig) { $scope.simpleLineOptions = { - color: layoutColors.defaultText, + color: baConfig.colors.defaultText, fullWidth: true, height: "300px", chartPadding: { diff --git a/src/app/pages/charts/morris/morris.module.js b/src/app/pages/charts/morris/morris.module.js index c2e192a..128e4ce 100644 --- a/src/app/pages/charts/morris/morris.module.js +++ b/src/app/pages/charts/morris/morris.module.js @@ -6,7 +6,8 @@ 'use strict'; angular.module('BlurAdmin.pages.charts.morris', []) - .config(routeConfig).config(function(layoutColors){ + .config(routeConfig).config(function(baConfigProvider){ + var layoutColors = baConfigProvider.colors; Morris.Donut.prototype.defaults.backgroundColor = 'transparent'; Morris.Donut.prototype.defaults.labelColor = layoutColors.defaultText; Morris.Grid.prototype.gridDefaults.gridLineColor = layoutColors.borderDark; diff --git a/src/app/pages/charts/morris/morrisCtrl.js b/src/app/pages/charts/morris/morrisCtrl.js index e0e0c02..a4665e3 100644 --- a/src/app/pages/charts/morris/morrisCtrl.js +++ b/src/app/pages/charts/morris/morrisCtrl.js @@ -9,7 +9,8 @@ .controller('morrisCtrl', morrisCtrl); /** @ngInject */ - function morrisCtrl($scope, $window, layoutColors) { + function morrisCtrl($scope, $window, baConfig) { + var layoutColors = baConfig.colors; $scope.colors = [layoutColors.primary, layoutColors.warning, layoutColors.danger, layoutColors.info, layoutColors.success, layoutColors.primaryDark]; $scope.lineData = [ {y: "2006", a: 100, b: 90}, diff --git a/src/app/pages/dashboard/dashboardCalendar/DashboardCalendarCtrl.js b/src/app/pages/dashboard/dashboardCalendar/DashboardCalendarCtrl.js index f12d780..f437491 100644 --- a/src/app/pages/dashboard/dashboardCalendar/DashboardCalendarCtrl.js +++ b/src/app/pages/dashboard/dashboardCalendar/DashboardCalendarCtrl.js @@ -9,8 +9,8 @@ .controller('DashboardCalendarCtrl', DashboardCalendarCtrl); /** @ngInject */ - function DashboardCalendarCtrl(layoutColors) { - var dashboardColors = layoutColors.dashboard; + function DashboardCalendarCtrl(baConfig) { + var dashboardColors = baConfig.colors.dashboard; var $element = $('#calendar').fullCalendar({ //height: 335, header: { diff --git a/src/app/pages/dashboard/dashboardLineChart/DashboardLineChartCtrl.js b/src/app/pages/dashboard/dashboardLineChart/DashboardLineChartCtrl.js index 29044ef..72191c4 100644 --- a/src/app/pages/dashboard/dashboardLineChart/DashboardLineChartCtrl.js +++ b/src/app/pages/dashboard/dashboardLineChart/DashboardLineChartCtrl.js @@ -9,8 +9,9 @@ .controller('DashboardLineChartCtrl', DashboardLineChartCtrl); /** @ngInject */ - function DashboardLineChartCtrl(layoutColors, layoutPaths, layoutTheme, baUtil) { - var graphColor = layoutTheme.blur ? '#000000' : layoutColors.primary; + function DashboardLineChartCtrl(baConfig, layoutPaths, baUtil) { + var layoutColors = baConfig.colors; + var graphColor = baConfig.theme.blur ? '#000000' : layoutColors.primary; var chartData = [ { date: new Date(2012, 11), value: 0, value0: 0 }, { date: new Date(2013, 0), value: 15000, value0: 19000}, diff --git a/src/app/pages/dashboard/dashboardMap/DashboardMapCtrl.js b/src/app/pages/dashboard/dashboardMap/DashboardMapCtrl.js index 7203711..65de9a6 100644 --- a/src/app/pages/dashboard/dashboardMap/DashboardMapCtrl.js +++ b/src/app/pages/dashboard/dashboardMap/DashboardMapCtrl.js @@ -9,7 +9,8 @@ .controller('DashboardMapCtrl', DashboardMapCtrl); /** @ngInject */ - function DashboardMapCtrl(layoutColors, layoutPaths) { + function DashboardMapCtrl(baConfig, layoutPaths) { + var layoutColors = baConfig.colors; var map = AmCharts.makeChart('amChartMap', { type: 'map', theme: 'blur', diff --git a/src/app/pages/dashboard/dashboardPieChart/DashboardPieChartCtrl.js b/src/app/pages/dashboard/dashboardPieChart/DashboardPieChartCtrl.js index c77b8dd..4009fd4 100644 --- a/src/app/pages/dashboard/dashboardPieChart/DashboardPieChartCtrl.js +++ b/src/app/pages/dashboard/dashboardPieChart/DashboardPieChartCtrl.js @@ -9,8 +9,8 @@ .controller('DashboardPieChartCtrl', DashboardPieChartCtrl); /** @ngInject */ - function DashboardPieChartCtrl($scope, $timeout, layoutColors, baUtil) { - var pieColor = baUtil.hexToRGB(layoutColors.defaultText, 0.2); + function DashboardPieChartCtrl($scope, $timeout, baConfig, baUtil) { + var pieColor = baUtil.hexToRGB(baConfig.colors.defaultText, 0.2); $scope.charts = [{ color: pieColor, description: 'New Visits', diff --git a/src/app/pages/dashboard/dashboardTodo/DashboardTodoCtrl.js b/src/app/pages/dashboard/dashboardTodo/DashboardTodoCtrl.js index 73d1faa..827159d 100644 --- a/src/app/pages/dashboard/dashboardTodo/DashboardTodoCtrl.js +++ b/src/app/pages/dashboard/dashboardTodo/DashboardTodoCtrl.js @@ -9,10 +9,10 @@ .controller('DashboardTodoCtrl', DashboardTodoCtrl); /** @ngInject */ - function DashboardTodoCtrl($scope, layoutColors, layoutTheme) { + function DashboardTodoCtrl($scope, baConfig) { - $scope.transparent = layoutTheme.blur; - var dashboardColors = layoutColors.dashboard; + $scope.transparent = baConfig.theme.blur; + var dashboardColors = baConfig.colors.dashboard; var colors = []; for (var key in dashboardColors) { colors.push(dashboardColors[key]); diff --git a/src/app/pages/dashboard/trafficChart/TrafficChartCtrl.js b/src/app/pages/dashboard/trafficChart/TrafficChartCtrl.js index 2e52662..84f0764 100644 --- a/src/app/pages/dashboard/trafficChart/TrafficChartCtrl.js +++ b/src/app/pages/dashboard/trafficChart/TrafficChartCtrl.js @@ -9,10 +9,10 @@ .controller('TrafficChartCtrl', TrafficChartCtrl); /** @ngInject */ - function TrafficChartCtrl($scope, layoutColors, layoutTheme) { + function TrafficChartCtrl($scope, baConfig) { - $scope.transparent = layoutTheme.blur; - var dashboardColors = layoutColors.dashboard; + $scope.transparent = baConfig.theme.blur; + var dashboardColors = baConfig.colors.dashboard; $scope.doughnutData = [ { value: 2000, diff --git a/src/app/pages/maps/map-bubbles/MapBubblePageCtrl.js b/src/app/pages/maps/map-bubbles/MapBubblePageCtrl.js index 707e3bc..ef85027 100644 --- a/src/app/pages/maps/map-bubbles/MapBubblePageCtrl.js +++ b/src/app/pages/maps/map-bubbles/MapBubblePageCtrl.js @@ -9,7 +9,8 @@ .controller('MapBubblePageCtrl', MapBubblePageCtrl); /** @ngInject */ - function MapBubblePageCtrl(layoutColors, $timeout, layoutPaths) { + function MapBubblePageCtrl(baConfig, $timeout, layoutPaths) { + var layoutColors = baConfig.colors; var latlong = {}; latlong['AD'] = {'latitude': 42.5, 'longitude': 1.5}; latlong['AE'] = {'latitude': 24, 'longitude': 54}; diff --git a/src/app/pages/maps/map-lines/MapLinesPageCtrl.js b/src/app/pages/maps/map-lines/MapLinesPageCtrl.js index 8f18935..d9b50da 100644 --- a/src/app/pages/maps/map-lines/MapLinesPageCtrl.js +++ b/src/app/pages/maps/map-lines/MapLinesPageCtrl.js @@ -9,7 +9,8 @@ .controller('MapLinesPageCtrl', MapLinesPageCtrl); /** @ngInject */ - function MapLinesPageCtrl(layoutColors, $timeout, layoutPaths) { + function MapLinesPageCtrl(baConfig, $timeout, layoutPaths) { + var layoutColors = baConfig.colors; // svg path for target icon var targetSVG = 'M9,0C4.029,0,0,4.029,0,9s4.029,9,9,9s9-4.029,9-9S13.971,0,9,0z M9,15.93 c-3.83,0-6.93-3.1-6.93-6.93S5.17,2.07,9,2.07s6.93,3.1,6.93,6.93S12.83,15.93,9,15.93 M12.5,9c0,1.933-1.567,3.5-3.5,3.5S5.5,10.933,5.5,9S7.067,5.5,9,5.5 S12.5,7.067,12.5,9z'; // svg path for plane icon diff --git a/src/app/theme/amChartConfig.js b/src/app/theme/amChartConfig.js index 6b50c9b..17f987a 100644 --- a/src/app/theme/amChartConfig.js +++ b/src/app/theme/amChartConfig.js @@ -9,7 +9,8 @@ .config(amChartConfig); /** @ngInject */ - function amChartConfig(layoutColors) { + function amChartConfig(baConfigProvider) { + var layoutColors = baConfigProvider.colors; AmCharts.themes.blur = { themeName: "blur", diff --git a/src/app/theme/chartJsConfig.js b/src/app/theme/chartJsConfig.js index 2d6084d..e866de2 100644 --- a/src/app/theme/chartJsConfig.js +++ b/src/app/theme/chartJsConfig.js @@ -9,7 +9,8 @@ .config(chartJsConfig); /** @ngInject */ - function chartJsConfig(ChartJsProvider, layoutColors) { + function chartJsConfig(ChartJsProvider, baConfigProvider) { + var layoutColors = baConfigProvider.colors; // Configure all charts ChartJsProvider.setOptions({ colours: [ layoutColors.primary, layoutColors.danger, layoutColors.warning, layoutColors.success, layoutColors.info, layoutColors.default, layoutColors.primaryDark, layoutColors.successDark, layoutColors.warningLight, layoutColors.successLight, layoutColors.primaryLight], diff --git a/src/app/theme/components/baPanel/baPanel.directive.js b/src/app/theme/components/baPanel/baPanel.directive.js index 6bf8848..18f4a21 100644 --- a/src/app/theme/components/baPanel/baPanel.directive.js +++ b/src/app/theme/components/baPanel/baPanel.directive.js @@ -12,11 +12,11 @@ .directive('baPanel', baPanel); /** @ngInject */ - function baPanel(baPanel, layoutTheme) { + function baPanel(baPanel, baConfig) { return angular.extend({}, baPanel, { template: function(el, attrs) { - var res = '
'; + var res = '
'; res += baPanel.template(el, attrs); res += '
'; return res; diff --git a/src/app/theme/theme.config.js b/src/app/theme/theme.config.js new file mode 100644 index 0000000..163a889 --- /dev/null +++ b/src/app/theme/theme.config.js @@ -0,0 +1,23 @@ +/** + * Created by k.danovsky on 13.05.2016. + */ + +(function () { + 'use strict'; + + angular.module('BlurAdmin.theme') + .config(config); + + /** @ngInject */ + function config(baConfigProvider, colorHelper) { + baConfigProvider.theme.blur = false; + + var colors = baConfigProvider.colors; + colors.default = '#ffffff'; + colors.defaultText = '#666666'; + colors.dashboard.white = '#10c4b5'; + colors.dashboard.whiteDark = colorHelper.shade(colors.dashboard.white, 5); + + console.log(baConfigProvider); + } +})(); diff --git a/src/app/theme/theme.configProvider.js b/src/app/theme/theme.configProvider.js new file mode 100644 index 0000000..b9c17a2 --- /dev/null +++ b/src/app/theme/theme.configProvider.js @@ -0,0 +1,87 @@ +/** + * Created by k.danovsky on 13.05.2016. + */ + +(function () { + 'use strict'; + + var basic = { + default: 'rgba(#000000, 0.2)', + defaultText: '#ffffff', + border: '#dddddd', + borderDark: '#aaaaaa', + }; + + // main functional color scheme + var colorScheme = { + primary: '#209e91', + info: '#2dacd1', + success: '#90b900', + warning: '#dfb81c', + danger: '#e85656', + }; + + // dashboard colors for charts + var dashboardColors = { + blueStone: '#005562', + surfieGreen: '#0e8174', + silverTree: '#6eba8c', + gossip: '#b9f2a1', + white: '#ffffff', + }; + + angular.module('BlurAdmin.theme') + .provider('baConfig', configProvider); + + /** @ngInject */ + function configProvider(colorHelper) { + var conf = { + theme: { + blur: true, + }, + colors: { + default: basic.default, + defaultText: basic.defaultText, + border: basic.border, + borderDark: basic.borderDark, + + primary: colorScheme.primary, + info: colorScheme.info, + success: colorScheme.success, + warning: colorScheme.warning, + danger: colorScheme.danger, + + primaryLight: colorHelper.tint(colorScheme.primary, 30), + infoLight: colorHelper.tint(colorScheme.info, 30), + successLight: colorHelper.tint(colorScheme.success, 30), + warningLight: colorHelper.tint(colorScheme.warning, 30), + dangerLight: colorHelper.tint(colorScheme.danger, 30), + + primaryDark: colorHelper.shade(colorScheme.primary, 15), + infoDark: colorHelper.shade(colorScheme.info, 15), + successDark: colorHelper.shade(colorScheme.success, 15), + warningDark: colorHelper.shade(colorScheme.warning, 15), + dangerDark: colorHelper.shade(colorScheme.danger, 15), + + dashboard: { + blueStone: dashboardColors.blueStone, + surfieGreen: dashboardColors.surfieGreen, + silverTree: dashboardColors.silverTree, + gossip: dashboardColors.gossip, + white: dashboardColors.white, + + blueStoneDark: colorHelper.shade(dashboardColors.blueStone, 15), + surfieGreenDark: colorHelper.shade(dashboardColors.surfieGreen, 15), + silverTreeDark: colorHelper.shade(dashboardColors.silverTree, 15), + gossipDark: colorHelper.shade(dashboardColors.gossip, 15), + whiteDark: colorHelper.shade(dashboardColors.white, 5), + }, + } + }; + conf.$get = function () { + delete conf.$get; + return conf; + }; + return conf; + } +})(); diff --git a/src/app/theme/theme.constants.js b/src/app/theme/theme.constants.js index c0994c1..e93e5b8 100644 --- a/src/app/theme/theme.constants.js +++ b/src/app/theme/theme.constants.js @@ -7,75 +7,7 @@ var IMAGES_ROOT = 'assets/img/'; - var blurTheme = true; - - var basic = { - default: 'rgba(#000000, 0.2)', - defaultText: '#ffffff', - border: '#dddddd', - borderDark: '#aaaaaa', - }; - - // main functional color scheme - var colorScheme = { - primary: '#209e91', - info: '#2dacd1', - success: '#90b900', - warning: '#dfb81c', - danger: '#e85656', - }; - - // dashboard colors for charts - var dashboardColors = { - blueStone: '#005562', - surfieGreen: '#0e8174', - silverTree: '#6eba8c', - gossip: '#b9f2a1', - white: '#ffffff', - }; - angular.module('BlurAdmin.theme') - .constant('layoutTheme', { - blur: blurTheme, - }) - .constant('layoutColors', { - default: basic.default, - defaultText: basic.defaultText, - border: basic.border, - borderDark: basic.borderDark, - - primary: colorScheme.primary, - info: colorScheme.info, - success: colorScheme.success, - warning: colorScheme.warning, - danger: colorScheme.danger, - - primaryLight: tint(colorScheme.primary, 30), - infoLight: tint(colorScheme.info, 30), - successLight: tint(colorScheme.success, 30), - warningLight: tint(colorScheme.warning, 30), - dangerLight: tint(colorScheme.danger, 30), - - primaryDark: shade(colorScheme.primary, 15), - infoDark: shade(colorScheme.info, 15), - successDark: shade(colorScheme.success, 15), - warningDark: shade(colorScheme.warning, 15), - dangerDark: shade(colorScheme.danger, 15), - - dashboard: { - blueStone: dashboardColors.blueStone, - surfieGreen: dashboardColors.surfieGreen, - silverTree: dashboardColors.silverTree, - gossip: dashboardColors.gossip, - white: dashboardColors.white, - - blueStoneDark: shade(dashboardColors.blueStone, 15), - surfieGreenDark: shade(dashboardColors.surfieGreen, 15), - silverTreeDark: shade(dashboardColors.silverTree, 15), - gossipDark: shade(dashboardColors.gossip, 15), - whiteDark: shade(dashboardColors.white, 5), - }, - }) .constant('layoutSizes', { resWidthCollapseSidebar: 1200, resWidthHideSidebar: 500 @@ -87,6 +19,14 @@ amMap: 'assets/img/theme/vendor/ammap//dist/ammap/images/', amChart: 'assets/img/theme/vendor/amcharts/dist/amcharts/images/' } + }) + .constant('colorHelper', { + tint: function(color, weight) { + return mix('#ffffff', color, weight); + }, + shade: function(color, weight) { + return mix('#000000', color, weight); + }, }); function shade(color, weight) { diff --git a/src/app/theme/theme.service.js b/src/app/theme/theme.service.js index 0f6e4fb..1359bb1 100644 --- a/src/app/theme/theme.service.js +++ b/src/app/theme/theme.service.js @@ -9,14 +9,14 @@ .service('themeLayoutSettings', themeLayoutSettings); /** @ngInject */ - function themeLayoutSettings(layoutTheme) { + function themeLayoutSettings(baConfig) { var isMobile = (/android|webos|iphone|ipad|ipod|blackberry|windows phone/).test(navigator.userAgent.toLowerCase()); var mobileClass = isMobile ? 'mobile' : ''; - var blurClass = layoutTheme.blur ? 'blur-theme' : ''; + var blurClass = baConfig.theme.blur ? 'blur-theme' : ''; angular.element(document.body).addClass(mobileClass).addClass(blurClass); return { - blur: layoutTheme.blur, + blur: baConfig.theme.blur, mobile: isMobile, } } diff --git a/src/sass/common.scss b/src/sass/common.scss index 61916ec..df04ce9 100644 --- a/src/sass/common.scss +++ b/src/sass/common.scss @@ -1,3 +1,3 @@ @import 'theme/conf/mixins'; -@import 'theme/conf/colorScheme/default'; +@import 'theme/conf/colorScheme/mint'; @import 'theme/conf/variables';