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

refactor(styles): huge styles refactoring

Browse source
This commit is contained in:
nixa 2017-05-06 20:32:00 +03:00
parent f04763cecd
commit e5f3f211f9
17 changed files with 34 additions and 196 deletions
Download patch file Download diff file Expand all files Collapse all files

0
src/app/@theme/styles/cosmic/_variables.scss Normal file
View file

8
src/app/@theme/styles/pure/pure.theme.scss → src/app/@theme/styles/cosmic/cosmic.theme.scss
View file

@ -3,13 +3,13 @@
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
@import 'variables';
@import '../components';
@import 'variables';
@import '~@nga/theme/styles/themes/nga.theme.cosmic';
@import 'overrides/all';
@import '~@nga/theme/styles/themes/nga.theme.default';
$theme-name: 'pure';
$theme-name: 'cosmic';
// @nga/theme module styles
@include nga-theme($theme-name) {

19
src/app/@theme/styles/gorgeous/overrides/_nga-layout.scss → src/app/@theme/styles/cosmic/overrides/_nga-layout.scss
View file

@ -1,20 +1,9 @@
@mixin nga-layout-override($theme-name) {
$layout-shadow: 0 8px 20px 0 rgba(37, 26, 75, 0.68);
@mixin nga-layout-override($theme-name) {;
// TODO: refactor this
/deep/ .layout {
a {
@include hover-focus-active {
color: $nga-color-secondary !important;
text-decoration: none;
}
}
nga-layout-header > nav {
box-shadow: $layout-shadow;
i:hover {
color: $nga-color-secondary;
}
.left {
color: $nga-color-inverse;
@ -42,19 +31,17 @@
background: transparent;
.scrollable {
box-shadow: $layout-shadow;
//box-shadow: $layout-shadow;
margin-top: $nga-layout-padding;
border-top-right-radius: $nga-radius;
}
}
nga-layout-footer > nav {
$footer-text: #7d85b2;
$footer-link: $nga-color-secondary;
border: none !important;
padding: 1.25rem;
box-shadow: $layout-shadow;
.created-by {
color: #7d85b2;

14
src/app/@theme/styles/cosmic/overrides/_nga-menu.scss Normal file
View file

@ -0,0 +1,14 @@
@mixin nga-menu-override($theme-name) {
/deep/ nga-menu {
> ul > li:first-child {
a {
background-image: linear-gradient(to right, #664dd9, #9d52f2) !important;
box-shadow: 0 0 12px 0 rgba(128, 51, 255, 0.35) !important;
margin: 1rem;
border-radius: $nga-radius;
height: 3.5rem;
color: $nga-color-inverse;
}
}
}
}

0
src/app/@theme/styles/gorgeous/overrides/all.scss → src/app/@theme/styles/cosmic/overrides/all.scss
View file

21
src/app/@theme/styles/gorgeous/_variables.scss
View file

@ -1,21 +0,0 @@
$nga-color-default: #2f2e66;
$nga-color-secondary: #a1a1e6;
$nga-color-inverse: white;
$nga-foreground: $nga-color-inverse;
$nga-background: #20274f;
$nga-foreground-inverse: $nga-color-secondary;
$nga-layout-padding: 2.5rem;
$nga-header-height: 4.725rem;
$nga-header-padding: 1.25rem;
$nga-footer-height: $nga-header-height;
$nga-sidebar-width: 16.25rem;
$nga-sidebar-width-compact: 3.45rem;
$nga-sidebar-padding: 0;
$nga-card-background: $nga-color-default;

46
src/app/@theme/styles/gorgeous/overrides/_nga-menu.scss
View file

@ -1,46 +0,0 @@
@mixin nga-menu-override($theme-name) {
/deep/ nga-menu {
ul li {
&:first-child {
a {
background-image: linear-gradient(to right, #664dd9, #9d52f2) !important;
box-shadow: 0 0 12px 0 rgba(128, 51, 255, 0.35) !important;
margin: 1rem;
border-radius: $nga-radius;
height: 3.5rem;
color: $nga-color-inverse;
}
}
a,
& > span.menu-group {
display: flex;
align-items: center;
transition: all 0.2s ease;
padding: 0.375rem 0 0.375rem 1rem;
color: $nga-color-secondary;
&.active {
background: $nga-background;
font-weight: bold;
}
i {
font-size: 2rem;
margin-right: 1.25rem;
&:first-child {
display: flex;
justify-content: center;
}
}
}
& > span.menu-group {
color: $nga-color-inverse;
font-size: 1rem;
}
}
}
}

7
src/app/@theme/styles/gorgeous/gorgeous.theme.scss → src/app/@theme/styles/light/light.theme.scss
View file

@ -4,12 +4,11 @@
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
@import '../components';
@import 'variables';
@import '~@nga/theme/styles/themes/nga.theme.default';
@import 'overrides/all';
$theme-name: 'gorgeous';
@import '~@nga/theme/styles/themes/nga.theme.light';
$theme-name: 'light';
// @nga/theme module styles
@include nga-theme($theme-name) {

2
src/app/@theme/styles/light/overrides/all.scss Normal file
View file

@ -0,0 +1,2 @@
@mixin nga-theme-overrides($theme-name) {
}

17
src/app/@theme/styles/pure/_variables.scss
View file

@ -1,17 +0,0 @@
$nga-color-default: white;
$nga-color-secondary: #b5bbd5;
$nga-color-inverse: #7d85b2;
$nga-foreground: $nga-color-inverse;
$nga-background: #edf1f7;
$nga-header-height: 4.725rem;
$nga-header-padding: 1.25rem;
$nga-footer-height: $nga-header-height;
$nga-sidebar-width: 16.25rem;
$nga-sidebar-width-compact: 3.45rem;
$nga-sidebar-padding: 0;
$nga-user-picture-background: $nga-background;

27
src/app/@theme/styles/pure/overrides/_nga-layout.scss
View file

@ -1,27 +0,0 @@
@mixin nga-layout-override($theme-name) {
$layout-border-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08);
/deep/ .layout {
a, i {
@include hover-focus-active {
color: $nga-color-secondary !important;
text-decoration: none;
}
}
nga-layout-header > nav {
box-shadow: $layout-border-shadow;
}
nga-sidebar {
z-index: 1;
box-shadow: $layout-border-shadow;
}
nga-layout-footer > nav {
box-shadow: $layout-border-shadow;
border: none !important;
padding: 1.25rem;
}
}
}

39
src/app/@theme/styles/pure/overrides/_nga-menu.scss
View file

@ -1,39 +0,0 @@
@mixin nga-menu-override($theme-name) {
/deep/ nga-menu {
ul li {
transition: all 0.2s ease;
&:first-child {
margin-top: 3rem;
}
a, & > span.menu-group {
display: flex;
align-items: center;
padding: 0.375rem 0 0.375rem 1rem;
color: $nga-color-inverse;
&.active {
color: $nga-color-inverse !important;
background: $nga-background;
font-weight: bold;
}
i {
font-size: 2rem;
margin-right: 1.25rem;
&:first-child {
display: flex;
justify-content: center;
}
}
}
& > span.menu-group {
opacity: 0.8;
font-size: 1rem;
}
}
}
}

7
src/app/@theme/styles/pure/overrides/all.scss
View file

@ -1,7 +0,0 @@
@import 'nga-layout';
@import 'nga-menu';
@mixin nga-theme-overrides($theme-name) {
@include nga-layout-override($theme-name);
@include nga-menu-override($theme-name);
}