mirror of https://github.com/akveo/blur-admin
feat(dashboard): change template theme to light
KostyaDanovsky
kostya.danovsky
parent
a2a9045c71
commit
cbfa97dc35
|
|
@ -14,13 +14,13 @@
|
|||
var chart = AmCharts.makeChart(id, {
|
||||
"type": "serial",
|
||||
"theme": "none",
|
||||
"color": layoutColors.default,
|
||||
"color": layoutColors.defaultText,
|
||||
"dataDateFormat": "YYYY-MM-DD",
|
||||
"precision": 2,
|
||||
"valueAxes": [{
|
||||
color: layoutColors.default,
|
||||
axisColor: layoutColors.default,
|
||||
gridColor: layoutColors.default,
|
||||
color: layoutColors.defaultText,
|
||||
axisColor: layoutColors.defaultText,
|
||||
gridColor: layoutColors.defaultText,
|
||||
"id": "v1",
|
||||
"title": "Sales",
|
||||
"position": "left",
|
||||
|
|
@ -29,9 +29,9 @@
|
|||
return "$" + Math.round(value) + "M";
|
||||
}
|
||||
}, {
|
||||
color: layoutColors.default,
|
||||
axisColor: layoutColors.default,
|
||||
gridColor: layoutColors.default,
|
||||
color: layoutColors.defaultText,
|
||||
axisColor: layoutColors.defaultText,
|
||||
gridColor: layoutColors.defaultText,
|
||||
"id": "v2",
|
||||
"title": "Market Days",
|
||||
"gridAlpha": 0,
|
||||
|
|
@ -40,7 +40,7 @@
|
|||
}],
|
||||
"graphs": [{
|
||||
"id": "g3",
|
||||
color: layoutColors.default,
|
||||
color: layoutColors.defaultText,
|
||||
"valueAxis": "v1",
|
||||
"lineColor": layoutColors.primaryLight,
|
||||
"fillColors": layoutColors.primaryLight,
|
||||
|
|
@ -51,13 +51,13 @@
|
|||
"valueField": "sales2",
|
||||
"clustered": false,
|
||||
"columnWidth": 0.5,
|
||||
"lineColorField" : "#ffffff",
|
||||
"lineColorField" : layoutColors.defaultText,
|
||||
"legendValueText": "$[[value]]M",
|
||||
"balloonText": "[[title]]<br/><b style='font-size: 130%'>$[[value]]M</b>"
|
||||
}, {
|
||||
"id": "g4",
|
||||
"valueAxis": "v1",
|
||||
color: layoutColors.default,
|
||||
color: layoutColors.defaultText,
|
||||
"lineColor": layoutColors.primary,
|
||||
"fillColors": layoutColors.primary,
|
||||
"fillAlphas": 0.9,
|
||||
|
|
@ -74,8 +74,8 @@
|
|||
"valueAxis": "v2",
|
||||
"bullet": "round",
|
||||
"bulletBorderAlpha": 1,
|
||||
"bulletColor": "#FFFFFF",
|
||||
color: layoutColors.default,
|
||||
"bulletColor": layoutColors.defaultText,
|
||||
color: layoutColors.defaultText,
|
||||
"bulletSize": 5,
|
||||
"hideBulletsCount": 50,
|
||||
"lineThickness": 2,
|
||||
|
|
@ -88,10 +88,10 @@
|
|||
}, {
|
||||
"id": "g2",
|
||||
"valueAxis": "v2",
|
||||
color: layoutColors.default,
|
||||
color: layoutColors.defaultText,
|
||||
"bullet": "round",
|
||||
"bulletBorderAlpha": 1,
|
||||
"bulletColor": "#FFFFFF",
|
||||
"bulletColor": layoutColors.defaultText,
|
||||
"bulletSize": 5,
|
||||
"hideBulletsCount": 50,
|
||||
"lineThickness": 2,
|
||||
|
|
@ -128,9 +128,9 @@
|
|||
},
|
||||
"categoryField": "date",
|
||||
"categoryAxis": {
|
||||
"axisColor": "#fff",
|
||||
"color": "#fff",
|
||||
"gridColor": "#fff",
|
||||
"axisColor": layoutColors.defaultText,
|
||||
"color": layoutColors.defaultText,
|
||||
"gridColor": layoutColors.defaultText,
|
||||
"parseDates": true,
|
||||
"dashLength": 1,
|
||||
"minorGridEnabled": true
|
||||
|
|
@ -138,7 +138,7 @@
|
|||
"legend": {
|
||||
"useGraphSettings": true,
|
||||
"position": "top",
|
||||
"color": "#fff"
|
||||
"color": layoutColors.defaultText
|
||||
},
|
||||
"balloon": {
|
||||
"borderThickness": 1,
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@
|
|||
{ date: new Date(2015, 1), value: 49800, value0: 13000}
|
||||
];
|
||||
|
||||
var chartColorProfile = tplSkinManager.getChartColorProfile();
|
||||
//var chartColorProfile = tplSkinManager.getChartColorProfile();
|
||||
|
||||
var chart = AmCharts.makeChart('amchart', {
|
||||
type: 'serial',
|
||||
|
|
@ -55,15 +55,15 @@
|
|||
categoryAxis: {
|
||||
parseDates: true,
|
||||
gridAlpha: 0,
|
||||
color: chartColorProfile.fontColors,
|
||||
axisColor: chartColorProfile.axisColors
|
||||
color: layoutColors.defaultText,
|
||||
axisColor: layoutColors.defaultText
|
||||
},
|
||||
valueAxes: [
|
||||
{
|
||||
minVerticalGap: 50,
|
||||
gridAlpha: 0,
|
||||
color: chartColorProfile.fontColors,
|
||||
axisColor: chartColorProfile.axisColors
|
||||
color: layoutColors.defaultText,
|
||||
axisColor: layoutColors.defaultText
|
||||
}
|
||||
],
|
||||
graphs: [
|
||||
|
|
@ -71,7 +71,7 @@
|
|||
id: 'g0',
|
||||
bullet: 'none',
|
||||
useLineColorForBulletBorder: true,
|
||||
lineColor: 'rgba(0,0,0,0.3)',
|
||||
lineColor: 'rgba(0,0,0,0.15)',
|
||||
lineThickness: 1,
|
||||
negativeLineColor: layoutColors.danger,
|
||||
type: 'smoothedLine',
|
||||
|
|
@ -83,7 +83,7 @@
|
|||
id: 'g1',
|
||||
bullet: 'none',
|
||||
useLineColorForBulletBorder: true,
|
||||
lineColor: 'rgba(0,0,0,0.4)',
|
||||
lineColor: 'rgba(0,0,0,0.2)',
|
||||
lineThickness: 1,
|
||||
negativeLineColor: layoutColors.danger,
|
||||
type: 'smoothedLine',
|
||||
|
|
@ -114,7 +114,7 @@
|
|||
pathToImages: layoutPaths.images.amChart
|
||||
});
|
||||
|
||||
tplSkinChartWatcherHelper.watchAxisChartStyleChanges($scope, chart);
|
||||
//tplSkinChartWatcherHelper.watchAxisChartStyleChanges($scope, chart);
|
||||
|
||||
function zoomChart() {
|
||||
chart.zoomToDates(new Date(2013, 3), new Date(2014, 0));
|
||||
|
|
|
|||
|
|
@ -53,10 +53,11 @@
|
|||
},
|
||||
|
||||
areasSettings: {
|
||||
rollOverOutlineColor: '#FFFFFF',
|
||||
rollOverOutlineColor: layoutColors.border,
|
||||
rollOverColor: layoutColors.primaryDark,
|
||||
alpha: 0.8,
|
||||
unlistedAreasAlpha: 0.1,
|
||||
unlistedAreasAlpha: 0.2,
|
||||
unlistedAreasColor: layoutColors.defaultText,
|
||||
balloonText: '[[title]]: [[customData]] users'
|
||||
},
|
||||
|
||||
|
|
@ -66,9 +67,9 @@
|
|||
marginRight: 27,
|
||||
marginLeft: 27,
|
||||
equalWidths: false,
|
||||
backgroundAlpha: 0.5,
|
||||
backgroundColor: '#FFFFFF',
|
||||
borderColor: '#ffffff',
|
||||
backgroundAlpha: 0.3,
|
||||
backgroundColor: layoutColors.border,
|
||||
borderColor: layoutColors.border,
|
||||
borderAlpha: 1,
|
||||
top: 362,
|
||||
left: 0,
|
||||
|
|
|
|||
|
|
@ -9,24 +9,24 @@
|
|||
.controller('DashboardPieChartCtrl', DashboardPieChartCtrl);
|
||||
|
||||
/** @ngInject */
|
||||
function DashboardPieChartCtrl($scope, $element, $window, $timeout) {
|
||||
function DashboardPieChartCtrl($scope, $element, $window, $timeout, layoutColors) {
|
||||
$scope.charts = [{
|
||||
color: 'rgba(255,255,255,0.4)',
|
||||
color: layoutColors.border,
|
||||
description: 'New Visits',
|
||||
stats: '57,820',
|
||||
icon: 'person',
|
||||
}, {
|
||||
color: 'rgba(255,255,255,0.4)',
|
||||
color: layoutColors.border,
|
||||
description: 'Purchases',
|
||||
stats: '$ 89,745',
|
||||
icon: 'money',
|
||||
}, {
|
||||
color: 'rgba(255,255,255,0.4)',
|
||||
color: layoutColors.border,
|
||||
description: 'Active Users',
|
||||
stats: '178,391',
|
||||
icon: 'face',
|
||||
}, {
|
||||
color: 'rgba(255,255,255,0.4)',
|
||||
color: layoutColors.border,
|
||||
description: 'Returned',
|
||||
stats: '32,592',
|
||||
icon: 'refresh',
|
||||
|
|
|
|||
|
|
@ -9,99 +9,35 @@
|
|||
.controller('DashboardTodoCtrl', DashboardTodoCtrl);
|
||||
|
||||
/** @ngInject */
|
||||
function DashboardTodoCtrl($scope) {
|
||||
$scope.marks = [
|
||||
{
|
||||
id: 0,
|
||||
color: 'default'
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
color: 'primary'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
color: 'success'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
color: 'warning'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
color: 'danger'
|
||||
function DashboardTodoCtrl($scope, layoutColors) {
|
||||
|
||||
var palette = layoutColors.bgColorPalette;
|
||||
var colors = [];
|
||||
for (var key in palette) {
|
||||
colors.push(palette[key]);
|
||||
}
|
||||
|
||||
function getRandomColor() {
|
||||
var i = Math.floor(Math.random() * (colors.length - 1));
|
||||
return colors[i];
|
||||
}
|
||||
];
|
||||
|
||||
$scope.todoList = [
|
||||
{
|
||||
text: 'Check me out',
|
||||
edit: false, // todo: remove edit
|
||||
markId: 4
|
||||
},
|
||||
{
|
||||
text: 'Lorem ipsum dolor sit amet, possit denique oportere at his, etiam corpora deseruisse te pro',
|
||||
edit: false,
|
||||
markId: 3
|
||||
},
|
||||
{
|
||||
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
|
||||
},
|
||||
{ text: 'Check me out' },
|
||||
{ text: 'Lorem ipsum dolor sit amet, possit denique oportere at his, etiam corpora deseruisse te pro' },
|
||||
{ text: 'Ex has semper alterum, expetenda dignissim' },
|
||||
{ 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: 'Get in touch with akveo team' },
|
||||
{ text: 'Write email to business cat' },
|
||||
{ text: 'Have fun with blur admin' },
|
||||
{ text: 'What do you think?' },
|
||||
];
|
||||
|
||||
$scope.getMarkColor = function (id) {
|
||||
return $scope.marks.filter(function (item) {
|
||||
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.todoList.forEach(function(item) {
|
||||
item.color = getRandomColor();
|
||||
});
|
||||
|
||||
$scope.newTodoText = '';
|
||||
|
||||
|
|
@ -109,8 +45,7 @@
|
|||
if (clickPlus || event.which === 13) {
|
||||
$scope.todoList.unshift({
|
||||
text: $scope.newTodoText,
|
||||
edit: false,
|
||||
markId: 0
|
||||
color: getRandomColor(),
|
||||
});
|
||||
$scope.newTodoText = '';
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,10 +3,10 @@
|
|||
<div class="box-shadow-border"></div>
|
||||
<ul class="todo-list" ui-sortable ng-model="todoList">
|
||||
<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">
|
||||
<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">
|
||||
<input type="checkbox" ng-model="isChecked">
|
||||
<span class="cut-with-dots">{{ item.text }}</span>
|
||||
|
|
|
|||
|
|
@ -13,12 +13,19 @@
|
|||
var palette = layoutColors.bgColorPalette;
|
||||
$scope.doughnutData = [
|
||||
{
|
||||
value: 2000,
|
||||
value: 1000,
|
||||
color: palette.gossip,
|
||||
highlight: palette.gossipDark,
|
||||
label: 'Ad Campaigns',
|
||||
percentage: 17,
|
||||
order: 0,
|
||||
},{
|
||||
value: 1400,
|
||||
color: palette.white,
|
||||
highlight: palette.whiteDark,
|
||||
label: 'Ad Campaigns',
|
||||
label: 'Other',
|
||||
percentage: 87,
|
||||
order: 0,
|
||||
order: 1,
|
||||
}, {
|
||||
value: 1500,
|
||||
color: palette.blueStone,
|
||||
|
|
@ -40,13 +47,6 @@
|
|||
label: 'Direct Traffic',
|
||||
percentage: 38,
|
||||
order: 2,
|
||||
}, {
|
||||
value: 400,
|
||||
color: palette.gossip,
|
||||
highlight: palette.gossipDark,
|
||||
label: 'Other',
|
||||
percentage: 17,
|
||||
order: 1,
|
||||
},
|
||||
];
|
||||
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
surfieGreen: '#0e8174',
|
||||
silverTree: '#6eba8c',
|
||||
gossip: '#b9f2a1',
|
||||
white: '#ffffff',
|
||||
white: '#10c4b5',
|
||||
};
|
||||
|
||||
angular.module('BlurAdmin.theme')
|
||||
|
|
@ -52,7 +52,8 @@
|
|||
dangerBg: tint(colorScheme.danger, 20),
|
||||
|
||||
default: '#ffffff',
|
||||
defaultText: '#ffffff',
|
||||
defaultText: '#666666',
|
||||
border: '#dddddd',
|
||||
|
||||
bgColorPalette: {
|
||||
blueStone: bgColorPalette.blueStone,
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 16 KiB |
|
|
@ -24,7 +24,7 @@ body {
|
|||
@include bg-translucent-dark(0.5);
|
||||
border-radius: 5px;
|
||||
font-weight: $font-light;
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
padding: 32px;
|
||||
text-align: center;
|
||||
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@
|
|||
.amChartsButtonSelected {
|
||||
background-color: #CC0000;
|
||||
border: 1px solid #CC0000;
|
||||
color: #FFFFFF;
|
||||
color: $default-text;
|
||||
-moz-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
margin: 1px;
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@
|
|||
}
|
||||
|
||||
.mail-navigation-container {
|
||||
color: $default-text;
|
||||
width: 200px;
|
||||
.mail-navigation {
|
||||
cursor: pointer;
|
||||
|
|
@ -26,7 +27,6 @@
|
|||
left: 150px;
|
||||
padding: 1px 6px;
|
||||
border: 1px solid;
|
||||
color: white;
|
||||
background-color: $primary-light;
|
||||
margin-top: -2px;
|
||||
font-size: 12px;
|
||||
|
|
@ -36,13 +36,12 @@
|
|||
}
|
||||
&.active {
|
||||
background-color: $primary-light;
|
||||
color: white;
|
||||
&:hover {
|
||||
background-color: $primary-light;
|
||||
}
|
||||
.new-mails {
|
||||
color: $primary-light;
|
||||
background-color: white;
|
||||
background-color: $default;
|
||||
}
|
||||
transition: background-color .2s ease, 0.8s padding ease;
|
||||
}
|
||||
|
|
@ -54,7 +53,6 @@
|
|||
margin: 7px 0;
|
||||
.btn {
|
||||
width: 140px;
|
||||
color: white;
|
||||
font-weight: $font-light;
|
||||
background-color: $dribble-color;
|
||||
}
|
||||
|
|
@ -437,9 +435,6 @@
|
|||
&:focus {
|
||||
color: white;
|
||||
}
|
||||
&.focus {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.answer-container {
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@
|
|||
&:focus {
|
||||
box-shadow: none;
|
||||
border-color: $primary-bg;
|
||||
background: #ffffff;
|
||||
background: $default;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -361,7 +361,7 @@ label.custom-input-danger {
|
|||
}
|
||||
.input-group-addon {
|
||||
background-color: $color;
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -414,7 +414,7 @@ label.custom-input-danger {
|
|||
|
||||
@mixin groupAddon($color) {
|
||||
background: $color;
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
border-color: $color;
|
||||
}
|
||||
|
||||
|
|
@ -447,20 +447,20 @@ label.custom-input-danger {
|
|||
background: transparent;
|
||||
color: $default;
|
||||
&:focus {
|
||||
background: #ffffff;
|
||||
background: $default;
|
||||
box-shadow: none;
|
||||
outline: 0 !important;
|
||||
}
|
||||
&:active {
|
||||
border-color: $default;
|
||||
box-shadow: none;
|
||||
background: #ffffff;
|
||||
background: $default;
|
||||
}
|
||||
}
|
||||
&.open {
|
||||
.btn-default.dropdown-toggle {
|
||||
box-shadow: none;
|
||||
background-color: #ffffff;
|
||||
background-color: $default;
|
||||
border-color: $default;
|
||||
color: $default;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -91,7 +91,7 @@
|
|||
|
||||
@mixin message-modal-color($color) {
|
||||
.modal-header {
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
background: $color;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ h3.with-line {
|
|||
}
|
||||
|
||||
.profile-block {
|
||||
background: #fff;
|
||||
background: $default;
|
||||
|
||||
.nav-tabs > li {
|
||||
& > a {
|
||||
|
|
@ -86,7 +86,7 @@ h3.with-line {
|
|||
display: none;
|
||||
position: absolute;
|
||||
font-size: 32px;
|
||||
background: #ffffff;
|
||||
background: $default;
|
||||
cursor: pointer;
|
||||
color: $primary;
|
||||
top: -11px;
|
||||
|
|
@ -105,7 +105,7 @@ h3.with-line {
|
|||
width: 202px;
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
transition: all 200ms ease-in-out;
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
text-decoration: none;
|
||||
position: absolute;
|
||||
bottom: -1px;
|
||||
|
|
@ -149,7 +149,7 @@ a.sn-link {
|
|||
font-size: 17px;
|
||||
margin-right: 8px;
|
||||
background-color: rgba(0,0,0,.15);
|
||||
color: #fff;
|
||||
color: $default-text;
|
||||
}
|
||||
span {
|
||||
|
||||
|
|
|
|||
|
|
@ -263,7 +263,7 @@ h5 {
|
|||
}
|
||||
|
||||
.columns-section {
|
||||
background-color: white;
|
||||
background-color: $default;
|
||||
}
|
||||
|
||||
p {
|
||||
|
|
@ -349,16 +349,15 @@ a.learn-more {
|
|||
padding: 85px 90px 60px;
|
||||
display: inline-block;
|
||||
margin: 67px auto;
|
||||
background: #fff;
|
||||
background: $default;
|
||||
min-width: 432px;
|
||||
overflow: hidden;
|
||||
background: rgba(0, 0, 0, 0.75);
|
||||
color: #ffffff;
|
||||
|
||||
h1 {
|
||||
font-weight: $font-bold;
|
||||
width: 100%;
|
||||
color: #ffffff;
|
||||
color: $default;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
p {
|
||||
|
|
|
|||
|
|
@ -243,7 +243,7 @@
|
|||
text-align: center;
|
||||
text-decoration: none;
|
||||
opacity: 0.8;
|
||||
color: #fff;
|
||||
color: $default-text;
|
||||
font-size: 17px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
|
|
@ -295,7 +295,7 @@
|
|||
|
||||
.leaflet-control-layers {
|
||||
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4);
|
||||
background: #fff;
|
||||
background: $default;
|
||||
}
|
||||
|
||||
.leaflet-control-layers-toggle {
|
||||
|
|
@ -327,7 +327,7 @@
|
|||
.leaflet-control-layers-expanded {
|
||||
padding: 6px 10px 6px 6px;
|
||||
color: #333;
|
||||
background: #fff;
|
||||
background: $default;
|
||||
}
|
||||
|
||||
.leaflet-control-layers-selector {
|
||||
|
|
@ -349,7 +349,7 @@
|
|||
/* attribution and scale controls */
|
||||
|
||||
.leaflet-container .leaflet-control-attribution {
|
||||
background: #fff;
|
||||
background: $default;
|
||||
background: rgba(255, 255, 255, 0.7);
|
||||
margin: 0;
|
||||
}
|
||||
|
|
@ -392,7 +392,7 @@
|
|||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
|
||||
background: #fff;
|
||||
background: $default;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
|
|
@ -513,6 +513,6 @@
|
|||
/* div icon */
|
||||
|
||||
.leaflet-div-icon {
|
||||
background: #fff;
|
||||
background: $default;
|
||||
border: 1px solid #666;
|
||||
}
|
||||
|
|
@ -34,7 +34,7 @@ html {
|
|||
margin: 0 auto;
|
||||
border-radius: 5px;
|
||||
@include bg-translucent-dark(0.55);
|
||||
color: #fff;
|
||||
color: $default-text;
|
||||
padding: 32px;
|
||||
h1 {
|
||||
font-weight: $font-light;
|
||||
|
|
@ -142,13 +142,13 @@ a.forgot-pass {
|
|||
|
||||
.btn-auth {
|
||||
background: $primary;
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
border-radius: 5px;
|
||||
border-color: $primary;
|
||||
padding: 7px 12px;
|
||||
transition: all 0.1s ease;
|
||||
&:hover {
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
background: $primary;
|
||||
border-color: $primary;
|
||||
transform: scale(1.2);
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@ $hover: 24;
|
|||
}
|
||||
|
||||
.dropdown button.btn.btn-default.dropdown-toggle {
|
||||
color: #fff;
|
||||
color: $default-text;
|
||||
}
|
||||
|
||||
.bootstrap-select {
|
||||
|
|
|
|||
|
|
@ -14,8 +14,9 @@ html, body {
|
|||
|
||||
body {
|
||||
font: 14px/16px $font-family;
|
||||
color: white;
|
||||
@include main-background();
|
||||
color: $default-text;
|
||||
background-color: #F0F3F4;
|
||||
//@include main-background();
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -63,7 +64,7 @@ a {
|
|||
display: block;
|
||||
bottom: 0;
|
||||
font-size: 13px;
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
transition: padding-left 0.5s ease;
|
||||
}
|
||||
|
||||
|
|
@ -81,14 +82,14 @@ a {
|
|||
margin-right: 12px;
|
||||
i {
|
||||
margin: 0 4px;
|
||||
color: $warning;
|
||||
color: $danger;
|
||||
font-size: 12px;
|
||||
}
|
||||
a {
|
||||
margin-left: 4px;
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
&:hover {
|
||||
color: $warning;
|
||||
color: $danger;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -105,7 +106,7 @@ a {
|
|||
i {
|
||||
cursor: pointer;
|
||||
transition: all 0.1s ease;
|
||||
color: #ffffff;
|
||||
color: $default;
|
||||
padding: 6px;
|
||||
box-sizing: content-box;
|
||||
font-size: 16px;
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ $panel-heading-font-size: 16px;
|
|||
position: relative;
|
||||
//transition: all 0.2s ease;
|
||||
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 {
|
||||
background: $panel-bg-hover;
|
||||
}*/
|
||||
|
|
@ -42,6 +42,10 @@ $panel-heading-font-size: 16px;
|
|||
}
|
||||
}
|
||||
|
||||
.panel {
|
||||
background-color: $default;
|
||||
}
|
||||
|
||||
.panel > .panel-body {
|
||||
padding: 15px 22px;
|
||||
height: 100%;
|
||||
|
|
@ -63,25 +67,10 @@ $panel-heading-font-size: 16px;
|
|||
//text-transform: uppercase;
|
||||
}
|
||||
|
||||
.panel-white, .panel-blur {
|
||||
background-size: cover;
|
||||
> .panel-heading {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
color: $default-text;
|
||||
}
|
||||
}
|
||||
|
||||
.panel-white {
|
||||
background-color: $panel-bg;
|
||||
}
|
||||
|
||||
.panel-blur {
|
||||
$blurredBgUrl: $images-root + 'blur-bg-blurred.jpg';
|
||||
background: url($blurredBgUrl);
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.panel-primary {
|
||||
> .panel-heading {
|
||||
color: $primary;
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
|
||||
h1.al-title {
|
||||
font-weight: $font-bold;
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
float: left;
|
||||
width: auto;
|
||||
margin: 0;
|
||||
|
|
@ -17,7 +17,7 @@ h1.al-title {
|
|||
|
||||
.al-breadcrumb {
|
||||
background: none;
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
float: right;
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@
|
|||
margin-left: 0;
|
||||
}
|
||||
& > a {
|
||||
color: #ffffff;
|
||||
color: $default;
|
||||
text-decoration: none;
|
||||
font-size: 13px;
|
||||
position: relative;
|
||||
|
|
@ -35,7 +35,7 @@
|
|||
display: inline-block;
|
||||
min-width: 10px;
|
||||
padding: 2px 4px 2px 4px;
|
||||
color: #ffffff;
|
||||
color: $default;
|
||||
vertical-align: baseline;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
|
|
@ -247,7 +247,7 @@
|
|||
width: 0;
|
||||
height: 0;
|
||||
border: 10px solid transparent;
|
||||
border-bottom-color: #ffffff;
|
||||
border-bottom-color: $border;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
.page-top {
|
||||
@include bg-translucent-dark(0.5);
|
||||
background-color: $sidebar;
|
||||
position: fixed;
|
||||
z-index: 904;
|
||||
box-shadow: 2px 0px 3px rgba(0, 0, 0, 0.5);
|
||||
|
|
@ -9,12 +9,12 @@
|
|||
padding: 0 32px 0 40px;
|
||||
|
||||
&.scrolled {
|
||||
@include bg-translucent-dark(0.85);
|
||||
//background-color: rgba($sidebar, 0.9)
|
||||
}
|
||||
}
|
||||
|
||||
a.al-logo {
|
||||
color: #ffffff;
|
||||
color: $default;
|
||||
display: block;
|
||||
font-size: 24px;
|
||||
font-family: $font-family;
|
||||
|
|
@ -55,7 +55,7 @@ a.al-logo {
|
|||
}
|
||||
|
||||
a.refresh-data {
|
||||
color: #ffffff;
|
||||
color: $default;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
font-weight: $font-normal;
|
||||
|
|
@ -74,7 +74,7 @@ a.collapse-menu-link {
|
|||
display: block;
|
||||
text-decoration: none;
|
||||
line-height: 42px;
|
||||
color: #fff;
|
||||
color: $default;
|
||||
padding: 0;
|
||||
float: left;
|
||||
margin: 11px 0 0 25px;
|
||||
|
|
@ -107,7 +107,7 @@ a.collapse-menu-link {
|
|||
|
||||
.search {
|
||||
text-shadow: none;
|
||||
color: #fff;
|
||||
color: $default;
|
||||
font-size: 13px;
|
||||
line-height: 25px;
|
||||
transition: all 0.5s ease;
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ $angle-right: "\f101";
|
|||
z-index: 904;
|
||||
display: block;
|
||||
min-height: 100%;
|
||||
@include bg-translucent-dark(0.5);
|
||||
background-color: $sidebar;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
}
|
||||
|
|
@ -67,7 +67,7 @@ a.al-sidebar-list-link {
|
|||
text-shadow: none;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
color: #ffffff;
|
||||
color: $default;
|
||||
line-height: 42px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
|
|
@ -136,7 +136,7 @@ a.al-sidebar-list-link {
|
|||
text-shadow: none;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
color: #ffffff;
|
||||
color: $default;
|
||||
padding-left: 52px;
|
||||
height: auto;
|
||||
line-height: 29px;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,8 @@
|
|||
$default: #ffffff !default;
|
||||
$default-text: #666666;
|
||||
$help-text: #949494;
|
||||
$sidebar: #1C2B36;
|
||||
|
||||
$primary: #209e91 !default;
|
||||
$info: #2dacd1 !default;
|
||||
$success: #90b900 !default;
|
||||
|
|
|
|||
|
|
@ -1,12 +1,8 @@
|
|||
$font-family: 'Roboto', sans-serif;
|
||||
|
||||
$view-total :rgba(0,0,0,.4);
|
||||
|
||||
$activelink: $primary;
|
||||
$hoverlink: $primary-dark;
|
||||
|
||||
$default: #ffffff !default;
|
||||
|
||||
$facebook-color: #3b5998;
|
||||
$twitter-color: #55acee;
|
||||
$google-color: #dd4b39;
|
||||
|
|
@ -22,9 +18,6 @@ $panel-bg-hover: #fff;
|
|||
$disabled: #bdbdbd;
|
||||
$disabled-bg: #e6e6e6;
|
||||
|
||||
$default-text: #7b7b7b;
|
||||
$help-text: #949494;
|
||||
|
||||
$border: #dddddd;
|
||||
$border-light: #eeeeee;
|
||||
$input-border: #cccccc;
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
}
|
||||
|
||||
.feed-message {
|
||||
$text-message-color: $default;
|
||||
$text-message-color: $default-text;
|
||||
$video-message-color: $danger;
|
||||
$image-message-color: $success;
|
||||
$geo-message-color: $primary;
|
||||
|
|
@ -80,7 +80,7 @@
|
|||
border-radius: 5px;
|
||||
margin: 0 0 0 80px;
|
||||
padding: 5px 20px;
|
||||
color: #fff;
|
||||
color: $default-text;
|
||||
width: 280px;
|
||||
height: 70px;
|
||||
|
||||
|
|
|
|||
|
|
@ -98,7 +98,7 @@ div.blurCalendar{
|
|||
}
|
||||
|
||||
.fc-popover {
|
||||
background-color: #ffffff;
|
||||
background-color: $default;
|
||||
border: 1px solid;
|
||||
|
||||
.fc-header {
|
||||
|
|
@ -330,7 +330,7 @@ div.blurCalendar{
|
|||
.fc-event,
|
||||
.fc-event:hover,
|
||||
.ui-widget .fc-event {
|
||||
color: #ffffff;
|
||||
color: $default;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
|
|
@ -663,7 +663,7 @@ a.fc-more {
|
|||
|
||||
.fc-bg {
|
||||
z-index: 1;
|
||||
background: #fff;
|
||||
background: $default;
|
||||
opacity: .25;
|
||||
filter: alpha(opacity=25);
|
||||
}
|
||||
|
|
@ -742,7 +742,7 @@ body.badmin-transparent{
|
|||
}
|
||||
|
||||
.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 {
|
||||
|
|
@ -756,7 +756,7 @@ body.badmin-transparent{
|
|||
background: transparent;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
color: $default;
|
||||
color: $default-text;
|
||||
}
|
||||
.fc-next-button {
|
||||
left: 30px;
|
||||
|
|
@ -764,7 +764,7 @@ body.badmin-transparent{
|
|||
.fc-prev-button {
|
||||
}
|
||||
.fc-day-number{
|
||||
color: $default;
|
||||
color: $default-text;
|
||||
opacity: 0.9;
|
||||
}
|
||||
}
|
||||
|
|
@ -5,11 +5,11 @@
|
|||
|
||||
.popular-app-img {
|
||||
position: relative;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
padding: 30px 0;
|
||||
height: 260px;
|
||||
border-top-right-radius: 5px;
|
||||
border-top-left-radius: 5px;
|
||||
border-bottom: 1px solid $border;
|
||||
img {
|
||||
max-width: 60%;
|
||||
max-height: 70%;
|
||||
|
|
|
|||
|
|
@ -22,11 +22,11 @@ ul.todo-list {
|
|||
right: 12px;
|
||||
font-size: 32px;
|
||||
transition: color 0.2s;
|
||||
color: $input-border;
|
||||
color: rgba($input-border, 0.5);
|
||||
visibility: hidden;
|
||||
line-height: 42px;
|
||||
&:hover {
|
||||
color: $danger-dark;
|
||||
color: $input-border;
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
|
|
@ -37,34 +37,13 @@ ul.todo-list {
|
|||
|
||||
&.checked {
|
||||
.todo-text {
|
||||
color: #BFBFBF;
|
||||
color: $default-text;
|
||||
}
|
||||
&:before {
|
||||
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 {
|
||||
display: block;
|
||||
position: absolute;
|
||||
|
|
@ -117,104 +96,3 @@ label.todo-checkbox {
|
|||
.add-item-icon {
|
||||
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;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -101,10 +101,12 @@
|
|||
border-radius: 0;
|
||||
width: 100%;
|
||||
margin-bottom: 0;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
background-color: $border-light;
|
||||
box-shadow: none;
|
||||
.progress-bar{
|
||||
height: 4px;
|
||||
background-color: white;
|
||||
background-color: $input-border;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -119,12 +121,11 @@
|
|||
}
|
||||
|
||||
.traffic-chart canvas{
|
||||
border: 10px solid rgba(0,0,0,0.0);
|
||||
border: 10px solid $default;
|
||||
border-radius: 150px;
|
||||
}
|
||||
|
||||
.chart-bg{
|
||||
background-color: $view-total;
|
||||
position: absolute;
|
||||
border-radius: 100px;
|
||||
width: 180px;
|
||||
|
|
@ -191,12 +192,3 @@
|
|||
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;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
body.badmin-transparent {
|
||||
|
||||
&.mobile{
|
||||
background: none;
|
||||
.body-bg{
|
||||
|
|
@ -11,42 +11,30 @@ body.badmin-transparent {
|
|||
@include main-background();
|
||||
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 {
|
||||
background-attachment: fixed;
|
||||
@include scrollbars(.4em, rgba(0, 0, 0, 0.7), rgba(255, 255, 255, 0.8));
|
||||
border-radius: 5px;
|
||||
color: $default;
|
||||
color: $default-text;
|
||||
.panel-heading {
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
|
||||
box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.12);
|
||||
transform: translate3d(0,0,0);
|
||||
}
|
||||
.panel-body {
|
||||
transform: translate3d(0,0,0);
|
||||
}
|
||||
}
|
||||
.btn-default {
|
||||
color: $default;
|
||||
}
|
||||
.form-control, .bootstrap-tagsinput input {
|
||||
@include placeholderStyle($default, 0.7);
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
@include placeholderStyle($default-text, 0.7);
|
||||
border: 1px solid $border;
|
||||
border-radius: 5px;
|
||||
color: $default;
|
||||
color: $default-text;
|
||||
}
|
||||
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
|
||||
@include placeholderStyle($default, 0.5);
|
||||
@include placeholderStyle($default-text, 0.5);
|
||||
}
|
||||
.irs-grid-text {
|
||||
color: $default;
|
||||
}
|
||||
color: $default-text;
|
||||
}
|
||||
Loading…
Reference in New Issue