Andreas/ngx-admin
1
0
Fork 0
mirror of https://github.com/akveo/ngx-admin.git synced 2026-03-05 13:20:16 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

styles refactoring as per 1.x theme update

Browse source
This commit is contained in:
nixa 2016-05-16 16:30:56 +03:00
parent 6c8e632164
commit 06d0dc1c99
23 changed files with 590 additions and 705 deletions
Download patch file Download diff file Expand all files Collapse all files

86
src/app/theme/sass/bootstrap-overrides/_card.scss
View file

@ -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;
}*/

61
src/app/theme/sass/bootstrap-overrides/_tabs.scss
View file

@ -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;
}
}