mirror of
https://github.com/akveo/ngx-admin.git
synced 2025-12-16 23:40:14 +01:00
styles refactoring as per 1.x theme update
This commit is contained in:
parent
6c8e632164
commit
06d0dc1c99
23 changed files with 590 additions and 705 deletions
|
|
@ -1,9 +1,8 @@
|
|||
@import '../../../theme/sass/conf/conf';
|
||||
|
||||
div.blurCalendar {
|
||||
div.blurCalendar{
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.fc {
|
||||
direction: ltr;
|
||||
text-align: left;
|
||||
|
|
@ -58,7 +57,7 @@ div.blurCalendar {
|
|||
}
|
||||
|
||||
th, td {
|
||||
border: 1px solid;
|
||||
border: 1px solid rgba(255,255,255,0.3);
|
||||
padding: 0;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
|
@ -97,11 +96,11 @@ div.blurCalendar {
|
|||
|
||||
.fc-unthemed {
|
||||
th, td, hr, thead, tbody, .fc-row, .fc-popover {
|
||||
border-color: $border;
|
||||
border-color: rgba($border, 0.3);
|
||||
}
|
||||
|
||||
.fc-popover {
|
||||
background-color: #ffffff;
|
||||
background-color: $default;
|
||||
border: 1px solid;
|
||||
|
||||
.fc-header {
|
||||
|
|
@ -120,12 +119,12 @@ div.blurCalendar {
|
|||
}
|
||||
|
||||
.fc-today {
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
background: rgba(255,255,255,0.15);
|
||||
}
|
||||
}
|
||||
|
||||
.fc-highlight {
|
||||
background: rgba(255, 255, 255, 0.25);
|
||||
background: rgba(255,255,255,0.25);
|
||||
opacity: .3;
|
||||
}
|
||||
|
||||
|
|
@ -333,7 +332,7 @@ div.blurCalendar {
|
|||
.fc-event,
|
||||
.fc-event:hover,
|
||||
.ui-widget .fc-event {
|
||||
color: #ffffff;
|
||||
color: $label-text;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
|
|
@ -666,7 +665,7 @@ a.fc-more {
|
|||
|
||||
.fc-bg {
|
||||
z-index: 1;
|
||||
background: #fff;
|
||||
background: $default;
|
||||
opacity: .25;
|
||||
filter: alpha(opacity=25);
|
||||
}
|
||||
|
|
@ -720,55 +719,48 @@ a.fc-more {
|
|||
}
|
||||
}
|
||||
|
||||
.fc-day-grid-container.fc-scroller {
|
||||
height: auto !important;
|
||||
.fc-day-grid-container.fc-scroller {
|
||||
height: auto!important;
|
||||
}
|
||||
|
||||
body.badmin-transparent {
|
||||
.calendar-panel.panel .panel-body{
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.calendar-panel.card .card-body {
|
||||
padding: 0;
|
||||
}
|
||||
.fc-body > tr > .fc-widget-content{
|
||||
border: none;
|
||||
}
|
||||
|
||||
.fc-body > tr > .fc-widget-content {
|
||||
border: none;
|
||||
.fc-head{
|
||||
color: $label-text;
|
||||
background-color: $primary;
|
||||
td, th{
|
||||
border:none;
|
||||
}
|
||||
|
||||
.fc-head {
|
||||
color: $default;
|
||||
background-color: $primary;
|
||||
td, th {
|
||||
border: none;
|
||||
}
|
||||
div.fc-widget-header {
|
||||
padding: 5px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.fc td {
|
||||
border-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.fc-today-button, .fc-month-button, .fc-agendaWeek-button, .fc-agendaDay-button {
|
||||
display: none;
|
||||
}
|
||||
.blurCalendar {
|
||||
margin-top: 15px;
|
||||
}
|
||||
.fc-prev-button, .fc-next-button {
|
||||
position: absolute;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
color: $default;
|
||||
}
|
||||
.fc-next-button {
|
||||
left: 30px;
|
||||
}
|
||||
.fc-prev-button {
|
||||
}
|
||||
.fc-day-number {
|
||||
color: $default;
|
||||
opacity: 0.9;
|
||||
div.fc-widget-header{
|
||||
padding: 5px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.fc-today-button, .fc-month-button, .fc-agendaWeek-button, .fc-agendaDay-button {
|
||||
display: none;
|
||||
}
|
||||
.blurCalendar{
|
||||
margin-top: 15px;
|
||||
}
|
||||
.fc-prev-button, .fc-next-button{
|
||||
position: absolute;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
color: $default-text;
|
||||
}
|
||||
.fc-next-button {
|
||||
left: 30px;
|
||||
}
|
||||
.fc-prev-button {
|
||||
}
|
||||
.fc-day-number{
|
||||
color: $default-text;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,25 +1,21 @@
|
|||
@import '../../../theme/sass/conf/conf';
|
||||
|
||||
.feed-panel .card-body {
|
||||
.feed-panel .panel-body{
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.feed-message {
|
||||
$text-message-color: $default;
|
||||
$text-message-color: $default-text;
|
||||
$video-message-color: $danger;
|
||||
$image-message-color: $success;
|
||||
$geo-message-color: $primary;
|
||||
padding: 10px 0;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
|
||||
box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.12);
|
||||
padding: 10px 0 ;
|
||||
border-bottom: 1px solid rgba(0,0,0,0.12);
|
||||
box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.12);
|
||||
&:first-child {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none!important;
|
||||
}
|
||||
|
||||
.message-icon {
|
||||
cursor: pointer;
|
||||
width: 60px;
|
||||
|
|
@ -86,7 +82,7 @@
|
|||
border-radius: 5px;
|
||||
margin: 0 0 0 80px;
|
||||
padding: 5px 20px;
|
||||
color: #fff;
|
||||
color: $default-text;
|
||||
width: 280px;
|
||||
height: 70px;
|
||||
|
||||
|
|
@ -142,7 +138,7 @@
|
|||
padding-top: 10px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
float: none !important;
|
||||
float: none!important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -162,58 +158,65 @@
|
|||
}
|
||||
}
|
||||
|
||||
.line-clamp {
|
||||
display: block;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
position: relative;
|
||||
|
||||
line-height: 1.2;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
padding: 0 !important;
|
||||
|
||||
.line-clamp
|
||||
{
|
||||
display : block;
|
||||
display : -webkit-box;
|
||||
-webkit-box-orient : vertical;
|
||||
position : relative;
|
||||
|
||||
line-height : 1.2;
|
||||
overflow : hidden;
|
||||
text-overflow : ellipsis;
|
||||
padding : 0 !important;
|
||||
}
|
||||
|
||||
@media screen and (-webkit-min-device-pixel-ratio: 0) {
|
||||
.line-clamp:after {
|
||||
content: '...';
|
||||
text-align: right;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 25%;
|
||||
display: block;
|
||||
position: absolute;
|
||||
height: calc(1em * 1.2);
|
||||
@media screen and (-webkit-min-device-pixel-ratio:0) {
|
||||
.line-clamp:after
|
||||
{
|
||||
content : '...';
|
||||
text-align : right;
|
||||
bottom : 0;
|
||||
right : 0;
|
||||
width : 25%;
|
||||
display : block;
|
||||
position : absolute;
|
||||
height : calc(1em * 1.2);
|
||||
}
|
||||
}
|
||||
|
||||
@supports (-webkit-line-clamp: 1) {
|
||||
.line-clamp:after {
|
||||
display: none !important;
|
||||
|
||||
@supports (-webkit-line-clamp: 1)
|
||||
{
|
||||
.line-clamp:after
|
||||
{
|
||||
display : none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.line-clamp-1 {
|
||||
-webkit-line-clamp: 1;
|
||||
height: calc(1em * 1.2 * 1);
|
||||
.line-clamp-1
|
||||
{
|
||||
-webkit-line-clamp : 1;
|
||||
height : calc(1em * 1.2 * 1);
|
||||
}
|
||||
|
||||
.line-clamp-2 {
|
||||
-webkit-line-clamp: 2;
|
||||
height: calc(1em * 1.2 * 2);
|
||||
.line-clamp-2
|
||||
{
|
||||
-webkit-line-clamp : 2;
|
||||
height : calc(1em * 1.2 * 2);
|
||||
}
|
||||
|
||||
.line-clamp-3 {
|
||||
-webkit-line-clamp: 3;
|
||||
height: calc(1em * 1.2 * 3);
|
||||
.line-clamp-3
|
||||
{
|
||||
-webkit-line-clamp : 3;
|
||||
height : calc(1em * 1.2 * 3);
|
||||
}
|
||||
|
||||
.line-clamp-4 {
|
||||
-webkit-line-clamp: 4;
|
||||
height: calc(1em * 1.2 * 4);
|
||||
.line-clamp-4
|
||||
{
|
||||
-webkit-line-clamp : 4;
|
||||
height : calc(1em * 1.2 * 4);
|
||||
}
|
||||
|
||||
.line-clamp-5 {
|
||||
-webkit-line-clamp: 5;
|
||||
height: calc(1em * 1.2 * 5);
|
||||
.line-clamp-5
|
||||
{
|
||||
-webkit-line-clamp : 5;
|
||||
height : calc(1em * 1.2 * 5);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,30 +1,36 @@
|
|||
@import "../../../theme/sass/conf/conf";
|
||||
|
||||
.card.popular-app {
|
||||
&>.card-body {
|
||||
.panel.popular-app {
|
||||
&>.panel-body {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.popular-app-img {
|
||||
.popular-app-img-container {
|
||||
position: relative;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
padding: 30px 0;
|
||||
height: 260px;
|
||||
border-top-right-radius: 5px;
|
||||
border-top-left-radius: 5px;
|
||||
img {
|
||||
max-width: 60%;
|
||||
max-height: 70%;
|
||||
.popular-app-img {
|
||||
width: 260px;
|
||||
position: absolute;
|
||||
transform: translateY(-50%) translate(-50%);
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
|
||||
.logo-text {
|
||||
display: inline-block;
|
||||
margin: 10px;
|
||||
font-size: 26px;
|
||||
color: $default-text;
|
||||
}
|
||||
}
|
||||
}
|
||||
.popular-app-cost {
|
||||
font-size: 20px;
|
||||
padding: 20px 22px;
|
||||
border-bottom: 1px solid $border;
|
||||
border-bottom: 1px solid $border-light;
|
||||
border-top: 1px solid $border-light;
|
||||
}
|
||||
.popular-app-info {
|
||||
padding: 20px 22px;
|
||||
|
|
@ -42,13 +48,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
body.badmin-transparent {
|
||||
.popular-app-img {
|
||||
border-top-right-radius: 5px;
|
||||
border-top-left-radius: 5px;
|
||||
}
|
||||
.popular-app-cost {
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
|
||||
box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
}
|
||||
.blur-theme .panel.popular-app .popular-app-img-container {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
@import '../../../theme/sass/conf/conf';
|
||||
|
||||
|
||||
input.task-todo {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
|
@ -25,11 +24,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 {
|
||||
|
|
@ -40,34 +39,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;
|
||||
|
|
@ -102,9 +80,6 @@ ul.todo-list {
|
|||
}
|
||||
|
||||
label.todo-checkbox {
|
||||
padding-left: 0;
|
||||
margin-bottom: 0;
|
||||
|
||||
width: 100%;
|
||||
padding-right: 25px;
|
||||
min-height: 16px;
|
||||
|
|
@ -124,8 +99,8 @@ label.todo-checkbox {
|
|||
display: none;
|
||||
}
|
||||
|
||||
body.badmin-transparent {
|
||||
.todo-panel.card {
|
||||
.task-todo-container.transparent {
|
||||
.todo-panel.panel {
|
||||
color: white;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
|
@ -175,11 +150,6 @@ body.badmin-transparent {
|
|||
-webkit-filter: blur(3px);
|
||||
}
|
||||
}
|
||||
&.primary, &.danger,&.success, &.info, &.warning {
|
||||
i.mark {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
i.remove-todo {
|
||||
color: white;
|
||||
opacity: 0.4;
|
||||
|
|
@ -190,12 +160,12 @@ body.badmin-transparent {
|
|||
}
|
||||
i.mark {
|
||||
min-width: 40px;
|
||||
background-color: transparent;
|
||||
display: none;
|
||||
}
|
||||
label.todo-checkbox > span {
|
||||
&:before {
|
||||
position: absolute;
|
||||
color: white;
|
||||
color: $default-text;
|
||||
content: '\f10c';
|
||||
float: none;
|
||||
margin-right: 6px;
|
||||
|
|
@ -205,11 +175,7 @@ body.badmin-transparent {
|
|||
&.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;
|
||||
content: '\f00c';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,22 +1,34 @@
|
|||
@import '../../../theme/sass/conf/conf';
|
||||
|
||||
.chart-area {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.channels-block {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.channels-block.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;
|
||||
}
|
||||
|
||||
.chart-bg{
|
||||
position: absolute;
|
||||
width: 180px;
|
||||
height: 180px;
|
||||
left: 60px;
|
||||
top: 60px;
|
||||
background-color: rgba(0,0,0,0.35);
|
||||
border-radius: 100px;
|
||||
}
|
||||
}
|
||||
|
||||
.channels-info {
|
||||
display: inline-block;
|
||||
width: calc(100% - 370px);
|
||||
margin-left: 70px;
|
||||
margin-top: -20px;
|
||||
}
|
||||
|
||||
.small-container {
|
||||
.channels-info {
|
||||
display: none;
|
||||
|
|
@ -29,7 +41,7 @@
|
|||
font-size: 18px;
|
||||
opacity: 0.9;
|
||||
}
|
||||
.channel-number {
|
||||
.channel-number{
|
||||
display: inline-block;
|
||||
float: right;
|
||||
}
|
||||
|
|
@ -44,7 +56,7 @@
|
|||
|
||||
.traffic-legend {
|
||||
display: inline-block;
|
||||
padding: 70px 0 0 0;
|
||||
padding: 70px 0 0 0px;
|
||||
width: 160px;
|
||||
}
|
||||
|
||||
|
|
@ -75,10 +87,6 @@
|
|||
height: 300px;
|
||||
position: relative;
|
||||
float: left;
|
||||
//canvas{
|
||||
// border: 10px solid rgba(0, 0, 0, 0.34902);
|
||||
// border-radius: 180px;
|
||||
//}
|
||||
}
|
||||
|
||||
.traffic-text {
|
||||
|
|
@ -109,79 +117,67 @@
|
|||
border-radius: 0;
|
||||
width: 100%;
|
||||
margin-bottom: 0;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
.progress-bar {
|
||||
background-color: $progress-background;
|
||||
box-shadow: none;
|
||||
.progress-bar{
|
||||
height: 4px;
|
||||
background-color: white;
|
||||
background-color: $progress-default;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.legend-color {
|
||||
.legend-color{
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25);
|
||||
box-shadow:0 2px 2px 0 rgba(0, 0, 0, 0.25);
|
||||
position: relative;
|
||||
top: 27px;
|
||||
border-radius: 15px;
|
||||
left: -45px;
|
||||
}
|
||||
|
||||
.traffic-chart canvas {
|
||||
border: 10px solid rgba(0, 0, 0, 0.0);
|
||||
border-radius: 150px;
|
||||
}
|
||||
|
||||
.chart-bg {
|
||||
background-color: rgba(0, 0, 0, 0.35);
|
||||
position: absolute;
|
||||
border-radius: 100px;
|
||||
width: 180px;
|
||||
height: 180px;
|
||||
left: 60px;
|
||||
top: 60px;
|
||||
}
|
||||
|
||||
@media (max-width: $resM) {
|
||||
div.channels-info {
|
||||
div.channels-info{
|
||||
display: block;
|
||||
width: calc(100% - 88px);
|
||||
margin-top: -65px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.card.medium-card.traffic-panel {
|
||||
.panel.medium-panel.traffic-panel{
|
||||
height: auto;
|
||||
}
|
||||
.traffic-chart {
|
||||
.traffic-chart{
|
||||
position: inherit;
|
||||
float: none;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.chart-bg {
|
||||
.chart-bg{
|
||||
left: calc(50% - 90px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1465px) and (min-width: 1199px) {
|
||||
.channels-info {
|
||||
@media (max-width: 1465px) and (min-width: 1199px){
|
||||
.channels-info{
|
||||
display: none;
|
||||
}
|
||||
.traffic-chart {
|
||||
.traffic-chart{
|
||||
position: inherit;
|
||||
float: none;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.chart-bg {
|
||||
.chart-bg{
|
||||
left: calc(50% - 90px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 380px) {
|
||||
|
||||
.traffic-chart {
|
||||
@media (max-width: 380px){
|
||||
|
||||
.traffic-chart{
|
||||
width: 240px;
|
||||
}
|
||||
|
||||
.canvas-holder {
|
||||
.canvas-holder{
|
||||
width: 240px;
|
||||
height: 240px;
|
||||
}
|
||||
|
|
@ -190,8 +186,7 @@
|
|||
top: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 320px) {
|
||||
@media (max-width: 320px){
|
||||
.chart-bg {
|
||||
left: 50px;
|
||||
top: 50px;
|
||||
|
|
@ -199,11 +194,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;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,22 +7,34 @@ export class TrafficChartService {
|
|||
private _palette = layoutColors.bgColorPalette;
|
||||
private _data = [
|
||||
{
|
||||
value: 2000,
|
||||
color: this._palette.white,
|
||||
highlight: this._palette.whiteDark,
|
||||
label: 'Ad Campaigns',
|
||||
percentage: 87,
|
||||
order: 0,
|
||||
},
|
||||
{
|
||||
value: 400,
|
||||
value: 1000,
|
||||
color: this._palette.gossip,
|
||||
highlight: this._palette.gossipDark,
|
||||
label: 'Other',
|
||||
label: 'Ad Campaigns',
|
||||
percentage: 17,
|
||||
order: 0,
|
||||
},{
|
||||
value: 1400,
|
||||
color: this._palette.white,
|
||||
highlight: this._palette.whiteDark,
|
||||
label: 'Other',
|
||||
percentage: 87,
|
||||
order: 1,
|
||||
},
|
||||
{
|
||||
}, {
|
||||
value: 1500,
|
||||
color: this._palette.blueStone,
|
||||
highlight: this._palette.blueStoneDark,
|
||||
label: 'Search engines',
|
||||
percentage: 22,
|
||||
order: 4,
|
||||
}, {
|
||||
value: 1000,
|
||||
color: this._palette.surfieGreen,
|
||||
highlight: this._palette.surfieGreenDark,
|
||||
label: 'Referral Traffic',
|
||||
percentage: 70,
|
||||
order: 3,
|
||||
}, {
|
||||
value: 1200,
|
||||
color: this._palette.silverTree,
|
||||
highlight: this._palette.silverTreeDark,
|
||||
|
|
@ -30,22 +42,6 @@ export class TrafficChartService {
|
|||
percentage: 38,
|
||||
order: 2,
|
||||
},
|
||||
{
|
||||
value: 1000,
|
||||
color: this._palette.surfieGreen,
|
||||
highlight: this._palette.surfieGreenDark,
|
||||
label: 'Referral Traffic',
|
||||
percentage: 70,
|
||||
order: 3,
|
||||
},
|
||||
{
|
||||
value: 1500,
|
||||
color: this._palette.blueStone,
|
||||
highlight: this._palette.blueStoneDark,
|
||||
label: 'Search engines',
|
||||
percentage: 22,
|
||||
order: 4,
|
||||
}
|
||||
];
|
||||
|
||||
getData() {
|
||||
|
|
|
|||
|
|
@ -1,10 +1,5 @@
|
|||
@import '../../../../theme/sass/conf/conf';
|
||||
|
||||
.leaflet-maps {
|
||||
width: 100%;
|
||||
height: calc(100vh - 283px);
|
||||
}
|
||||
|
||||
#leaflet-map {
|
||||
height: calc(100vh - 283px);
|
||||
}
|
||||
|
|
@ -250,7 +245,7 @@
|
|||
text-align: center;
|
||||
text-decoration: none;
|
||||
opacity: 0.8;
|
||||
color: #fff;
|
||||
color: $default-text;
|
||||
font-size: 17px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
|
|
@ -280,7 +275,7 @@
|
|||
.leaflet-bar .leaflet-control-zoom-in,
|
||||
.leaflet-bar .leaflet-control-zoom-out {
|
||||
line-height: 18px;
|
||||
&:hover {
|
||||
&:hover{
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
|
@ -302,7 +297,7 @@
|
|||
|
||||
.leaflet-control-layers {
|
||||
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4);
|
||||
background: #fff;
|
||||
background: $default;
|
||||
}
|
||||
|
||||
.leaflet-control-layers-toggle {
|
||||
|
|
@ -334,7 +329,7 @@
|
|||
.leaflet-control-layers-expanded {
|
||||
padding: 6px 10px 6px 6px;
|
||||
color: #333;
|
||||
background: #fff;
|
||||
background: $default;
|
||||
}
|
||||
|
||||
.leaflet-control-layers-selector {
|
||||
|
|
@ -356,7 +351,7 @@
|
|||
/* attribution and scale controls */
|
||||
|
||||
.leaflet-container .leaflet-control-attribution {
|
||||
background: #fff;
|
||||
background: $default;
|
||||
background: rgba(255, 255, 255, 0.7);
|
||||
margin: 0;
|
||||
}
|
||||
|
|
@ -399,7 +394,7 @@
|
|||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
|
||||
background: #fff;
|
||||
background: $default;
|
||||
background: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
|
|
@ -440,7 +435,7 @@
|
|||
.leaflet-popup-content {
|
||||
margin: 13px 19px;
|
||||
line-height: 1.4;
|
||||
color: $default-text;
|
||||
color: $dropdown-text;
|
||||
}
|
||||
|
||||
.leaflet-popup-content p {
|
||||
|
|
@ -520,6 +515,6 @@
|
|||
/* div icon */
|
||||
|
||||
.leaflet-div-icon {
|
||||
background: #fff;
|
||||
background: $default;
|
||||
border: 1px solid #666;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,24 +7,15 @@
|
|||
color: $default-text;
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
background-color: $border-light;
|
||||
background-color: rgba($default-text, 0.3);
|
||||
padding: 12px 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.grid-h{
|
||||
margin-top: 10px;
|
||||
margin-top: 40px;
|
||||
margin-bottom: 0;
|
||||
&:first-child{
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
body.badmin-transparent {
|
||||
.show-grid div[class^=col-]{
|
||||
div {
|
||||
color: $default;
|
||||
background-color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
|
||||
h1.al-title {
|
||||
font-weight: $font-bold;
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
float: left;
|
||||
width: auto;
|
||||
margin: 0;
|
||||
|
|
@ -19,14 +19,14 @@ h1.al-title {
|
|||
|
||||
.al-breadcrumb {
|
||||
background: none;
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
float: right;
|
||||
padding-top: 11px;
|
||||
li {
|
||||
font-size: 18px;
|
||||
font-weight: $font-light;
|
||||
font-weight: $font-normal;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@
|
|||
margin-left: 0;
|
||||
}
|
||||
& > a {
|
||||
color: #ffffff;
|
||||
color: $sidebar-text;
|
||||
text-decoration: none;
|
||||
font-size: 13px;
|
||||
position: relative;
|
||||
|
|
@ -37,7 +37,7 @@
|
|||
display: inline-block;
|
||||
min-width: 10px;
|
||||
padding: 2px 4px 2px 4px;
|
||||
color: #ffffff;
|
||||
color: $sidebar-text;
|
||||
vertical-align: baseline;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
|
|
@ -113,20 +113,21 @@
|
|||
left: auto;
|
||||
right: -47px;
|
||||
top: 26px;
|
||||
@include scrollbars(.4em, rgba(0, 0, 0, 0.5), #fff);
|
||||
@include scrollbars(.4em, rgba(0,0,0,0.5), #fff);
|
||||
.header {
|
||||
padding: 10px 12px;
|
||||
border-bottom: 1px solid $border-light;
|
||||
border-bottom: 1px solid $default;
|
||||
font-size: 12px;
|
||||
strong {
|
||||
float: left;
|
||||
color: $dropdown-text;
|
||||
}
|
||||
& > a {
|
||||
float: right;
|
||||
margin-left: 12px;
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
color: $default-text;
|
||||
color: $dropdown-text;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -135,11 +136,11 @@
|
|||
overflow: scroll;
|
||||
overflow-x: hidden;
|
||||
& > a {
|
||||
border-top: 1px solid $border-light;
|
||||
border-top: 1px solid $default;
|
||||
padding: 10px 12px;
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
color: $default-text;
|
||||
color: $dropdown-text;
|
||||
font-size: 12px;
|
||||
&:first-child {
|
||||
border-top: none;
|
||||
|
|
@ -150,7 +151,7 @@
|
|||
img {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
&.photo-msg-item {
|
||||
&.photo-msg-item{
|
||||
border-radius: 18px;
|
||||
}
|
||||
}
|
||||
|
|
@ -193,14 +194,14 @@
|
|||
}
|
||||
}
|
||||
& > a {
|
||||
border-top: 1px solid $border-light;
|
||||
border-top: 1px solid $default;
|
||||
display: block;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
font-size: 12px;
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
color: $default-text;
|
||||
color: $dropdown-text;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -212,10 +213,10 @@
|
|||
text-align: left;
|
||||
border: none;
|
||||
text-decoration: none;
|
||||
color: $default-text;
|
||||
color: $dropdown-text;
|
||||
padding: 4px 16px 4px 20px;
|
||||
&.signout {
|
||||
border-top: 1px solid $border-light;
|
||||
border-top: 1px solid $default;
|
||||
}
|
||||
i {
|
||||
margin-right: 10px;
|
||||
|
|
@ -248,7 +249,7 @@
|
|||
width: 0;
|
||||
height: 0;
|
||||
border: 10px solid transparent;
|
||||
border-bottom-color: #ffffff;
|
||||
border-bottom-color: $default;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
@import '../../components/msgCenter/msgCenter';
|
||||
|
||||
.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);
|
||||
|
|
@ -12,16 +12,12 @@
|
|||
padding: 0 32px 0 40px;
|
||||
|
||||
&.scrolled {
|
||||
@include bg-translucent-dark(0.85);
|
||||
}
|
||||
|
||||
.dropdown-toggle::after {
|
||||
display: none;
|
||||
background-color: rgba(black, 0.85)
|
||||
}
|
||||
}
|
||||
|
||||
a.al-logo {
|
||||
color: #ffffff;
|
||||
color: $sidebar-text;
|
||||
display: block;
|
||||
font-size: 24px;
|
||||
font-family: $font-family;
|
||||
|
|
@ -29,11 +25,6 @@ a.al-logo {
|
|||
float: left;
|
||||
outline: none !important;
|
||||
line-height: 60px;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: $hoverlink;
|
||||
}
|
||||
|
||||
span {
|
||||
color: $primary;
|
||||
|
|
@ -67,7 +58,7 @@ a.al-logo {
|
|||
}
|
||||
|
||||
a.refresh-data {
|
||||
color: #ffffff;
|
||||
color: $sidebar-text;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
font-weight: $font-normal;
|
||||
|
|
@ -86,7 +77,7 @@ a.collapse-menu-link {
|
|||
display: block;
|
||||
text-decoration: none;
|
||||
line-height: 42px;
|
||||
color: #fff;
|
||||
color: $sidebar-text;
|
||||
padding: 0;
|
||||
float: left;
|
||||
margin: 11px 0 0 25px;
|
||||
|
|
@ -119,7 +110,7 @@ a.collapse-menu-link {
|
|||
|
||||
.search {
|
||||
text-shadow: none;
|
||||
color: #fff;
|
||||
color: $sidebar-text;
|
||||
font-size: 13px;
|
||||
line-height: 25px;
|
||||
transition: all 0.5s ease;
|
||||
|
|
@ -164,7 +155,7 @@ a.collapse-menu-link {
|
|||
}
|
||||
|
||||
@media (max-width: $resXXS) {
|
||||
.user-profile {
|
||||
.user-profile{
|
||||
min-width: 136px;
|
||||
}
|
||||
a.refresh-data {
|
||||
|
|
@ -179,6 +170,7 @@ a.collapse-menu-link {
|
|||
}
|
||||
}
|
||||
|
||||
.profile-toggle-link {
|
||||
.profile-toggle-link{
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -11,7 +11,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;
|
||||
}
|
||||
|
|
@ -40,14 +40,28 @@ $angle-right: "\f101";
|
|||
&.selected:not(.with-sub-menu) {
|
||||
background-color: $primary;
|
||||
a.al-sidebar-list-link {
|
||||
color: $default;
|
||||
color: $sidebar-text;
|
||||
b {
|
||||
color: $default;
|
||||
color: $sidebar-text;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.al-sidebar-list-item, .ba-sidebar-sublist-item {
|
||||
&.ba-sidebar-item-expanded {
|
||||
> .al-sidebar-list-link {
|
||||
b {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
|
||||
> .al-sidebar-sublist {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
a.al-sidebar-list-link {
|
||||
display: block;
|
||||
height: 42px;
|
||||
|
|
@ -55,7 +69,7 @@ a.al-sidebar-list-link {
|
|||
text-shadow: none;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
color: #ffffff;
|
||||
color: $sidebar-text;
|
||||
line-height: 42px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
|
|
@ -84,7 +98,8 @@ a.al-sidebar-list-link {
|
|||
top: 12px;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
color: #cccccc;
|
||||
color: $sidebar-text;
|
||||
transition: transform 0.2s linear;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -123,7 +138,7 @@ a.al-sidebar-list-link {
|
|||
text-shadow: none;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
color: #ffffff;
|
||||
color: $sidebar-text;
|
||||
padding-left: 52px;
|
||||
height: auto;
|
||||
line-height: 29px;
|
||||
|
|
@ -135,7 +150,7 @@ a.al-sidebar-list-link {
|
|||
border: none;
|
||||
background-color: $primary;
|
||||
&:hover {
|
||||
color: $default;
|
||||
color: $sidebar-text;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -146,7 +161,7 @@ a.al-sidebar-list-link {
|
|||
@include default-sublist();
|
||||
}
|
||||
|
||||
.sidebar-hover-elem {
|
||||
.sidebar-hover-elem{
|
||||
width: 4px;
|
||||
background: $primary;
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -7,8 +7,6 @@ $hover: 24;
|
|||
.btn {
|
||||
border-radius: 5px;
|
||||
transition: all 0.1s ease;
|
||||
padding: 0.344rem 1rem;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
|
|
@ -39,46 +37,27 @@ $hover: 24;
|
|||
}
|
||||
}
|
||||
|
||||
@mixin openDropdownButton($color, $dark-color) {
|
||||
@include styleButton($color, $color - $hover);
|
||||
background-color: $dark-color;
|
||||
border-color: $dark-color;
|
||||
}
|
||||
|
||||
.open > .btn.dropdown-toggle {
|
||||
&.btn.btn-primary {
|
||||
@include styleButton($primary, $primary - $hover);
|
||||
background-color: $primary-dark;
|
||||
border-color: $primary-dark;
|
||||
}
|
||||
&.btn-default {
|
||||
@include styleButton(transparent, $default);
|
||||
&:focus, &:active:hover, &.active:hover, &:hover {
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
color: $default;
|
||||
}
|
||||
@include openDropdownButton($primary, $primary-dark)
|
||||
}
|
||||
&.btn-success {
|
||||
@include styleButton($success, $success - $hover);
|
||||
@include openDropdownButton($success, $success-dark)
|
||||
}
|
||||
&.btn-info {
|
||||
@include styleButton($info, $info - $hover);
|
||||
@include openDropdownButton($info, $info-dark)
|
||||
}
|
||||
&.btn-warning {
|
||||
@include styleButton($warning, $warning - $hover);
|
||||
@include openDropdownButton($warning, $warning-dark)
|
||||
}
|
||||
&.btn-danger {
|
||||
@include styleButton($danger, $danger - $hover);
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown button.btn.btn-default.dropdown-toggle {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.bootstrap-select {
|
||||
.dropdown-toggle:focus {
|
||||
outline: none !important;
|
||||
}
|
||||
button.btn-default:focus {
|
||||
color: $default;
|
||||
}
|
||||
.btn {
|
||||
transition: none;
|
||||
@include openDropdownButton($danger, $danger-dark)
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -91,10 +70,11 @@ button.btn.btn-primary {
|
|||
|
||||
button.btn.btn-default {
|
||||
border-width: 1px;
|
||||
@include buttonColor(transparent, $default);
|
||||
color: $default-text;
|
||||
@include buttonColor(transparent, $border);
|
||||
&:active, &:target {
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
color: $default;
|
||||
color: $default-text;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -126,12 +106,13 @@ button.btn.btn-danger {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
button.btn.btn-inverse {
|
||||
@include buttonColor($help-text, $help-text);
|
||||
color: $default;
|
||||
color: $label-text;
|
||||
&:active, &:target, &:hover {
|
||||
background-color: $help-text;
|
||||
color: $default;
|
||||
color: $label-text;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -158,9 +139,6 @@ button.btn.btn-inverse {
|
|||
button.btn.btn-primary {
|
||||
@include buttonGroupColor($primary);
|
||||
}
|
||||
button.btn.btn-default {
|
||||
@include buttonGroupColor($default);
|
||||
}
|
||||
button.btn.btn-danger {
|
||||
@include buttonGroupColor($danger);
|
||||
}
|
||||
|
|
@ -277,22 +255,23 @@ button.progress-button {
|
|||
font-size: 16px;
|
||||
}
|
||||
|
||||
.btn-group-xs>.btn, .btn-xs {
|
||||
padding: 1px 5px;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
.dropdown button.btn.btn-default.dropdown-toggle {
|
||||
color: $default-text;
|
||||
border: 1px solid $border;
|
||||
background-color: transparent;
|
||||
&:focus, &:active {
|
||||
background-color: $default;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-group-sm>.btn, .btn-sm {
|
||||
padding: 5px 10px;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.btn-group-lg>.btn, .btn-lg {
|
||||
padding: 10px 16px;
|
||||
font-size: 18px;
|
||||
line-height: 1.3333333;
|
||||
border-radius: 6px;
|
||||
.bootstrap-select {
|
||||
.dropdown-toggle:focus {
|
||||
outline: none !important;
|
||||
}
|
||||
button.btn-default:focus {
|
||||
color: $default;
|
||||
}
|
||||
.btn {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,14 +40,16 @@
|
|||
}
|
||||
|
||||
.form-control {
|
||||
border-radius: 0;
|
||||
background: transparent;
|
||||
color: $default-text;
|
||||
@include placeholderStyle($default-text, 0.7);
|
||||
border: 1px solid $input-border;
|
||||
border-radius: 5px;
|
||||
background-color: $input-background;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
&:focus {
|
||||
box-shadow: none;
|
||||
border-color: $primary-bg;
|
||||
background: #ffffff;
|
||||
background: $input-background;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -59,10 +61,6 @@ textarea.form-control {
|
|||
height: 96px;
|
||||
}
|
||||
|
||||
.modal-form-btn {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.form-inline {
|
||||
.form-group {
|
||||
input {
|
||||
|
|
@ -84,17 +82,6 @@ textarea.form-control {
|
|||
}
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
border-radius: 5px;
|
||||
border: none;
|
||||
color: $default-text;
|
||||
.modal-header {
|
||||
color: $default;
|
||||
border-top-left-radius: 5px;
|
||||
border-top-right-radius: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin setSwitchBorder($color) {
|
||||
.bootstrap-switch.bootstrap-switch-on {
|
||||
border-color: $color;
|
||||
|
|
@ -103,9 +90,6 @@ textarea.form-control {
|
|||
|
||||
.switch-container {
|
||||
display: inline-block;
|
||||
& {
|
||||
@include setSwitchBorder($default);
|
||||
}
|
||||
&.primary {
|
||||
@include setSwitchBorder($primary);
|
||||
}
|
||||
|
|
@ -131,12 +115,12 @@ textarea.form-control {
|
|||
outline: none;
|
||||
}
|
||||
&.bootstrap-switch-off {
|
||||
border-color: $input-border;
|
||||
border-color: $border;
|
||||
}
|
||||
&.bootstrap-switch-focused {
|
||||
box-shadow: none;
|
||||
&.bootstrap-switch-off {
|
||||
border-color: $input-border;
|
||||
border-color: $border;
|
||||
}
|
||||
}
|
||||
.bootstrap-switch-container {
|
||||
|
|
@ -239,10 +223,10 @@ label.custom-checkbox {
|
|||
font-family: fontAwesome;
|
||||
font-weight: $font-light;
|
||||
font-size: 12px;
|
||||
color: $default;
|
||||
color: $default-text;
|
||||
content: "\a0";
|
||||
background-color: transparent;
|
||||
border: 1px solid $default;
|
||||
border: 1px solid $border;
|
||||
border-radius: 0;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
|
|
@ -333,7 +317,7 @@ label.custom-input-danger {
|
|||
|
||||
@mixin validationState($color, $focusColor) {
|
||||
.control-label {
|
||||
color: $color;
|
||||
color: $default-text;
|
||||
}
|
||||
.form-control {
|
||||
border: 1px solid $color;
|
||||
|
|
@ -361,46 +345,25 @@ label.custom-input-danger {
|
|||
}
|
||||
.input-group-addon {
|
||||
background-color: $color;
|
||||
color: #ffffff;
|
||||
color: $label-text;
|
||||
}
|
||||
}
|
||||
|
||||
.form-control-feedback {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 2;
|
||||
display: block;
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
text-align: center;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.has-success {
|
||||
@include validationState($success-bg, $success);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.has-warning {
|
||||
@include validationState($warning-bg, $warning);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.has-error {
|
||||
@include validationState($danger-bg, $danger);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.has-feedback {
|
||||
.form-control {
|
||||
padding-right: 42.5px;
|
||||
}
|
||||
label ~ .form-control-feedback {
|
||||
top: 21px;
|
||||
font-size: 18px;
|
||||
}
|
||||
.has-feedback label ~ .form-control-feedback {
|
||||
top: 21px;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.bootstrap-select {
|
||||
|
|
@ -412,10 +375,10 @@ label.custom-input-danger {
|
|||
}
|
||||
|
||||
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
|
||||
background: transparent;
|
||||
background-color: $input-background;
|
||||
color: $disabled;
|
||||
border-color: $disabled-bg;
|
||||
@include placeholderStyle($disabled, 1);
|
||||
@include placeholderStyle($default-text, 0.5);
|
||||
}
|
||||
|
||||
.form-control-rounded {
|
||||
|
|
@ -435,7 +398,7 @@ label.custom-input-danger {
|
|||
|
||||
@mixin groupAddon($color) {
|
||||
background: $color;
|
||||
color: #ffffff;
|
||||
color: $label-text;
|
||||
border-color: $color;
|
||||
}
|
||||
|
||||
|
|
@ -463,68 +426,55 @@ label.custom-input-danger {
|
|||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.bootstrap-select {
|
||||
.btn-default {
|
||||
.bootstrap-select.btn-group {
|
||||
button.btn.btn-default {
|
||||
background: transparent;
|
||||
color: $default;
|
||||
&:focus {
|
||||
background: #ffffff;
|
||||
color: $default-text;
|
||||
&:hover {
|
||||
background: $default;
|
||||
box-shadow: none;
|
||||
outline: 0 !important;
|
||||
}
|
||||
&:active {
|
||||
border-color: $default;
|
||||
background: $default;
|
||||
box-shadow: none;
|
||||
background: #ffffff;
|
||||
}
|
||||
}
|
||||
&.open {
|
||||
.btn-default.dropdown-toggle {
|
||||
> .btn.btn-default.dropdown-toggle {
|
||||
background: $default;
|
||||
box-shadow: none;
|
||||
background-color: #ffffff;
|
||||
border-color: $default;
|
||||
color: $default;
|
||||
border-color: $border;
|
||||
}
|
||||
.dropdown-menu {
|
||||
border-left: 1px solid $default;
|
||||
border-right: 1px solid $default;
|
||||
border-bottom-color: $default;
|
||||
border-radius: 0 0 5px 5px;
|
||||
> .btn{
|
||||
border-radius: 5px 5px 0 0;
|
||||
}
|
||||
> .btn.dropdown-toggle {
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
border-color: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
.dropdown-menu {
|
||||
.dropdown-menu.open {
|
||||
border: 1px solid $border-light;
|
||||
border-top: none;
|
||||
}
|
||||
}
|
||||
&.with-search.open {
|
||||
.btn-default.btn {
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
border-color: 1px solid $default;
|
||||
border-radius: 0 0 5px 5px;
|
||||
}
|
||||
}
|
||||
&.with-search.open .btn-default + .dropdown-menu {
|
||||
.bs-searchbox .form-control {
|
||||
background-color: rgba(0, 0, 0, 0.35);
|
||||
background-color: $default;
|
||||
border: 1px solid $input-border;
|
||||
}
|
||||
.no-results {
|
||||
color: $default-text;
|
||||
color: $dropdown-text;
|
||||
}
|
||||
}
|
||||
.notify {
|
||||
color: $default-text;
|
||||
color: $dropdown-text;
|
||||
}
|
||||
}
|
||||
|
||||
.bootstrap-tagsinput {
|
||||
background-color: transparent;
|
||||
color: $default-text;
|
||||
background-color: $input-background;
|
||||
border: 1px solid $input-border;
|
||||
border-radius: 5px;
|
||||
box-shadow: none;
|
||||
color: #555555;
|
||||
max-width: 100%;
|
||||
font-size: 14px;
|
||||
line-height: 26px;
|
||||
|
|
@ -543,12 +493,20 @@ label.custom-input-danger {
|
|||
}
|
||||
}
|
||||
input {
|
||||
background-color: $input-background;
|
||||
border: 1px solid $input-border;
|
||||
border-radius: 5px;
|
||||
@include placeholderStyle($default-text, 0.8);
|
||||
line-height: 22px;
|
||||
font-size: 11px;
|
||||
min-width: 53px;
|
||||
}
|
||||
}
|
||||
|
||||
.progress {
|
||||
background: $progress-background;
|
||||
}
|
||||
|
||||
.progress-bar-primary {
|
||||
background-color: $primary;
|
||||
}
|
||||
|
|
@ -579,6 +537,19 @@ label.custom-input-danger {
|
|||
border-bottom-right-radius: 5px;
|
||||
}
|
||||
|
||||
.sub-little-text {
|
||||
.with-primary-addon:focus{
|
||||
border-color: $primary;
|
||||
}
|
||||
.with-warning-addon:focus{
|
||||
border-color: $warning;
|
||||
}
|
||||
.with-success-addon:focus{
|
||||
border-color: $success;
|
||||
}
|
||||
.with-danger-addon:focus{
|
||||
border-color: $danger;
|
||||
}
|
||||
|
||||
.sub-little-text{
|
||||
font-size: 12px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
$left-space: 180px;
|
||||
|
||||
@include scrollbars(.5em, #d9d9d9, rgba(0, 0, 0, 0));
|
||||
@include scrollbars(.5em, #d9d9d9, rgba(0,0,0,0));
|
||||
|
||||
html {
|
||||
position: relative;
|
||||
|
|
@ -14,16 +14,37 @@ html, body {
|
|||
|
||||
body {
|
||||
font: 14px/16px $font-family;
|
||||
color: white;
|
||||
@include main-background();
|
||||
color: $default-text;
|
||||
background-color: $body-bg;
|
||||
&.blur-theme {
|
||||
@include main-background();
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
|
||||
html {
|
||||
body.mobile{
|
||||
background: none;
|
||||
.body-bg{
|
||||
display: block;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background-attachment: inherit;
|
||||
background-color: $body-bg;
|
||||
}
|
||||
&.blur-theme {
|
||||
@include main-background();
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none)
|
||||
{
|
||||
html{
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
}
|
||||
body {
|
||||
body{
|
||||
overflow: auto;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -34,10 +55,9 @@ a {
|
|||
outline: 0 !important;
|
||||
}
|
||||
|
||||
.body-bg {
|
||||
.body-bg{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.al-header {
|
||||
display: block;
|
||||
height: 49px;
|
||||
|
|
@ -62,7 +82,7 @@ a {
|
|||
display: block;
|
||||
bottom: 0;
|
||||
font-size: 13px;
|
||||
color: #ffffff;
|
||||
color: $default-text;
|
||||
transition: padding-left 0.5s ease;
|
||||
}
|
||||
|
||||
|
|
@ -80,14 +100,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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -104,7 +124,7 @@ a {
|
|||
i {
|
||||
cursor: pointer;
|
||||
transition: all 0.1s ease;
|
||||
color: #ffffff;
|
||||
color: white;
|
||||
padding: 6px;
|
||||
box-sizing: content-box;
|
||||
font-size: 16px;
|
||||
|
|
@ -193,20 +213,12 @@ a {
|
|||
}
|
||||
|
||||
.full-invisible {
|
||||
visibility: hidden !important;
|
||||
visibility: hidden!important;
|
||||
* {
|
||||
visibility: hidden !important;
|
||||
visibility: hidden!important;
|
||||
}
|
||||
}
|
||||
|
||||
.text-right {
|
||||
text-align: right;
|
||||
.irs-grid-text {
|
||||
color: $default-text;
|
||||
}
|
||||
|
||||
.text-left {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
@ -3,7 +3,7 @@
|
|||
& > thead {
|
||||
& > tr {
|
||||
& > th {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-bottom: 1px solid $border-light;
|
||||
white-space: nowrap;
|
||||
&:first-child {
|
||||
text-align: center;
|
||||
|
|
@ -22,7 +22,7 @@
|
|||
& > td {
|
||||
padding: 0px 8px;
|
||||
line-height: 35px;
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-top: 1px solid $border-light;
|
||||
&:first-child {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
@ -32,12 +32,6 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
&.table-bordered {
|
||||
border-color: rgba(255, 255, 255, 0.2) !important;
|
||||
th, td {
|
||||
border-color: rgba(255, 255, 255, 0.2) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-id {
|
||||
|
|
@ -148,7 +142,7 @@ tr.editable-row {
|
|||
}
|
||||
|
||||
a.email-link {
|
||||
color: $default;
|
||||
color: $default-text;
|
||||
&:hover {
|
||||
color: $danger;
|
||||
}
|
||||
|
|
@ -209,65 +203,78 @@ input.search-input {
|
|||
margin-left: 0;
|
||||
}
|
||||
|
||||
body.badmin-transparent {
|
||||
.table {
|
||||
& > thead {
|
||||
& > tr {
|
||||
& > th {
|
||||
border-bottom: none;
|
||||
border-top: none;
|
||||
padding: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
& > tbody {
|
||||
& > tr.no-top-border {
|
||||
&:first-child > td {
|
||||
border-top: none;
|
||||
}
|
||||
.table {
|
||||
& > thead {
|
||||
& > tr {
|
||||
& > th {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.black-muted-bg {
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.table-hover {
|
||||
tr:hover {
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
& > tbody {
|
||||
& > tr.no-top-border {
|
||||
&:first-child > td {
|
||||
border-top: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-striped > tbody > tr:nth-of-type(odd) {
|
||||
.black-muted-bg {
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.table-hover {
|
||||
> tbody > tr:hover {
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.table > tbody > tr.primary > td {
|
||||
background-color: rgba($primary, 0.7);
|
||||
border: none;
|
||||
}
|
||||
.table > tbody > tr.success > td {
|
||||
background-color: rgba($success, 0.7);
|
||||
border: none;
|
||||
}
|
||||
.table > tbody > tr.warning > td {
|
||||
background-color: rgba($warning, 0.7);
|
||||
border: none;
|
||||
}
|
||||
.table > tbody > tr.danger > td {
|
||||
background-color: rgba($danger, 0.7);
|
||||
border: none;
|
||||
}
|
||||
.table > tbody > tr.info > td {
|
||||
background-color: rgba($info, 0.7);
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.editable-click, a.editable-click {
|
||||
color: $default;
|
||||
border-bottom: dashed 1px $default;
|
||||
.table-bordered,
|
||||
.table-bordered > thead > tr > th,
|
||||
.table-bordered > tbody > tr > th,
|
||||
.table-bordered > tfoot > tr > th,
|
||||
.table-bordered > thead > tr > td,
|
||||
.table-bordered > tbody > tr > td,
|
||||
.table-bordered > tfoot > tr > td{
|
||||
border: 1px solid $border-light;
|
||||
}
|
||||
|
||||
.table-striped > tbody > tr:nth-of-type(odd) {
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
@mixin color-row($color) {
|
||||
background-color: rgba($color, 0.7);
|
||||
color: $label-text;
|
||||
border: none;
|
||||
a.email-link {
|
||||
color: $label-text;
|
||||
&:hover {
|
||||
color: $danger;
|
||||
}
|
||||
}
|
||||
}
|
||||
.table > tbody > tr.primary > td {
|
||||
@include color-row($primary);
|
||||
}
|
||||
.table > tbody > tr.success > td {
|
||||
@include color-row($success);
|
||||
}
|
||||
.table > tbody > tr.warning > td {
|
||||
@include color-row($warning);
|
||||
}
|
||||
.table > tbody > tr.danger > td {
|
||||
@include color-row($danger);
|
||||
}
|
||||
.table > tbody > tr.info > td {
|
||||
@include color-row($info);
|
||||
}
|
||||
|
||||
.editable-click, a.editable-click {
|
||||
color: $default-text;
|
||||
border-bottom: dashed 1px $border;
|
||||
}
|
||||
|
||||
th {
|
||||
font-weight: $font-normal;
|
||||
|
|
@ -284,21 +291,21 @@ th {
|
|||
.table-striped > tbody > tr > td {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.pagination > li > a,
|
||||
.pagination > li > span {
|
||||
color: $default;
|
||||
border-color: $default;
|
||||
.pagination > li > span{
|
||||
color: $default-text;
|
||||
border-color: $border;
|
||||
}
|
||||
|
||||
|
||||
.pagination > li:first-of-type > a,
|
||||
.pagination > li:first-of-type > span {
|
||||
.pagination > li:first-of-type > span{
|
||||
border-top-left-radius: 5px;
|
||||
border-bottom-left-radius: 5px;
|
||||
}
|
||||
|
||||
.pagination > li:last-of-type > a,
|
||||
.pagination > li:last-of-type > span {
|
||||
.pagination > li:last-of-type > span{
|
||||
border-top-right-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
}
|
||||
|
|
@ -310,17 +317,21 @@ th {
|
|||
.pagination > .active > a:focus,
|
||||
.pagination > .active > span:focus {
|
||||
background-color: $primary;
|
||||
border-color: $default;
|
||||
border-color: $border;
|
||||
}
|
||||
|
||||
.pagination > li > a:hover,
|
||||
.pagination > li > span:hover,
|
||||
.pagination > li > a:focus,
|
||||
.pagination > li > span:focus {
|
||||
background-color: rgba(0, 0, 0, .2);
|
||||
color: $default;
|
||||
.pagination > li > span:focus{
|
||||
background-color: rgba(0,0,0,.2);
|
||||
color: $default-text;
|
||||
}
|
||||
|
||||
.editable-buttons .btn-with-icon i {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.table-responsive {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,6 +40,7 @@ h5 {
|
|||
|
||||
.typography-document-samples {
|
||||
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
|
|
@ -138,11 +139,11 @@ h5 {
|
|||
}
|
||||
|
||||
.yellow-text p {
|
||||
color: $warning-bg;
|
||||
color: $warning;
|
||||
}
|
||||
|
||||
.red-text p {
|
||||
color: $danger-bg;
|
||||
color: $danger;
|
||||
}
|
||||
|
||||
.links {
|
||||
|
|
@ -214,7 +215,7 @@ h5 {
|
|||
line-height: 14px;
|
||||
position: relative;
|
||||
span {
|
||||
color: $default;
|
||||
color: $default-text;
|
||||
display: block;
|
||||
}
|
||||
ol {
|
||||
|
|
@ -263,7 +264,7 @@ h5 {
|
|||
}
|
||||
|
||||
.columns-section {
|
||||
background-color: white;
|
||||
background-color: $default;
|
||||
}
|
||||
|
||||
p {
|
||||
|
|
@ -349,16 +350,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: $label-text;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
p {
|
||||
|
|
@ -430,6 +430,7 @@ a.learn-more {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width: 1620px) {
|
||||
.col-xlg-1 {
|
||||
width: 8.33333333%;
|
||||
|
|
|
|||
|
|
@ -2,16 +2,14 @@ $card-title-height: 44px;
|
|||
$card-header-font-size: 16px;
|
||||
|
||||
.card {
|
||||
border: none;
|
||||
background-color: $default;
|
||||
@include scrollbars(.4em, rgba(0, 0, 0, 0.6), rgba(255, 255, 255, 0.7));
|
||||
color: $default-text;
|
||||
background-color: $default;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
position: relative;
|
||||
//transition: all 0.2s ease;
|
||||
margin-bottom: 24px;
|
||||
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.25);
|
||||
/*&:hover {
|
||||
background: $card-bg-hover;
|
||||
}*/
|
||||
box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.25);
|
||||
&.animated {
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
|
|
@ -42,46 +40,46 @@ $card-header-font-size: 16px;
|
|||
}
|
||||
}
|
||||
|
||||
.card > .card-body {
|
||||
padding: 15px 22px;
|
||||
height: 100%;
|
||||
.card.card-blur {
|
||||
$blurredBgUrl: $images-root + 'blur-bg-blurred.jpg';
|
||||
background: url($blurredBgUrl);
|
||||
transition: none;
|
||||
background-attachment: fixed;
|
||||
}
|
||||
|
||||
.card {
|
||||
> .card-body {
|
||||
padding: 15px 22px;
|
||||
height: 100%;
|
||||
}
|
||||
> .card-header {
|
||||
color: $default-text;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
> .card-footer {
|
||||
color: $default-text;
|
||||
}
|
||||
}
|
||||
|
||||
.card-header, .card-footer {
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
|
||||
box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.12);
|
||||
height: $card-title-height;
|
||||
font-size: $card-header-font-size;
|
||||
|
||||
$vertical-padding: ($card-title-height - $card-header-font-size) / 2;
|
||||
padding: $vertical-padding 22px;
|
||||
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-weight: $font-normal;
|
||||
text-transform: uppercase;
|
||||
opacity: 0.9;
|
||||
font-size: $card-header-font-size;
|
||||
//text-transform: uppercase;
|
||||
}
|
||||
|
||||
.card-white, .card-blur {
|
||||
background-size: cover;
|
||||
> .card-header {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
color: $default-text;
|
||||
}
|
||||
}
|
||||
|
||||
.card-blur {
|
||||
$blurredBgUrl: $images-root + 'blur-bg-blurred.jpg';
|
||||
background: url($blurredBgUrl);
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.card-primary {
|
||||
> .card-header {
|
||||
color: $primary;
|
||||
background-color: $primary-bg;
|
||||
border-color: $primary-bg;
|
||||
}
|
||||
|
|
@ -89,7 +87,6 @@ $card-header-font-size: 16px;
|
|||
|
||||
.card-success {
|
||||
> .card-header {
|
||||
color: $success;
|
||||
background-color: $success-bg;
|
||||
border-color: $success-bg;
|
||||
}
|
||||
|
|
@ -97,7 +94,6 @@ $card-header-font-size: 16px;
|
|||
|
||||
.card-info {
|
||||
> .card-header {
|
||||
color: $info;
|
||||
background-color: $info-bg;
|
||||
border-color: $info-bg;
|
||||
}
|
||||
|
|
@ -105,7 +101,6 @@ $card-header-font-size: 16px;
|
|||
|
||||
.card-warning {
|
||||
> .card-header {
|
||||
color: $warning;
|
||||
background-color: $warning-bg;
|
||||
border-color: $warning-bg;
|
||||
}
|
||||
|
|
@ -113,27 +108,19 @@ $card-header-font-size: 16px;
|
|||
|
||||
.card-danger {
|
||||
> .card-header {
|
||||
color: $danger;
|
||||
background-color: $danger-bg;
|
||||
border-color: $danger-bg;
|
||||
}
|
||||
}
|
||||
|
||||
.card-primary, .card-success, .card-info, .card-warning, .card-danger {
|
||||
.card-header {
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
}
|
||||
//.bootstrap-card {
|
||||
// background-color: $bootstrap-card-bg;
|
||||
// .card-body{
|
||||
// color: $bootstrap-card-text;
|
||||
// }
|
||||
//}
|
||||
|
||||
.card.bootstrap-card {
|
||||
.card-body, .card-header {
|
||||
p, div, span {
|
||||
color: $default-text;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.accordion-card.card.bootstrap-card {
|
||||
.accordion-card.card {
|
||||
&.card-primary,
|
||||
&.card-success,
|
||||
&.card-info,
|
||||
|
|
@ -174,8 +161,3 @@ $card-header-font-size: 16px;
|
|||
.light-text {
|
||||
font-weight: $font-light;
|
||||
}
|
||||
|
||||
/*
|
||||
.card-group .card {
|
||||
border-radius: 0;
|
||||
}*/
|
||||
|
|
|
|||
|
|
@ -86,8 +86,6 @@
|
|||
border-top-left-radius: 0;
|
||||
border-bottom-right-radius: 5px;
|
||||
> li > a {
|
||||
margin-left: -1px;
|
||||
|
||||
&:hover, &:focus {
|
||||
}
|
||||
}
|
||||
|
|
@ -119,21 +117,21 @@
|
|||
.tab-content {
|
||||
padding: 15px 15px 5px 15px;
|
||||
background: transparent;
|
||||
color: $default;
|
||||
color: $default-text;
|
||||
.tab-pane p {
|
||||
color: $default;
|
||||
color: $default-text;
|
||||
}
|
||||
}
|
||||
|
||||
.nav.nav-tabs {
|
||||
border-top-left-radius: 5px;
|
||||
border-top-right-radius: 5px;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, .01);
|
||||
background-color: rgba(0, 0, 0, .2);
|
||||
border-bottom: 1px solid transparent;
|
||||
background-color: $primary-light;
|
||||
a {
|
||||
color: $default;
|
||||
color: $label-text;
|
||||
&:hover {
|
||||
color: $default;
|
||||
color: $label-text;
|
||||
}
|
||||
}
|
||||
& > li > a {
|
||||
|
|
@ -141,22 +139,42 @@
|
|||
margin-bottom: 0;
|
||||
border-radius: 0;
|
||||
border: none;
|
||||
color: $default;
|
||||
&:hover {
|
||||
border: none;
|
||||
color: $default;
|
||||
background-color: rgba(0, 0, 0, .1);
|
||||
background-color: $primary-light;
|
||||
}
|
||||
}
|
||||
& > li.active > a {
|
||||
color: $default;
|
||||
background-color: rgba(0, 0, 0, .25);
|
||||
color: $label-text;
|
||||
background-color: $primary;
|
||||
}
|
||||
> li:first-of-type a {
|
||||
border-top-left-radius: 5px;
|
||||
}
|
||||
.dropdown-menu > li > a {
|
||||
color: $default-text;
|
||||
color: $dropdown-text;
|
||||
&:hover {
|
||||
color: $dropdown-text;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.blur-theme {
|
||||
.nav.nav-tabs {
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
a {
|
||||
color: $default-text;
|
||||
&:hover {
|
||||
color: $default-text;
|
||||
}
|
||||
}
|
||||
& > li > a:hover {
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
& > li.active > a {
|
||||
color: $default-text;
|
||||
background-color: rgba(0, 0, 0, 0.25);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -168,26 +186,26 @@
|
|||
border: none;
|
||||
}
|
||||
|
||||
.card-primary, .card-info, .card-success, .card-warning, .card-danger {
|
||||
.card-header {
|
||||
border-radius: 4px;
|
||||
.accordion-panel {
|
||||
.panel-heading {
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
&.card-open .card-header {
|
||||
&.panel-open .panel-heading {
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
|
||||
&:not(.card-open) .card-header {
|
||||
&:not(.panel-open) .panel-heading {
|
||||
transition-delay: .3s;
|
||||
}
|
||||
|
||||
> .card-header + .card-collapse > .card-body {
|
||||
> .panel-heading + .panel-collapse > .panel-body {
|
||||
border-top: none;
|
||||
}
|
||||
}
|
||||
|
||||
.accordion-card .card-header {
|
||||
.accordion-panel .panel-heading {
|
||||
padding: 0;
|
||||
.accordion-toggle {
|
||||
display: inline-block;
|
||||
|
|
@ -195,4 +213,3 @@
|
|||
padding: 14px 22px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -41,7 +41,6 @@
|
|||
@mixin bg-nr($relativeUrl) {
|
||||
background: url($images-root + $relativeUrl) no-repeat 0 0;
|
||||
}
|
||||
|
||||
@mixin bg($relativeUrl) {
|
||||
background: url($images-root + $relativeUrl);
|
||||
}
|
||||
|
|
@ -94,37 +93,25 @@
|
|||
|
||||
@mixin overrideColors($color) {
|
||||
p,
|
||||
h1, h2, h3, h4, h5, h6,
|
||||
h1,h2,h3,h4,h5,h6,
|
||||
.pie-chart-item,
|
||||
.card-header > .dropdown .dropdown-toggle,
|
||||
.card-title,
|
||||
.panel-heading>.dropdown .dropdown-toggle,
|
||||
.panel-title,
|
||||
ol.blur span,
|
||||
ul.blur,
|
||||
.popular-app-cost,
|
||||
.popular-app-info,
|
||||
.card-title > .small,
|
||||
.card-title > .small > a,
|
||||
.card-title > a,
|
||||
.card-title > small,
|
||||
.card-title > small > a,
|
||||
.panel-title>.small,
|
||||
.panel-title>.small>a,
|
||||
.panel-title>a,
|
||||
.panel-title>small,
|
||||
.panel-title>small>a,
|
||||
.traffic-text span,
|
||||
.form-group label,
|
||||
.help-block {
|
||||
.help-block{
|
||||
color: $color;
|
||||
}
|
||||
.feed-message .message-time, .text-muted {
|
||||
color: darken($color, 20);
|
||||
}
|
||||
}
|
||||
|
||||
@mixin overrideCardBg($color, $borderColor, $dropdownColor) {
|
||||
.card.card-blur, .card.card-blur:hover {
|
||||
border: none;
|
||||
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.25);
|
||||
background-color: $color;
|
||||
}
|
||||
|
||||
.progress {
|
||||
background: $color;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,52 +1,39 @@
|
|||
body.badmin-transparent {
|
||||
&.mobile{
|
||||
background: none;
|
||||
.body-bg{
|
||||
display: block;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
@include main-background();
|
||||
background-attachment: inherit;
|
||||
}
|
||||
.panel-blur {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
@include overrideColors(#fff);
|
||||
@include overrideCardBg(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.9));
|
||||
.default-color {
|
||||
color: $default-text !important;;
|
||||
}
|
||||
.card.card-blur {
|
||||
background-attachment: fixed;
|
||||
@include scrollbars(.4em, rgba(0, 0, 0, 0.7), rgba(255, 255, 255, 0.8));
|
||||
border-radius: 5px;
|
||||
color: $default;
|
||||
.card-header {
|
||||
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);
|
||||
}
|
||||
.card-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);
|
||||
border-radius: 5px;
|
||||
color: $default;
|
||||
}
|
||||
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
|
||||
@include placeholderStyle($default, 0.5);
|
||||
}
|
||||
.irs-grid-text {
|
||||
color: $default;
|
||||
&.mobile{
|
||||
background: none;
|
||||
.body-bg{
|
||||
display: block;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
@include main-background();
|
||||
background-attachment: inherit;
|
||||
}
|
||||
}
|
||||
.panel.panel-blur {
|
||||
@include scrollbars(.4em, rgba(0, 0, 0, 0.7), rgba(255, 255, 255, 0.8));
|
||||
border-radius: 5px;
|
||||
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);
|
||||
}
|
||||
.panel-body {
|
||||
}
|
||||
}
|
||||
.btn-default {
|
||||
color: $default;
|
||||
}
|
||||
.form-control, .bootstrap-tagsinput input {
|
||||
@include placeholderStyle($default-text, 0.7);
|
||||
border: 1px solid $border;
|
||||
border-radius: 5px;
|
||||
color: $default-text;
|
||||
}
|
||||
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
|
||||
@include placeholderStyle($default-text, 0.5);
|
||||
}
|
||||
.irs-grid-text {
|
||||
color: $default-text;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -60,7 +60,7 @@ export const bgColorPalette = {
|
|||
surfieGreen: '#0e8174',
|
||||
silverTree: '#6eba8c',
|
||||
gossip: '#b9f2a1',
|
||||
white: '#ffffff',
|
||||
white: '#10c4b5',
|
||||
};
|
||||
|
||||
export const layoutColors = {
|
||||
|
|
@ -89,7 +89,8 @@ export const layoutColors = {
|
|||
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: 9.9 KiB |
Loading…
Add table
Add a link
Reference in a new issue