jinql
/
blur-admin
mirror of https://github.com/akveo/blur-admin
1
0
Fork 0
Code Issues Releases Wiki Activity

feat(dashboard): change template theme to light

pull/46/head
KostyaDanovsky 2016-04-19 19:41:19 +03:00 committed by kostya.danovsky
parent a2a9045c71
commit cbfa97dc35
33 changed files with 191 additions and 414 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/app/pages/charts/amCharts/combinedChart/combinedChartCtrl.js
View File

@ -14,13 +14,13 @@
var chart = AmCharts.makeChart(id, { var chart = AmCharts.makeChart(id, {
"type": "serial", "type": "serial",
"theme": "none", "theme": "none",
"color": layoutColors.default, "color": layoutColors.defaultText,
"dataDateFormat": "YYYY-MM-DD", "dataDateFormat": "YYYY-MM-DD",
"precision": 2, "precision": 2,
"valueAxes": [{ "valueAxes": [{
color: layoutColors.default, color: layoutColors.defaultText,
axisColor: layoutColors.default, axisColor: layoutColors.defaultText,
gridColor: layoutColors.default, gridColor: layoutColors.defaultText,
"id": "v1", "id": "v1",
"title": "Sales", "title": "Sales",
"position": "left", "position": "left",
@ -29,9 +29,9 @@
return "$" + Math.round(value) + "M"; return "$" + Math.round(value) + "M";
} }
}, { }, {
color: layoutColors.default, color: layoutColors.defaultText,
axisColor: layoutColors.default, axisColor: layoutColors.defaultText,
gridColor: layoutColors.default, gridColor: layoutColors.defaultText,
"id": "v2", "id": "v2",
"title": "Market Days", "title": "Market Days",
"gridAlpha": 0, "gridAlpha": 0,
@ -40,7 +40,7 @@
}], }],
"graphs": [{ "graphs": [{
"id": "g3", "id": "g3",
color: layoutColors.default, color: layoutColors.defaultText,
"valueAxis": "v1", "valueAxis": "v1",
"lineColor": layoutColors.primaryLight, "lineColor": layoutColors.primaryLight,
"fillColors": layoutColors.primaryLight, "fillColors": layoutColors.primaryLight,
@ -51,13 +51,13 @@
"valueField": "sales2", "valueField": "sales2",
"clustered": false, "clustered": false,
"columnWidth": 0.5, "columnWidth": 0.5,
"lineColorField" : "#ffffff", "lineColorField" : layoutColors.defaultText,
"legendValueText": "$[[value]]M", "legendValueText": "$[[value]]M",
"balloonText": "[[title]]<br/><b style='font-size: 130%'>$[[value]]M</b>" "balloonText": "[[title]]<br/><b style='font-size: 130%'>$[[value]]M</b>"
}, { }, {
"id": "g4", "id": "g4",
"valueAxis": "v1", "valueAxis": "v1",
color: layoutColors.default, color: layoutColors.defaultText,
"lineColor": layoutColors.primary, "lineColor": layoutColors.primary,
"fillColors": layoutColors.primary, "fillColors": layoutColors.primary,
"fillAlphas": 0.9, "fillAlphas": 0.9,
@ -74,8 +74,8 @@
"valueAxis": "v2", "valueAxis": "v2",
"bullet": "round", "bullet": "round",
"bulletBorderAlpha": 1, "bulletBorderAlpha": 1,
"bulletColor": "#FFFFFF", "bulletColor": layoutColors.defaultText,
color: layoutColors.default, color: layoutColors.defaultText,
"bulletSize": 5, "bulletSize": 5,
"hideBulletsCount": 50, "hideBulletsCount": 50,
"lineThickness": 2, "lineThickness": 2,
@ -88,10 +88,10 @@
}, { }, {
"id": "g2", "id": "g2",
"valueAxis": "v2", "valueAxis": "v2",
color: layoutColors.default, color: layoutColors.defaultText,
"bullet": "round", "bullet": "round",
"bulletBorderAlpha": 1, "bulletBorderAlpha": 1,
"bulletColor": "#FFFFFF", "bulletColor": layoutColors.defaultText,
"bulletSize": 5, "bulletSize": 5,
"hideBulletsCount": 50, "hideBulletsCount": 50,
"lineThickness": 2, "lineThickness": 2,
@ -128,9 +128,9 @@
}, },
"categoryField": "date", "categoryField": "date",
"categoryAxis": { "categoryAxis": {
"axisColor": "#fff", "axisColor": layoutColors.defaultText,
"color": "#fff", "color": layoutColors.defaultText,
"gridColor": "#fff", "gridColor": layoutColors.defaultText,
"parseDates": true, "parseDates": true,
"dashLength": 1, "dashLength": 1,
"minorGridEnabled": true "minorGridEnabled": true
@ -138,7 +138,7 @@
"legend": { "legend": {
"useGraphSettings": true, "useGraphSettings": true,
"position": "top", "position": "top",
"color": "#fff" "color": layoutColors.defaultText
}, },
"balloon": { "balloon": {
"borderThickness": 1, "borderThickness": 1,

16
src/app/pages/dashboard/dashboardLineChart/DashboardLineChartCtrl.js
View File

@ -43,7 +43,7 @@
{ date: new Date(2015, 1), value: 49800, value0: 13000} { date: new Date(2015, 1), value: 49800, value0: 13000}
]; ];
var chartColorProfile = tplSkinManager.getChartColorProfile(); //var chartColorProfile = tplSkinManager.getChartColorProfile();
var chart = AmCharts.makeChart('amchart', { var chart = AmCharts.makeChart('amchart', {
type: 'serial', type: 'serial',
@ -55,15 +55,15 @@
categoryAxis: { categoryAxis: {
parseDates: true, parseDates: true,
gridAlpha: 0, gridAlpha: 0,
color: chartColorProfile.fontColors, color: layoutColors.defaultText,
axisColor: chartColorProfile.axisColors axisColor: layoutColors.defaultText
}, },
valueAxes: [ valueAxes: [
{ {
minVerticalGap: 50, minVerticalGap: 50,
gridAlpha: 0, gridAlpha: 0,
color: chartColorProfile.fontColors, color: layoutColors.defaultText,
axisColor: chartColorProfile.axisColors axisColor: layoutColors.defaultText
} }
], ],
graphs: [ graphs: [
@ -71,7 +71,7 @@
id: 'g0', id: 'g0',
bullet: 'none', bullet: 'none',
useLineColorForBulletBorder: true, useLineColorForBulletBorder: true,
lineColor: 'rgba(0,0,0,0.3)', lineColor: 'rgba(0,0,0,0.15)',
lineThickness: 1, lineThickness: 1,
negativeLineColor: layoutColors.danger, negativeLineColor: layoutColors.danger,
type: 'smoothedLine', type: 'smoothedLine',
@ -83,7 +83,7 @@
id: 'g1', id: 'g1',
bullet: 'none', bullet: 'none',
useLineColorForBulletBorder: true, useLineColorForBulletBorder: true,
lineColor: 'rgba(0,0,0,0.4)', lineColor: 'rgba(0,0,0,0.2)',
lineThickness: 1, lineThickness: 1,
negativeLineColor: layoutColors.danger, negativeLineColor: layoutColors.danger,
type: 'smoothedLine', type: 'smoothedLine',
@ -114,7 +114,7 @@
pathToImages: layoutPaths.images.amChart pathToImages: layoutPaths.images.amChart
}); });
tplSkinChartWatcherHelper.watchAxisChartStyleChanges($scope, chart); //tplSkinChartWatcherHelper.watchAxisChartStyleChanges($scope, chart);
function zoomChart() { function zoomChart() {
chart.zoomToDates(new Date(2013, 3), new Date(2014, 0)); chart.zoomToDates(new Date(2013, 3), new Date(2014, 0));

11
src/app/pages/dashboard/dashboardMap/DashboardMapCtrl.js
View File

@ -53,10 +53,11 @@
}, },
areasSettings: { areasSettings: {
rollOverOutlineColor: '#FFFFFF', rollOverOutlineColor: layoutColors.border,
rollOverColor: layoutColors.primaryDark, rollOverColor: layoutColors.primaryDark,
alpha: 0.8, alpha: 0.8,
unlistedAreasAlpha: 0.1, unlistedAreasAlpha: 0.2,
unlistedAreasColor: layoutColors.defaultText,
balloonText: '[[title]]: [[customData]] users' balloonText: '[[title]]: [[customData]] users'
}, },
@ -66,9 +67,9 @@
marginRight: 27, marginRight: 27,
marginLeft: 27, marginLeft: 27,
equalWidths: false, equalWidths: false,
backgroundAlpha: 0.5, backgroundAlpha: 0.3,
backgroundColor: '#FFFFFF', backgroundColor: layoutColors.border,
borderColor: '#ffffff', borderColor: layoutColors.border,
borderAlpha: 1, borderAlpha: 1,
top: 362, top: 362,
left: 0, left: 0,

10
src/app/pages/dashboard/dashboardPieChart/DashboardPieChartCtrl.js
View File

@ -9,24 +9,24 @@
.controller('DashboardPieChartCtrl', DashboardPieChartCtrl); .controller('DashboardPieChartCtrl', DashboardPieChartCtrl);
/** @ngInject */ /** @ngInject */
function DashboardPieChartCtrl($scope, $element, $window, $timeout) { function DashboardPieChartCtrl($scope, $element, $window, $timeout, layoutColors) {
$scope.charts = [{ $scope.charts = [{
color: 'rgba(255,255,255,0.4)', color: layoutColors.border,
description: 'New Visits', description: 'New Visits',
stats: '57,820', stats: '57,820',
icon: 'person', icon: 'person',
}, { }, {
color: 'rgba(255,255,255,0.4)', color: layoutColors.border,
description: 'Purchases', description: 'Purchases',
stats: '$ 89,745', stats: '$ 89,745',
icon: 'money', icon: 'money',
}, { }, {
color: 'rgba(255,255,255,0.4)', color: layoutColors.border,
description: 'Active Users', description: 'Active Users',
stats: '178,391', stats: '178,391',
icon: 'face', icon: 'face',
}, { }, {
color: 'rgba(255,255,255,0.4)', color: layoutColors.border,
description: 'Returned', description: 'Returned',
stats: '32,592', stats: '32,592',
icon: 'refresh', icon: 'refresh',

115
src/app/pages/dashboard/dashboardTodo/DashboardTodoCtrl.js
View File

@ -9,99 +9,35 @@
.controller('DashboardTodoCtrl', DashboardTodoCtrl); .controller('DashboardTodoCtrl', DashboardTodoCtrl);
/** @ngInject */ /** @ngInject */
function DashboardTodoCtrl($scope) { function DashboardTodoCtrl($scope, layoutColors) {
$scope.marks = [
{ var palette = layoutColors.bgColorPalette;
id: 0, var colors = [];
color: 'default' for (var key in palette) {
}, colors.push(palette[key]);
{ }
id: 1,
color: 'primary' function getRandomColor() {
}, var i = Math.floor(Math.random() * (colors.length - 1));
{ return colors[i];
id: 2,
color: 'success'
},
{
id: 3,
color: 'warning'
},
{
id: 4,
color: 'danger'
} }
];
$scope.todoList = [ $scope.todoList = [
{ { text: 'Check me out' },
text: 'Check me out', { text: 'Lorem ipsum dolor sit amet, possit denique oportere at his, etiam corpora deseruisse te pro' },
edit: false, // todo: remove edit { text: 'Ex has semper alterum, expetenda dignissim' },
markId: 4 { text: 'Vim an eius ocurreret abhorreant, id nam aeque persius ornatus.' },
}, { text: 'Simul erroribus ad usu' },
{ { text: 'Ei cum solet appareat, ex est graeci mediocritatem' },
text: 'Lorem ipsum dolor sit amet, possit denique oportere at his, etiam corpora deseruisse te pro', { text: 'Get in touch with akveo team' },
edit: false, { text: 'Write email to business cat' },
markId: 3 { text: 'Have fun with blur admin' },
}, { text: 'What do you think?' },
{
text: 'Ex has semper alterum, expetenda dignissim',
edit: false,
markId: 2
},
{
text: 'Vim an eius ocurreret abhorreant, id nam aeque persius ornatus.',
edit: false,
markId: 1
},
{
text: 'Simul erroribus ad usu',
edit: false,
markId: 0
},
{
text: 'Ei cum solet appareat, ex est graeci mediocritatem',
edit: false,
markId: 4
},
{
text: 'Get in touch with akveo team',
edit: false,
markId: 1
},
{
text: 'Write email to business cat',
edit: false,
markId: 3
},
{
text: 'Have fun with blur admin',
edit: false,
markId: 2
},
]; ];
$scope.getMarkColor = function (id) { $scope.todoList.forEach(function(item) {
return $scope.marks.filter(function (item) { item.color = getRandomColor();
return item.id === id; });
})[0].color || '';
};
$scope.changeColor = function (todo) {
for (var i = 0; i < $scope.marks.length; ++i) {
if ($scope.marks[i].id === todo.markId) {
var next = (i + 1 !== $scope.marks.length) ? i + 1 : 0;
todo.markId = $scope.marks[next].id;
return false;
}
}
};
$scope.blurOnEnter = function (event, item) {
if (event.which === 13) {
item.edit = false;
}
};
$scope.newTodoText = ''; $scope.newTodoText = '';
@ -109,8 +45,7 @@
if (clickPlus || event.which === 13) { if (clickPlus || event.which === 13) {
$scope.todoList.unshift({ $scope.todoList.unshift({
text: $scope.newTodoText, text: $scope.newTodoText,
edit: false, color: getRandomColor(),
markId: 0
}); });
$scope.newTodoText = ''; $scope.newTodoText = '';
} }

4
src/app/pages/dashboard/dashboardTodo/dashboardTodo.html
View File

@ -3,10 +3,10 @@
<div class="box-shadow-border"></div> <div class="box-shadow-border"></div>
<ul class="todo-list" ui-sortable ng-model="todoList"> <ul class="todo-list" ui-sortable ng-model="todoList">
<li ng-repeat="item in todoList" ng-if="!item.deleted" ng-init="activeItem=false" <li ng-repeat="item in todoList" ng-if="!item.deleted" ng-init="activeItem=false"
ng-class="{checked: isChecked, active: activeItem}" class="{{ getMarkColor(item.markId) }}" ng-class="{checked: isChecked, active: activeItem}"
ng-mouseenter="activeItem=true" ng-mouseleave="activeItem=false"> ng-mouseenter="activeItem=true" ng-mouseleave="activeItem=false">
<div class="blur-container"><div class="blur-box"></div></div> <div class="blur-container"><div class="blur-box"></div></div>
<i class="mark"></i> <i class="mark" style="background-color: {{::item.color}}"></i>
<label class="todo-checkbox custom-checkbox custom-input-success"> <label class="todo-checkbox custom-checkbox custom-input-success">
<input type="checkbox" ng-model="isChecked"> <input type="checkbox" ng-model="isChecked">
<span class="cut-with-dots">{{ item.text }}</span> <span class="cut-with-dots">{{ item.text }}</span>

20
src/app/pages/dashboard/trafficChart/TrafficChartCtrl.js
View File

@ -13,12 +13,19 @@
var palette = layoutColors.bgColorPalette; var palette = layoutColors.bgColorPalette;
$scope.doughnutData = [ $scope.doughnutData = [
{ {
value: 2000, value: 1000,
color: palette.gossip,
highlight: palette.gossipDark,
label: 'Ad Campaigns',
percentage: 17,
order: 0,
},{
value: 1400,
color: palette.white, color: palette.white,
highlight: palette.whiteDark, highlight: palette.whiteDark,
label: 'Ad Campaigns', label: 'Other',
percentage: 87, percentage: 87,
order: 0, order: 1,
}, { }, {
value: 1500, value: 1500,
color: palette.blueStone, color: palette.blueStone,
@ -40,13 +47,6 @@
label: 'Direct Traffic', label: 'Direct Traffic',
percentage: 38, percentage: 38,
order: 2, order: 2,
}, {
value: 400,
color: palette.gossip,
highlight: palette.gossipDark,
label: 'Other',
percentage: 17,
order: 1,
}, },
]; ];

5
src/app/theme/theme.constants.js
View File

@ -22,7 +22,7 @@
surfieGreen: '#0e8174', surfieGreen: '#0e8174',
silverTree: '#6eba8c', silverTree: '#6eba8c',
gossip: '#b9f2a1', gossip: '#b9f2a1',
white: '#ffffff', white: '#10c4b5',
}; };
angular.module('BlurAdmin.theme') angular.module('BlurAdmin.theme')
@ -52,7 +52,8 @@
dangerBg: tint(colorScheme.danger, 20), dangerBg: tint(colorScheme.danger, 20),
default: '#ffffff', default: '#ffffff',
defaultText: '#ffffff', defaultText: '#666666',
border: '#dddddd',
bgColorPalette: { bgColorPalette: {
blueStone: bgColorPalette.blueStone, blueStone: bgColorPalette.blueStone,

BIN
src/assets/img/app/my-app-logo.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 16 KiB

2
src/sass/404.scss
View File

@ -24,7 +24,7 @@ body {
@include bg-translucent-dark(0.5); @include bg-translucent-dark(0.5);
border-radius: 5px; border-radius: 5px;
font-weight: $font-light; font-weight: $font-light;
color: #ffffff; color: $default-text;
padding: 32px; padding: 32px;
text-align: center; text-align: center;

2
src/sass/app/_chartsPage.scss
View File

@ -33,7 +33,7 @@
.amChartsButtonSelected { .amChartsButtonSelected {
background-color: #CC0000; background-color: #CC0000;
border: 1px solid #CC0000; border: 1px solid #CC0000;
color: #FFFFFF; color: $default-text;
-moz-border-radius: 5px; -moz-border-radius: 5px;
border-radius: 5px; border-radius: 5px;
margin: 1px; margin: 1px;

9
src/sass/app/_email.scss
View File

@ -13,6 +13,7 @@
} }
.mail-navigation-container { .mail-navigation-container {
color: $default-text;
width: 200px; width: 200px;
.mail-navigation { .mail-navigation {
cursor: pointer; cursor: pointer;
@ -26,7 +27,6 @@
left: 150px; left: 150px;
padding: 1px 6px; padding: 1px 6px;
border: 1px solid; border: 1px solid;
color: white;
background-color: $primary-light; background-color: $primary-light;
margin-top: -2px; margin-top: -2px;
font-size: 12px; font-size: 12px;
@ -36,13 +36,12 @@
} }
&.active { &.active {
background-color: $primary-light; background-color: $primary-light;
color: white;
&:hover { &:hover {
background-color: $primary-light; background-color: $primary-light;
} }
.new-mails { .new-mails {
color: $primary-light; color: $primary-light;
background-color: white; background-color: $default;
} }
transition: background-color .2s ease, 0.8s padding ease; transition: background-color .2s ease, 0.8s padding ease;
} }
@ -54,7 +53,6 @@
margin: 7px 0; margin: 7px 0;
.btn { .btn {
width: 140px; width: 140px;
color: white;
font-weight: $font-light; font-weight: $font-light;
background-color: $dribble-color; background-color: $dribble-color;
} }
@ -437,9 +435,6 @@
&:focus { &:focus {
color: white; color: white;
} }
&.focus {
color: white;
}
} }
.answer-container { .answer-container {

12
src/sass/app/_form.scss
View File

@ -47,7 +47,7 @@
&:focus { &:focus {
box-shadow: none; box-shadow: none;
border-color: $primary-bg; border-color: $primary-bg;
background: #ffffff; background: $default;
} }
} }
@ -361,7 +361,7 @@ label.custom-input-danger {
} }
.input-group-addon { .input-group-addon {
background-color: $color; background-color: $color;
color: #ffffff; color: $default-text;
} }
} }
@ -414,7 +414,7 @@ label.custom-input-danger {
@mixin groupAddon($color) { @mixin groupAddon($color) {
background: $color; background: $color;
color: #ffffff; color: $default-text;
border-color: $color; border-color: $color;
} }
@ -447,20 +447,20 @@ label.custom-input-danger {
background: transparent; background: transparent;
color: $default; color: $default;
&:focus { &:focus {
background: #ffffff; background: $default;
box-shadow: none; box-shadow: none;
outline: 0 !important; outline: 0 !important;
} }
&:active { &:active {
border-color: $default; border-color: $default;
box-shadow: none; box-shadow: none;
background: #ffffff; background: $default;
} }
} }
&.open { &.open {
.btn-default.dropdown-toggle { .btn-default.dropdown-toggle {
box-shadow: none; box-shadow: none;
background-color: #ffffff; background-color: $default;
border-color: $default; border-color: $default;
color: $default; color: $default;
} }

2
src/sass/app/_modals.scss
View File

@ -91,7 +91,7 @@
@mixin message-modal-color($color) { @mixin message-modal-color($color) {
.modal-header { .modal-header {
color: #ffffff; color: $default-text;
background: $color; background: $color;
} }
} }

8
src/sass/app/_profile.scss
View File

@ -16,7 +16,7 @@ h3.with-line {
} }
.profile-block { .profile-block {
background: #fff; background: $default;
.nav-tabs > li { .nav-tabs > li {
& > a { & > a {
@ -86,7 +86,7 @@ h3.with-line {
display: none; display: none;
position: absolute; position: absolute;
font-size: 32px; font-size: 32px;
background: #ffffff; background: $default;
cursor: pointer; cursor: pointer;
color: $primary; color: $primary;
top: -11px; top: -11px;
@ -105,7 +105,7 @@ h3.with-line {
width: 202px; width: 202px;
background: rgba(0, 0, 0, 0.7); background: rgba(0, 0, 0, 0.7);
transition: all 200ms ease-in-out; transition: all 200ms ease-in-out;
color: #ffffff; color: $default-text;
text-decoration: none; text-decoration: none;
position: absolute; position: absolute;
bottom: -1px; bottom: -1px;
@ -149,7 +149,7 @@ a.sn-link {
font-size: 17px; font-size: 17px;
margin-right: 8px; margin-right: 8px;
background-color: rgba(0,0,0,.15); background-color: rgba(0,0,0,.15);
color: #fff; color: $default-text;
} }
span { span {

7
src/sass/app/_typography.scss
View File

@ -263,7 +263,7 @@ h5 {
} }
.columns-section { .columns-section {
background-color: white; background-color: $default;
} }
p { p {
@ -349,16 +349,15 @@ a.learn-more {
padding: 85px 90px 60px; padding: 85px 90px 60px;
display: inline-block; display: inline-block;
margin: 67px auto; margin: 67px auto;
background: #fff; background: $default;
min-width: 432px; min-width: 432px;
overflow: hidden; overflow: hidden;
background: rgba(0, 0, 0, 0.75); background: rgba(0, 0, 0, 0.75);
color: #ffffff;
h1 { h1 {
font-weight: $font-bold; font-weight: $font-bold;
width: 100%; width: 100%;
color: #ffffff; color: $default;
margin-bottom: 10px; margin-bottom: 10px;
} }
p { p {

12
src/sass/app/maps/_leaflet.scss
View File

@ -243,7 +243,7 @@
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
opacity: 0.8; opacity: 0.8;
color: #fff; color: $default-text;
font-size: 17px; font-size: 17px;
width: 20px; width: 20px;
height: 20px; height: 20px;
@ -295,7 +295,7 @@
.leaflet-control-layers { .leaflet-control-layers {
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4); box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4);
background: #fff; background: $default;
} }
.leaflet-control-layers-toggle { .leaflet-control-layers-toggle {
@ -327,7 +327,7 @@
.leaflet-control-layers-expanded { .leaflet-control-layers-expanded {
padding: 6px 10px 6px 6px; padding: 6px 10px 6px 6px;
color: #333; color: #333;
background: #fff; background: $default;
} }
.leaflet-control-layers-selector { .leaflet-control-layers-selector {
@ -349,7 +349,7 @@
/* attribution and scale controls */ /* attribution and scale controls */
.leaflet-container .leaflet-control-attribution { .leaflet-container .leaflet-control-attribution {
background: #fff; background: $default;
background: rgba(255, 255, 255, 0.7); background: rgba(255, 255, 255, 0.7);
margin: 0; margin: 0;
} }
@ -392,7 +392,7 @@
-moz-box-sizing: content-box; -moz-box-sizing: content-box;
box-sizing: content-box; box-sizing: content-box;
background: #fff; background: $default;
background: rgba(255, 255, 255, 0.5); background: rgba(255, 255, 255, 0.5);
} }
@ -513,6 +513,6 @@
/* div icon */ /* div icon */
.leaflet-div-icon { .leaflet-div-icon {
background: #fff; background: $default;
border: 1px solid #666; border: 1px solid #666;
} }

6
src/sass/auth.scss
View File

@ -34,7 +34,7 @@ html {
margin: 0 auto; margin: 0 auto;
border-radius: 5px; border-radius: 5px;
@include bg-translucent-dark(0.55); @include bg-translucent-dark(0.55);
color: #fff; color: $default-text;
padding: 32px; padding: 32px;
h1 { h1 {
font-weight: $font-light; font-weight: $font-light;
@ -142,13 +142,13 @@ a.forgot-pass {
.btn-auth { .btn-auth {
background: $primary; background: $primary;
color: #ffffff; color: $default-text;
border-radius: 5px; border-radius: 5px;
border-color: $primary; border-color: $primary;
padding: 7px 12px; padding: 7px 12px;
transition: all 0.1s ease; transition: all 0.1s ease;
&:hover { &:hover {
color: #ffffff; color: $default-text;
background: $primary; background: $primary;
border-color: $primary; border-color: $primary;
transform: scale(1.2); transform: scale(1.2);

2
src/sass/theme/_buttons.scss
View File

@ -65,7 +65,7 @@ $hover: 24;
} }
.dropdown button.btn.btn-default.dropdown-toggle { .dropdown button.btn.btn-default.dropdown-toggle {
color: #fff; color: $default-text;
} }
.bootstrap-select { .bootstrap-select {

15
src/sass/theme/_layout.scss
View File

@ -14,8 +14,9 @@ html, body {
body { body {
font: 14px/16px $font-family; font: 14px/16px $font-family;
color: white; color: $default-text;
@include main-background(); background-color: #F0F3F4;
//@include main-background();
} }
@ -63,7 +64,7 @@ a {
display: block; display: block;
bottom: 0; bottom: 0;
font-size: 13px; font-size: 13px;
color: #ffffff; color: $default-text;
transition: padding-left 0.5s ease; transition: padding-left 0.5s ease;
} }
@ -81,14 +82,14 @@ a {
margin-right: 12px; margin-right: 12px;
i { i {
margin: 0 4px; margin: 0 4px;
color: $warning; color: $danger;
font-size: 12px; font-size: 12px;
} }
a { a {
margin-left: 4px; margin-left: 4px;
color: #ffffff; color: $default-text;
&:hover { &:hover {
color: $warning; color: $danger;
} }
} }
} }
@ -105,7 +106,7 @@ a {
i { i {
cursor: pointer; cursor: pointer;
transition: all 0.1s ease; transition: all 0.1s ease;
color: #ffffff; color: $default;
padding: 6px; padding: 6px;
box-sizing: content-box; box-sizing: content-box;
font-size: 16px; font-size: 16px;

21
src/sass/theme/bootstrap-overrides/_panel.scss
View File

@ -8,7 +8,7 @@ $panel-heading-font-size: 16px;
position: relative; position: relative;
//transition: all 0.2s ease; //transition: all 0.2s ease;
margin-bottom: 24px; margin-bottom: 24px;
box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.15);
/*&:hover { /*&:hover {
background: $panel-bg-hover; background: $panel-bg-hover;
}*/ }*/
@ -42,6 +42,10 @@ $panel-heading-font-size: 16px;
} }
} }
.panel {
background-color: $default;
}
.panel > .panel-body { .panel > .panel-body {
padding: 15px 22px; padding: 15px 22px;
height: 100%; height: 100%;
@ -63,25 +67,10 @@ $panel-heading-font-size: 16px;
//text-transform: uppercase; //text-transform: uppercase;
} }
.panel-white, .panel-blur {
background-size: cover;
> .panel-heading {
background-color: transparent;
border: none;
color: $default-text;
}
}
.panel-white { .panel-white {
background-color: $panel-bg; background-color: $panel-bg;
} }
.panel-blur {
$blurredBgUrl: $images-root + 'blur-bg-blurred.jpg';
background: url($blurredBgUrl);
transition: none;
}
.panel-primary { .panel-primary {
> .panel-heading { > .panel-heading {
color: $primary; color: $primary;

4
src/sass/theme/components/_contentTop.scss
View File

@ -5,7 +5,7 @@
h1.al-title { h1.al-title {
font-weight: $font-bold; font-weight: $font-bold;
color: #ffffff; color: $default-text;
float: left; float: left;
width: auto; width: auto;
margin: 0; margin: 0;
@ -17,7 +17,7 @@ h1.al-title {
.al-breadcrumb { .al-breadcrumb {
background: none; background: none;
color: #ffffff; color: $default-text;
padding: 0; padding: 0;
margin: 0; margin: 0;
float: right; float: right;

6
src/sass/theme/components/_msgCenter.scss
View File

@ -27,7 +27,7 @@
margin-left: 0; margin-left: 0;
} }
& > a { & > a {
color: #ffffff; color: $default;
text-decoration: none; text-decoration: none;
font-size: 13px; font-size: 13px;
position: relative; position: relative;
@ -35,7 +35,7 @@
display: inline-block; display: inline-block;
min-width: 10px; min-width: 10px;
padding: 2px 4px 2px 4px; padding: 2px 4px 2px 4px;
color: #ffffff; color: $default;
vertical-align: baseline; vertical-align: baseline;
white-space: nowrap; white-space: nowrap;
text-align: center; text-align: center;
@ -247,7 +247,7 @@
width: 0; width: 0;
height: 0; height: 0;
border: 10px solid transparent; border: 10px solid transparent;
border-bottom-color: #ffffff; border-bottom-color: $border;
} }
} }
} }

12
src/sass/theme/components/_pageTop.scss
View File

@ -1,5 +1,5 @@
.page-top { .page-top {
@include bg-translucent-dark(0.5); background-color: $sidebar;
position: fixed; position: fixed;
z-index: 904; z-index: 904;
box-shadow: 2px 0px 3px rgba(0, 0, 0, 0.5); box-shadow: 2px 0px 3px rgba(0, 0, 0, 0.5);
@ -9,12 +9,12 @@
padding: 0 32px 0 40px; padding: 0 32px 0 40px;
&.scrolled { &.scrolled {
@include bg-translucent-dark(0.85); //background-color: rgba($sidebar, 0.9)
} }
} }
a.al-logo { a.al-logo {
color: #ffffff; color: $default;
display: block; display: block;
font-size: 24px; font-size: 24px;
font-family: $font-family; font-family: $font-family;
@ -55,7 +55,7 @@ a.al-logo {
} }
a.refresh-data { a.refresh-data {
color: #ffffff; color: $default;
font-size: 13px; font-size: 13px;
text-decoration: none; text-decoration: none;
font-weight: $font-normal; font-weight: $font-normal;
@ -74,7 +74,7 @@ a.collapse-menu-link {
display: block; display: block;
text-decoration: none; text-decoration: none;
line-height: 42px; line-height: 42px;
color: #fff; color: $default;
padding: 0; padding: 0;
float: left; float: left;
margin: 11px 0 0 25px; margin: 11px 0 0 25px;
@ -107,7 +107,7 @@ a.collapse-menu-link {
.search { .search {
text-shadow: none; text-shadow: none;
color: #fff; color: $default;
font-size: 13px; font-size: 13px;
line-height: 25px; line-height: 25px;
transition: all 0.5s ease; transition: all 0.5s ease;

6
src/sass/theme/components/_sidebar.scss
View File

@ -9,7 +9,7 @@ $angle-right: "\f101";
z-index: 904; z-index: 904;
display: block; display: block;
min-height: 100%; min-height: 100%;
@include bg-translucent-dark(0.5); background-color: $sidebar;
height: 100%; height: 100%;
position: fixed; position: fixed;
} }
@ -67,7 +67,7 @@ a.al-sidebar-list-link {
text-shadow: none; text-shadow: none;
font-size: 13px; font-size: 13px;
text-decoration: none; text-decoration: none;
color: #ffffff; color: $default;
line-height: 42px; line-height: 42px;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
@ -136,7 +136,7 @@ a.al-sidebar-list-link {
text-shadow: none; text-shadow: none;
font-size: 13px; font-size: 13px;
text-decoration: none; text-decoration: none;
color: #ffffff; color: $default;
padding-left: 52px; padding-left: 52px;
height: auto; height: auto;
line-height: 29px; line-height: 29px;

5
src/sass/theme/conf/_colorScheme.scss
View File

@ -1,3 +1,8 @@
$default: #ffffff !default;
$default-text: #666666;
$help-text: #949494;
$sidebar: #1C2B36;
$primary: #209e91 !default; $primary: #209e91 !default;
$info: #2dacd1 !default; $info: #2dacd1 !default;
$success: #90b900 !default; $success: #90b900 !default;

7
src/sass/theme/conf/_variables.scss
View File

@ -1,12 +1,8 @@
$font-family: 'Roboto', sans-serif; $font-family: 'Roboto', sans-serif;
$view-total :rgba(0,0,0,.4);
$activelink: $primary; $activelink: $primary;
$hoverlink: $primary-dark; $hoverlink: $primary-dark;
$default: #ffffff !default;
$facebook-color: #3b5998; $facebook-color: #3b5998;
$twitter-color: #55acee; $twitter-color: #55acee;
$google-color: #dd4b39; $google-color: #dd4b39;
@ -22,9 +18,6 @@ $panel-bg-hover: #fff;
$disabled: #bdbdbd; $disabled: #bdbdbd;
$disabled-bg: #e6e6e6; $disabled-bg: #e6e6e6;
$default-text: #7b7b7b;
$help-text: #949494;
$border: #dddddd; $border: #dddddd;
$border-light: #eeeeee; $border-light: #eeeeee;
$input-border: #cccccc; $input-border: #cccccc;

4
src/sass/theme/dashboard/_blurFeed.scss
View File

@ -3,7 +3,7 @@
} }
.feed-message { .feed-message {
$text-message-color: $default; $text-message-color: $default-text;
$video-message-color: $danger; $video-message-color: $danger;
$image-message-color: $success; $image-message-color: $success;
$geo-message-color: $primary; $geo-message-color: $primary;
@ -80,7 +80,7 @@
border-radius: 5px; border-radius: 5px;
margin: 0 0 0 80px; margin: 0 0 0 80px;
padding: 5px 20px; padding: 5px 20px;
color: #fff; color: $default-text;
width: 280px; width: 280px;
height: 70px; height: 70px;

12
src/sass/theme/dashboard/_calendar.scss
View File

@ -98,7 +98,7 @@ div.blurCalendar{
} }
.fc-popover { .fc-popover {
background-color: #ffffff; background-color: $default;
border: 1px solid; border: 1px solid;
.fc-header { .fc-header {
@ -330,7 +330,7 @@ div.blurCalendar{
.fc-event, .fc-event,
.fc-event:hover, .fc-event:hover,
.ui-widget .fc-event { .ui-widget .fc-event {
color: #ffffff; color: $default;
text-decoration: none; text-decoration: none;
} }
@ -663,7 +663,7 @@ a.fc-more {
.fc-bg { .fc-bg {
z-index: 1; z-index: 1;
background: #fff; background: $default;
opacity: .25; opacity: .25;
filter: alpha(opacity=25); filter: alpha(opacity=25);
} }
@ -742,7 +742,7 @@ body.badmin-transparent{
} }
.fc td{ .fc td{
border-color: rgba(255,255,255,0.1); border-color: $border;
} }
.fc-today-button, .fc-month-button, .fc-agendaWeek-button, .fc-agendaDay-button { .fc-today-button, .fc-month-button, .fc-agendaWeek-button, .fc-agendaDay-button {
@ -756,7 +756,7 @@ body.badmin-transparent{
background: transparent; background: transparent;
box-shadow: none; box-shadow: none;
border: none; border: none;
color: $default; color: $default-text;
} }
.fc-next-button { .fc-next-button {
left: 30px; left: 30px;
@ -764,7 +764,7 @@ body.badmin-transparent{
.fc-prev-button { .fc-prev-button {
} }
.fc-day-number{ .fc-day-number{
color: $default; color: $default-text;
opacity: 0.9; opacity: 0.9;
} }
} }

2
src/sass/theme/dashboard/_popularApp.scss
View File

@ -5,11 +5,11 @@
.popular-app-img { .popular-app-img {
position: relative; position: relative;
background: rgba(0, 0, 0, 0.5);
padding: 30px 0; padding: 30px 0;
height: 260px; height: 260px;
border-top-right-radius: 5px; border-top-right-radius: 5px;
border-top-left-radius: 5px; border-top-left-radius: 5px;
border-bottom: 1px solid $border;
img { img {
max-width: 60%; max-width: 60%;
max-height: 70%; max-height: 70%;

128
src/sass/theme/dashboard/_todo.scss
View File

@ -22,11 +22,11 @@ ul.todo-list {
right: 12px; right: 12px;
font-size: 32px; font-size: 32px;
transition: color 0.2s; transition: color 0.2s;
color: $input-border; color: rgba($input-border, 0.5);
visibility: hidden; visibility: hidden;
line-height: 42px; line-height: 42px;
&:hover { &:hover {
color: $danger-dark; color: $input-border;
} }
} }
&:hover { &:hover {
@ -37,34 +37,13 @@ ul.todo-list {
&.checked { &.checked {
.todo-text { .todo-text {
color: #BFBFBF; color: $default-text;
} }
&:before { &:before {
background: $input-border !important; background: $input-border !important;
} }
} }
@mixin mark($color) {
i.mark {
background: $color;
}
}
&.primary {
@include mark($primary);
}
&.danger {
@include mark($danger);
}
&.success {
@include mark($success);
}
&.info {
@include mark($info);
}
&.warning {
@include mark($warning);
}
i.mark { i.mark {
display: block; display: block;
position: absolute; position: absolute;
@ -117,104 +96,3 @@ label.todo-checkbox {
.add-item-icon { .add-item-icon {
display: none; display: none;
} }
body.badmin-transparent {
.todo-panel.panel {
color: white;
opacity: 0.9;
}
input.task-todo {
color: white;
width: calc(100% - 25px);
border-radius: 0;
border: none;
background: transparent;
&:focus {
outline: none;
background-color: transparent;
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.12);
}
}
.add-item-icon {
display: block;
float: right;
margin-top: -45px;
margin-right: 5px;
font-size: 25px;
cursor: pointer;
}
ul.todo-list {
li {
margin: 0;
border: none;
font-weight: $font-light;
.blur-container{
height: 40px;
position: absolute;
width: calc(100% + 40px);;
top: 0;
left: -25px;
overflow-y: hidden;
}
&:hover{
.blur-container{
box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.12);
}
.blur-box {
height: 100%;
background: linear-gradient(to right, rgba(255,255,255,0.3) 0%,rgba(255,255,255,0) 100%);
-webkit-filter: blur(3px);
}
}
&.primary, &.danger,&.success, &.info, &.warning {
i.mark {
background-color: transparent;
}
}
i.remove-todo {
color: white;
opacity: 0.4;
&:hover {
color: white;
opacity: 0.95;
}
}
i.mark {
min-width: 40px;
background-color: transparent;
}
label.todo-checkbox > span {
&:before {
position: absolute;
color: white;
content: '\f10c';
float: none;
margin-right: 6px;
transition: none;
}
}
&.checked {
label.todo-checkbox > span {
&:before {
margin-right: 0;
position: absolute;
content: '';
background-size: contain;
background: url($images-root + "app/todo/check-icon.png") no-repeat;
}
}
}
}
}
.box-shadow-border{
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.12);
width: calc(100% + 44px);
margin-left: -22px;
}
}

18
src/sass/theme/dashboard/_trafficChart.scss
View File

@ -101,10 +101,12 @@
border-radius: 0; border-radius: 0;
width: 100%; width: 100%;
margin-bottom: 0; margin-bottom: 0;
background-color: rgba(0, 0, 0, 0.25); background-color: $border-light;
box-shadow: none;
.progress-bar{ .progress-bar{
height: 4px; height: 4px;
background-color: white; background-color: $input-border;
box-shadow: none;
} }
} }
@ -119,12 +121,11 @@
} }
.traffic-chart canvas{ .traffic-chart canvas{
border: 10px solid rgba(0,0,0,0.0); border: 10px solid $default;
border-radius: 150px; border-radius: 150px;
} }
.chart-bg{ .chart-bg{
background-color: $view-total;
position: absolute; position: absolute;
border-radius: 100px; border-radius: 100px;
width: 180px; width: 180px;
@ -191,12 +192,3 @@
height: 142px; height: 142px;
} }
} }
body.badmin-transparent{
.traffic-chart canvas{
border: 10px solid rgba(0,0,0,0.35);
box-shadow: 0 0 5px 0 rgb(0, 0, 0) inset;
border-radius: 150px;
}
}

26
src/sass/theme/skins/_02_transparent.scss
View File

@ -1,4 +1,4 @@
body.badmin-transparent {
&.mobile{ &.mobile{
background: none; background: none;
.body-bg{ .body-bg{
@ -11,42 +11,30 @@ body.badmin-transparent {
@include main-background(); @include main-background();
background-attachment: inherit; background-attachment: inherit;
} }
.panel-blur {
background: transparent;
}
}
@include overrideColors(#fff);
@include overridePanelBg(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.9));
.default-color {
color: $default-text !important;;
} }
.panel.panel-blur { .panel.panel-blur {
background-attachment: fixed;
@include scrollbars(.4em, rgba(0, 0, 0, 0.7), rgba(255, 255, 255, 0.8)); @include scrollbars(.4em, rgba(0, 0, 0, 0.7), rgba(255, 255, 255, 0.8));
border-radius: 5px; border-radius: 5px;
color: $default; color: $default-text;
.panel-heading { .panel-heading {
border-bottom: 1px solid rgba(0, 0, 0, 0.12); border-bottom: 1px solid rgba(0, 0, 0, 0.12);
box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.12); box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.12);
transform: translate3d(0,0,0);
} }
.panel-body { .panel-body {
transform: translate3d(0,0,0);
} }
} }
.btn-default { .btn-default {
color: $default; color: $default;
} }
.form-control, .bootstrap-tagsinput input { .form-control, .bootstrap-tagsinput input {
@include placeholderStyle($default, 0.7); @include placeholderStyle($default-text, 0.7);
background-color: rgba(0, 0, 0, .15); border: 1px solid $border;
border-radius: 5px; border-radius: 5px;
color: $default; color: $default-text;
} }
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
@include placeholderStyle($default, 0.5); @include placeholderStyle($default-text, 0.5);
} }
.irs-grid-text { .irs-grid-text {
color: $default; color: $default-text;
}
} }