mirror of
https://github.com/akveo/ngx-admin.git
synced 2026-01-28 20:26:10 +01:00
feat(angular-cli): integrate angular-cli (#989)
This commit is contained in:
hryb
Alexander Zhukov
parent
7b8a6f4e88
commit
523f44b746
138 changed files with 4507 additions and 7170 deletions
|
|
@ -12,11 +12,10 @@ import 'ammap3/ammap/maps/js/worldLow';
|
|||
|
||||
import {BaAmChartThemeService} from './baAmChartTheme.service';
|
||||
|
||||
import 'style-loader!./baAmChart.scss';
|
||||
|
||||
@Component({
|
||||
selector: 'ba-am-chart',
|
||||
templateUrl: './baAmChart.html',
|
||||
styleUrls: ['./baAmChart.scss'],
|
||||
providers: [BaAmChartThemeService],
|
||||
})
|
||||
export class BaAmChart {
|
||||
|
|
|
|||
|
|
@ -8,7 +8,6 @@ import {
|
|||
} from '@angular/core';
|
||||
|
||||
import * as Chartist from 'chartist';
|
||||
import 'style-loader!./baChartistChart.scss';
|
||||
|
||||
@Component({
|
||||
selector: 'ba-chartist-chart',
|
||||
|
|
|
|||
|
|
@ -1 +0,0 @@
|
|||
@import "~chartist/dist/chartist";
|
||||
|
|
@ -1,12 +1,10 @@
|
|||
import {Component, ViewChild, Input, Output, ElementRef, EventEmitter} from '@angular/core';
|
||||
|
||||
import 'fullcalendar/dist/fullcalendar.js';
|
||||
|
||||
import 'style-loader!./baFullCalendar.scss';
|
||||
import * as jQuery from 'jquery';
|
||||
|
||||
@Component({
|
||||
selector: 'ba-full-calendar',
|
||||
templateUrl: './baFullCalendar.html',
|
||||
templateUrl: './baFullCalendar.html'
|
||||
})
|
||||
export class BaFullCalendar {
|
||||
|
||||
|
|
|
|||
|
|
@ -1 +0,0 @@
|
|||
@import "~fullcalendar/dist/fullcalendar";
|
||||
|
|
@ -5,11 +5,10 @@ import { Subscription } from 'rxjs/Rx';
|
|||
import { BaMenuService } from '../../services';
|
||||
import { GlobalState } from '../../../global.state';
|
||||
|
||||
import 'style-loader!./baMenu.scss';
|
||||
|
||||
@Component({
|
||||
selector: 'ba-menu',
|
||||
templateUrl: './baMenu.html'
|
||||
templateUrl: './baMenu.html',
|
||||
styleUrls: ['./baMenu.scss']
|
||||
})
|
||||
export class BaMenu {
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +1,9 @@
|
|||
import {Component, Input, Output, EventEmitter} from '@angular/core';
|
||||
|
||||
import 'style-loader!./baMenuItem.scss';
|
||||
|
||||
@Component({
|
||||
selector: 'ba-menu-item',
|
||||
templateUrl: './baMenuItem.html'
|
||||
templateUrl: './baMenuItem.html',
|
||||
styleUrls: ['./baMenuItem.scss']
|
||||
})
|
||||
export class BaMenuItem {
|
||||
|
||||
|
|
|
|||
|
|
@ -2,11 +2,10 @@ import {Component} from '@angular/core';
|
|||
|
||||
import {GlobalState} from '../../../global.state';
|
||||
|
||||
import 'style-loader!./baPageTop.scss';
|
||||
|
||||
@Component({
|
||||
selector: 'ba-page-top',
|
||||
templateUrl: './baPageTop.html',
|
||||
styleUrls: ['./baPageTop.scss']
|
||||
})
|
||||
export class BaPageTop {
|
||||
|
||||
|
|
|
|||
|
|
@ -1,200 +1,202 @@
|
|||
@import '../../sass/conf/conf';
|
||||
@import '../../components/baMsgCenter/baMsgCenter';
|
||||
|
||||
.page-top {
|
||||
background-color: $sidebar;
|
||||
position: fixed;
|
||||
z-index: 904;
|
||||
box-shadow: 2px 0 3px rgba(0, 0, 0, 0.5);
|
||||
height: 66px;
|
||||
width: 100%;
|
||||
min-width: $resMin;
|
||||
padding: 0 32px 0 40px;
|
||||
:host /deep/ {
|
||||
|
||||
.dropdown-toggle::after {
|
||||
display: none;
|
||||
.page-top {
|
||||
background-color: $sidebar;
|
||||
position: fixed;
|
||||
z-index: 904;
|
||||
box-shadow: 2px 0 3px rgba(0, 0, 0, 0.5);
|
||||
height: 66px;
|
||||
width: 100%;
|
||||
min-width: $resMin;
|
||||
padding: 0 32px 0 40px;
|
||||
|
||||
.dropdown-toggle::after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.blur {
|
||||
.page-top.scrolled {
|
||||
background-color: rgba(black, 0.85)
|
||||
.blur {
|
||||
.page-top.scrolled {
|
||||
background-color: rgba(black, 0.85)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
a.al-logo {
|
||||
color: $sidebar-text;
|
||||
display: block;
|
||||
font-size: 24px;
|
||||
font-family: $font-family;
|
||||
white-space: nowrap;
|
||||
float: left;
|
||||
outline: none !important;
|
||||
line-height: 60px;
|
||||
a.al-logo {
|
||||
color: $sidebar-text;
|
||||
display: block;
|
||||
font-size: 24px;
|
||||
font-family: $font-family;
|
||||
white-space: nowrap;
|
||||
float: left;
|
||||
outline: none !important;
|
||||
line-height: 60px;
|
||||
|
||||
span {
|
||||
span {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
a.al-logo:hover {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
a.al-logo:hover {
|
||||
color: $primary;
|
||||
}
|
||||
|
||||
.user-profile {
|
||||
float: right;
|
||||
min-width: 230px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.al-user-profile {
|
||||
float: right;
|
||||
margin-right: 12px;
|
||||
transition: all .15s ease-in-out;
|
||||
padding: 0;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border: 0;
|
||||
opacity: 1;
|
||||
position: relative;
|
||||
ul.profile-dropdown:after {
|
||||
bottom: 100%;
|
||||
right: 0;
|
||||
border: solid transparent;
|
||||
content: " ";
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
border-color: rgba(255, 255, 255, 0);
|
||||
border-bottom-color: #fff;
|
||||
border-width: 10px;
|
||||
margin-right: 28px;
|
||||
.user-profile {
|
||||
float: right;
|
||||
min-width: 230px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
a {
|
||||
display: block;
|
||||
}
|
||||
img {
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
a.refresh-data {
|
||||
color: $sidebar-text;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
font-weight: $font-normal;
|
||||
float: right;
|
||||
margin-top: 13px;
|
||||
margin-right: 26px;
|
||||
|
||||
&:hover {
|
||||
color: $warning !important;
|
||||
}
|
||||
}
|
||||
|
||||
a.collapse-menu-link {
|
||||
font-size: 31px;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
line-height: 42px;
|
||||
color: $sidebar-text;
|
||||
padding: 0;
|
||||
float: left;
|
||||
margin: 11px 0 0 25px;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
color: $warning;
|
||||
}
|
||||
}
|
||||
|
||||
.al-skin-dropdown {
|
||||
float: right;
|
||||
margin-top: 14px;
|
||||
margin-right: 26px;
|
||||
|
||||
.tpl-skin-panel {
|
||||
max-height: 300px;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-palette {
|
||||
display: inline-block;
|
||||
width: 14px;
|
||||
height: 13px;
|
||||
@include bg('theme/palette.png');
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.search {
|
||||
text-shadow: none;
|
||||
font-size: 13px;
|
||||
line-height: 25px;
|
||||
transition: all 0.5s ease;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
width: 162px;
|
||||
float: left;
|
||||
margin: 20px 0 0 30px;
|
||||
|
||||
label {
|
||||
cursor: pointer;
|
||||
}
|
||||
i {
|
||||
width: 16px;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
padding-left: 1px;
|
||||
font-size: 16px;
|
||||
margin-right: 13px;
|
||||
}
|
||||
input {
|
||||
color: $sidebar-text;
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
width: 120px;
|
||||
.al-user-profile {
|
||||
float: right;
|
||||
margin-right: 12px;
|
||||
transition: all .15s ease-in-out;
|
||||
padding: 0;
|
||||
margin: 0 0 0 -3px;
|
||||
height: 27px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border: 0;
|
||||
opacity: 1;
|
||||
position: relative;
|
||||
ul.profile-dropdown:after {
|
||||
bottom: 100%;
|
||||
right: 0;
|
||||
border: solid transparent;
|
||||
content: " ";
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
border-color: rgba(255, 255, 255, 0);
|
||||
border-bottom-color: #fff;
|
||||
border-width: 10px;
|
||||
margin-right: 28px;
|
||||
}
|
||||
a {
|
||||
display: block;
|
||||
}
|
||||
img {
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $resS) {
|
||||
.search {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $resXS) {
|
||||
.page-top {
|
||||
padding: 0 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: $resXXS) {
|
||||
.user-profile{
|
||||
min-width: 136px;
|
||||
}
|
||||
a.refresh-data {
|
||||
margin-right: 10px;
|
||||
color: $sidebar-text;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
font-weight: $font-normal;
|
||||
float: right;
|
||||
margin-top: 13px;
|
||||
margin-right: 26px;
|
||||
|
||||
&:hover {
|
||||
color: $warning !important;
|
||||
}
|
||||
}
|
||||
|
||||
a.collapse-menu-link {
|
||||
margin-left: 10px;
|
||||
font-size: 31px;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
line-height: 42px;
|
||||
color: $sidebar-text;
|
||||
padding: 0;
|
||||
float: left;
|
||||
margin: 11px 0 0 25px;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
color: $warning;
|
||||
}
|
||||
}
|
||||
|
||||
.al-skin-dropdown {
|
||||
display: none;
|
||||
float: right;
|
||||
margin-top: 14px;
|
||||
margin-right: 26px;
|
||||
|
||||
.tpl-skin-panel {
|
||||
max-height: 300px;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-palette {
|
||||
display: inline-block;
|
||||
width: 14px;
|
||||
height: 13px;
|
||||
@include bg('theme/palette.png');
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.search {
|
||||
text-shadow: none;
|
||||
font-size: 13px;
|
||||
line-height: 25px;
|
||||
transition: all 0.5s ease;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
width: 162px;
|
||||
float: left;
|
||||
margin: 20px 0 0 30px;
|
||||
|
||||
label {
|
||||
cursor: pointer;
|
||||
}
|
||||
i {
|
||||
width: 16px;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
padding-left: 1px;
|
||||
font-size: 16px;
|
||||
margin-right: 13px;
|
||||
}
|
||||
input {
|
||||
color: $sidebar-text;
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
width: 120px;
|
||||
padding: 0;
|
||||
margin: 0 0 0 -3px;
|
||||
height: 27px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $resS) {
|
||||
.search {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $resXS) {
|
||||
.page-top {
|
||||
padding: 0 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: $resXXS) {
|
||||
.user-profile {
|
||||
min-width: 136px;
|
||||
}
|
||||
a.refresh-data {
|
||||
margin-right: 10px;
|
||||
}
|
||||
a.collapse-menu-link {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.al-skin-dropdown {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.profile-toggle-link {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.profile-toggle-link{
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -2,11 +2,10 @@ import {Component, ElementRef, HostListener} from '@angular/core';
|
|||
import {GlobalState} from '../../../global.state';
|
||||
import {layoutSizes} from '../../../theme';
|
||||
|
||||
import 'style-loader!./baSidebar.scss';
|
||||
|
||||
@Component({
|
||||
selector: 'ba-sidebar',
|
||||
templateUrl: './baSidebar.html'
|
||||
templateUrl: './baSidebar.html',
|
||||
styleUrls: ['./baSidebar.scss']
|
||||
})
|
||||
export class BaSidebar {
|
||||
public menuHeight:number;
|
||||
|
|
|
|||
|
|
@ -4,300 +4,303 @@ $sidebar-scroll-width: 4px;
|
|||
$angle-left: "\f100";
|
||||
$angle-right: "\f101";
|
||||
|
||||
.al-sidebar {
|
||||
width: $sidebar-width;
|
||||
top: $top-height;
|
||||
left: 0;
|
||||
z-index: 1001;
|
||||
display: block;
|
||||
min-height: 100%;
|
||||
background-color: $sidebar;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
}
|
||||
:host /deep/{
|
||||
|
||||
.al-sidebar-list {
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
padding: 18px 0 0 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.al-sidebar-sublist .subitem-submenu-list {
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.subitem-submenu-link {
|
||||
.fa {
|
||||
top: 7px;
|
||||
}
|
||||
}
|
||||
|
||||
.al-sidebar-list-item {
|
||||
display: block;
|
||||
position: relative;
|
||||
float: none;
|
||||
padding: 0;
|
||||
&.selected:not(.with-sub-menu) {
|
||||
background-color: $primary;
|
||||
a.al-sidebar-list-link {
|
||||
color: $sidebar-text;
|
||||
b {
|
||||
color: $sidebar-text;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ba-sidebar-item-expanded {
|
||||
> ul.al-sidebar-sublist {
|
||||
display: block!important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.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;
|
||||
padding-left: 18px;
|
||||
text-shadow: none;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
color: $sidebar-text;
|
||||
line-height: 42px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
color: $primary;
|
||||
b {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
i {
|
||||
margin-right: 18px;
|
||||
width: 16px;
|
||||
display: inline-block;
|
||||
}
|
||||
b {
|
||||
.al-sidebar {
|
||||
width: $sidebar-width;
|
||||
top: $top-height;
|
||||
left: 0;
|
||||
z-index: 1001;
|
||||
display: block;
|
||||
opacity: 1;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
line-height: 14px;
|
||||
text-shadow: none;
|
||||
font-size: 18px;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 12px;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
color: $sidebar-text;
|
||||
transition: transform 0.2s linear;
|
||||
}
|
||||
}
|
||||
|
||||
.slimScrollBar, .slimScrollRail {
|
||||
border-radius: 0px !important;
|
||||
width: $sidebar-scroll-width !important;
|
||||
left: $sidebar-width - $sidebar-scroll-width;
|
||||
}
|
||||
|
||||
@mixin layout-collapsed() {
|
||||
.al-main {
|
||||
margin-left: 50px;
|
||||
min-height: 100%;
|
||||
background-color: $sidebar;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
.al-footer {
|
||||
padding-left: 83px
|
||||
.al-sidebar-list {
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
padding: 18px 0 0 0;
|
||||
list-style: none;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin default-sublist() {
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
position: relative;
|
||||
display: none;
|
||||
&.expanded {
|
||||
display: block;
|
||||
}
|
||||
> ba-menu-item > li {
|
||||
.al-sidebar-sublist .subitem-submenu-list {
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.subitem-submenu-link {
|
||||
.fa {
|
||||
top: 7px;
|
||||
}
|
||||
}
|
||||
|
||||
.al-sidebar-list-item {
|
||||
display: block;
|
||||
position: relative;
|
||||
float: none;
|
||||
padding: 0;
|
||||
border-bottom: none;
|
||||
position: relative;
|
||||
a {
|
||||
display: block;
|
||||
text-shadow: none;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
color: $sidebar-text;
|
||||
padding-left: 52px;
|
||||
height: auto;
|
||||
line-height: 29px;
|
||||
&:hover {
|
||||
&.selected:not(.with-sub-menu) {
|
||||
background-color: $primary;
|
||||
a.al-sidebar-list-link {
|
||||
color: $sidebar-text;
|
||||
b {
|
||||
color: $sidebar-text;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ba-sidebar-item-expanded {
|
||||
> ul.al-sidebar-sublist {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.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;
|
||||
padding-left: 18px;
|
||||
text-shadow: none;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
color: $sidebar-text;
|
||||
line-height: 42px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
color: $primary;
|
||||
b {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
&.selected:not(.with-sub-menu) > a {
|
||||
border: none;
|
||||
background-color: $primary;
|
||||
&:hover {
|
||||
color: $sidebar-text;
|
||||
}
|
||||
i {
|
||||
margin-right: 18px;
|
||||
width: 16px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.al-sidebar-sublist {
|
||||
@include default-sublist();
|
||||
}
|
||||
|
||||
.sidebar-hover-elem{
|
||||
width: $sidebar-scroll-width;
|
||||
background: $primary;
|
||||
position: absolute;
|
||||
top: -150px;
|
||||
left: $sidebar-width - $sidebar-scroll-width;
|
||||
transition: all 0.5s ease;
|
||||
transition-property: top, height;
|
||||
height: 42px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.sidebar-select-elem {
|
||||
display: block;
|
||||
top: 94px;
|
||||
}
|
||||
|
||||
@mixin sidebar-collapsed() {
|
||||
.al-sidebar {
|
||||
width: 52px;
|
||||
|
||||
.fa-angle-down, .fa-angle-up {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.al-sidebar-sublist {
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
left: 52px;
|
||||
@include bg-translucent-dark(0.8);
|
||||
width: 0;
|
||||
b {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
transition: width 0.5s ease;
|
||||
&.slide-right {
|
||||
width: 135px;
|
||||
opacity: 1;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
line-height: 14px;
|
||||
text-shadow: none;
|
||||
font-size: 18px;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 12px;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
color: $sidebar-text;
|
||||
transition: transform 0.2s linear;
|
||||
}
|
||||
}
|
||||
|
||||
.slimScrollBar, .slimScrollRail {
|
||||
border-radius: 0px !important;
|
||||
width: $sidebar-scroll-width !important;
|
||||
left: $sidebar-width - $sidebar-scroll-width;
|
||||
}
|
||||
|
||||
@mixin layout-collapsed() {
|
||||
.al-main {
|
||||
margin-left: 50px;
|
||||
}
|
||||
|
||||
.al-footer {
|
||||
padding-left: 83px
|
||||
}
|
||||
}
|
||||
|
||||
@mixin default-sublist() {
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
position: relative;
|
||||
display: none;
|
||||
&.expanded {
|
||||
display: block;
|
||||
}
|
||||
> ba-menu-item > li {
|
||||
display: block;
|
||||
float: none;
|
||||
padding: 0;
|
||||
border-bottom: none;
|
||||
position: relative;
|
||||
a {
|
||||
display: block;
|
||||
text-shadow: none;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
color: $sidebar-text;
|
||||
padding-left: 52px;
|
||||
height: auto;
|
||||
line-height: 29px;
|
||||
&:hover {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
&:before {
|
||||
display: none;
|
||||
&.selected:not(.with-sub-menu) > a {
|
||||
border: none;
|
||||
background-color: $primary;
|
||||
&:hover {
|
||||
color: $sidebar-text;
|
||||
}
|
||||
}
|
||||
li {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.al-sidebar-sublist {
|
||||
@include default-sublist();
|
||||
}
|
||||
|
||||
.sidebar-hover-elem {
|
||||
width: $sidebar-scroll-width;
|
||||
background: $primary;
|
||||
position: absolute;
|
||||
top: -150px;
|
||||
left: $sidebar-width - $sidebar-scroll-width;
|
||||
transition: all 0.5s ease;
|
||||
transition-property: top, height;
|
||||
height: 42px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.sidebar-select-elem {
|
||||
display: block;
|
||||
top: 94px;
|
||||
}
|
||||
|
||||
@mixin sidebar-collapsed() {
|
||||
.al-sidebar {
|
||||
width: 52px;
|
||||
|
||||
.fa-angle-down, .fa-angle-up {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.al-sidebar-sublist {
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
left: 52px;
|
||||
@include bg-translucent-dark(0.8);
|
||||
width: 0;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
transition: width 0.5s ease;
|
||||
&.slide-right {
|
||||
width: 135px;
|
||||
}
|
||||
&:before {
|
||||
display: none;
|
||||
}
|
||||
a {
|
||||
padding-left: 18px;
|
||||
padding-right: 18px;
|
||||
min-width: 130px;
|
||||
white-space: nowrap;
|
||||
li {
|
||||
&:before {
|
||||
display: none;
|
||||
}
|
||||
a {
|
||||
padding-left: 18px;
|
||||
padding-right: 18px;
|
||||
min-width: 130px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-hover-elem, .sidebar-select-elem {
|
||||
left: 48px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin sidebar-hidden() {
|
||||
.al-sidebar {
|
||||
width: 0;
|
||||
}
|
||||
.sidebar-hover-elem, .sidebar-select-elem {
|
||||
left: 48px;
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin sidebar-hidden() {
|
||||
.al-sidebar {
|
||||
width: 0;
|
||||
}
|
||||
.sidebar-hover-elem, .sidebar-select-elem {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@mixin sidebar-overlap() {
|
||||
.al-sidebar {
|
||||
width: $sidebar-width;
|
||||
@include bg-translucent-dark(0.75);
|
||||
transition: width 0.5s ease;
|
||||
|
||||
@mixin sidebar-overlap() {
|
||||
.al-sidebar {
|
||||
width: $sidebar-width;
|
||||
@include bg-translucent-dark(0.75);
|
||||
transition: width 0.5s ease;
|
||||
.fa-angle-down, .fa-angle-up {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.fa-angle-down, .fa-angle-up {
|
||||
opacity: 1;
|
||||
}
|
||||
.al-sidebar-sublist {
|
||||
@include default-sublist();
|
||||
top: auto;
|
||||
left: auto;
|
||||
background: none;
|
||||
width: auto;
|
||||
overflow: visible;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.al-sidebar-sublist {
|
||||
@include default-sublist();
|
||||
top: auto;
|
||||
left: auto;
|
||||
background: none;
|
||||
width: auto;
|
||||
overflow: visible;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.sidebar-hover-elem, .sidebar-select-elem {
|
||||
left: $sidebar-width - 4;
|
||||
transition: left 0.5s ease;
|
||||
.sidebar-hover-elem, .sidebar-select-elem {
|
||||
left: $sidebar-width - 4;
|
||||
transition: left 0.5s ease;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.menu-collapsed {
|
||||
.slimScrollBar, .slimScrollRail {
|
||||
display: none!important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.menu-collapsed {
|
||||
.slimScrollBar, .slimScrollRail {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.menu-collapsed {
|
||||
@include layout-collapsed();
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $resXS + 1) {
|
||||
.menu-collapsed {
|
||||
@include sidebar-collapsed();
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) and (min-width: $resXS) {
|
||||
@include layout-collapsed();
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: $resXS + 1) {
|
||||
.menu-collapsed {
|
||||
@include sidebar-collapsed();
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) and (min-width: $resXS) {
|
||||
@include layout-collapsed();
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
@include sidebar-overlap();
|
||||
}
|
||||
|
||||
@media (max-width: $resXS) {
|
||||
.menu-collapsed {
|
||||
@include sidebar-hidden();
|
||||
}
|
||||
.al-main {
|
||||
margin-left: 0;
|
||||
}
|
||||
.al-footer {
|
||||
padding-left: 0;
|
||||
@media (max-width: 1200px) {
|
||||
@include sidebar-overlap();
|
||||
}
|
||||
|
||||
@media (max-width: $resXS) {
|
||||
.menu-collapsed {
|
||||
@include sidebar-hidden();
|
||||
}
|
||||
.al-main {
|
||||
margin-left: 0;
|
||||
}
|
||||
.al-footer {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
|
||||
@mixin svg-icon-class($iconName, $width:'', $height:'') {
|
||||
.#{'i-' + $iconName} {
|
||||
@include svg-icon($images-root + $iconName + '.svg', $width, $height);
|
||||
@include svg-icon('/assets/img/' + $iconName + '.svg', $width, $height);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -160,11 +160,12 @@ a {
|
|||
}
|
||||
|
||||
.icon-up {
|
||||
@include bg-nr('arrow-green-up.svg');
|
||||
//@include bg-nr('arrow-green-up.svg');
|
||||
background: url('/assets/img/arrow-green-up.svg') no-repeat 0 0;
|
||||
}
|
||||
|
||||
.icon-down {
|
||||
@include bg-nr('arrow-red-down.svg');
|
||||
background: url('/assets/img/arrow-red-down.svg') no-repeat 0 0;
|
||||
}
|
||||
|
||||
.disable-text-selection {
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
@font-face {
|
||||
font-family: 'socicon';
|
||||
src: url('#{$fonts-root}socicon.eot');
|
||||
src: url('#{$fonts-root}socicon.eot?#iefix') format('embedded-opentype'),
|
||||
url('#{$fonts-root}socicon.woff') format('woff'),
|
||||
url('#{$fonts-root}socicon.woff2') format('woff2'),
|
||||
url('#{$fonts-root}socicon.ttf') format('truetype'),
|
||||
url('#{$fonts-root}socicon.svg#sociconregular') format('svg');
|
||||
src: url('/assets#{$fonts-root}socicon.eot');
|
||||
src: url('/assets#{$fonts-root}socicon.eot?#iefix') format('embedded-opentype'),
|
||||
url('/assets#{$fonts-root}socicon.woff') format('woff'),
|
||||
url('/assets#{$fonts-root}socicon.woff2') format('woff2'),
|
||||
url('/assets#{$fonts-root}socicon.ttf') format('truetype'),
|
||||
url('/assets#{$fonts-root}socicon.svg#sociconregular') format('svg');
|
||||
font-weight: $font-normal;
|
||||
font-style: normal;
|
||||
text-transform: initial;
|
||||
|
|
@ -67,4 +67,4 @@
|
|||
|
||||
.socicon-behace {
|
||||
@include socicon($behace-color, "H");
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ $card-title-height: 44px;
|
|||
$card-header-font-size: 16px;
|
||||
|
||||
.card.card-blur {
|
||||
$blurredBgUrl: $images-root + 'blur-bg-blurred.jpg';
|
||||
$blurredBgUrl: '/img/blur-bg-blurred.jpg';
|
||||
background: url($blurredBgUrl);
|
||||
transition: none;
|
||||
background-attachment: fixed;
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@
|
|||
}
|
||||
|
||||
@mixin bg-image($relativeUrl) {
|
||||
background-image: url($images-root + $relativeUrl);
|
||||
background-image: url($assets-root + $images-root + $relativeUrl);
|
||||
}
|
||||
|
||||
@mixin bg-translucent-dark($opacity) {
|
||||
|
|
|
|||
|
|
@ -21,9 +21,9 @@ $large-card-height: 974px;
|
|||
$default-animation-duration: 0.2s;
|
||||
$default-animation-style: ease-out;
|
||||
|
||||
$assets-root: 'assets/';
|
||||
$images-root: $assets-root + 'img/';
|
||||
$fonts-root: $assets-root + 'fonts/';
|
||||
$assets-root: '/assets';
|
||||
$images-root: '/img/';
|
||||
$fonts-root: '/fonts/';
|
||||
$font-thin: 100;
|
||||
$font-light: 300;
|
||||
$font-normal: 400;
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@ $hoverlink: darken($activelink, 20%);
|
|||
@mixin body-bg() {
|
||||
background-color: $body-bg;
|
||||
|
||||
$mainBgUrl: $images-root + 'sky-bg.jpg';
|
||||
$mainBgUrl: $assets-root + $images-root + 'sky-bg.jpg';
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue