diff --git a/src/app/@theme/search-input/_search-input.component.theme.scss b/src/app/@theme/search-input/_search-input.component.theme.scss
index fd796020..d318f07b 100644
--- a/src/app/@theme/search-input/_search-input.component.theme.scss
+++ b/src/app/@theme/search-input/_search-input.component.theme.scss
@@ -1,4 +1,7 @@
@mixin search-input-theme() {
/deep/ search-input {
+ input {
+ background: transparent;
+ }
}
}
\ No newline at end of file
diff --git a/src/app/@theme/styles/gorgeous/_gorgeous.variables.scss b/src/app/@theme/styles/gorgeous/_gorgeous.variables.scss
index e69de29b..16802604 100644
--- a/src/app/@theme/styles/gorgeous/_gorgeous.variables.scss
+++ b/src/app/@theme/styles/gorgeous/_gorgeous.variables.scss
@@ -0,0 +1,21 @@
+$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;
\ No newline at end of file
diff --git a/src/app/@theme/styles/gorgeous/gorgeous.theme.scss b/src/app/@theme/styles/gorgeous/gorgeous.theme.scss
index ed9b6fb1..6244d60c 100644
--- a/src/app/@theme/styles/gorgeous/gorgeous.theme.scss
+++ b/src/app/@theme/styles/gorgeous/gorgeous.theme.scss
@@ -1,7 +1,116 @@
-@import '~@nga/theme/styles/themes/nga.theme.default';
@import '../components';
@import 'gorgeous.variables';
+@import '~@nga/theme/styles/themes/nga.theme.default';
@include nga-theme('gorgeous') {
+ $layout-shadow: 0 8px 20px 0 rgba(37, 26, 75, 0.68);
+
+ * {
+ transition: all 0.1s;
+ }
+
+ 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;
+
+ a {
+ color: $nga-color-inverse !important;
+
+ &:hover {
+ color: $nga-color-secondary !important;
+ }
+ }
+ }
+
+ .right i {
+ color: #7d85b2;
+
+ &:hover {
+ color: $nga-color-secondary;
+ }
+ }
+ }
+
+ nga-sidebar {
+ z-index: 1;
+ background: transparent;
+
+ .scrollable {
+ box-shadow: $layout-shadow;
+ margin-top: $nga-layout-padding;
+ border-top-right-radius: $nga-radius;
+ }
+
+ 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;
+ }
+ }
+
+ a {
+ display: flex;
+ align-items: center;
+
+ transition: all 0.2s ease;
+ 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;
+ }
+ }
+ }
+ }
+ }
+
+ 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;
+
+ a {
+ color: #7d85b2 !important;
+
+ &:hover {
+ color: $nga-color-secondary !important;
+ }
+ }
+ }
+ }
@include custom-components-theme();
}
\ No newline at end of file
diff --git a/src/app/@theme/styles/pure/pure.theme.scss b/src/app/@theme/styles/pure/pure.theme.scss
index a37db5ce..b6f39bd4 100644
--- a/src/app/@theme/styles/pure/pure.theme.scss
+++ b/src/app/@theme/styles/pure/pure.theme.scss
@@ -4,6 +4,12 @@
@import '~@nga/theme/styles/themes/nga.theme.default';
@include nga-theme('pure') {
+ $layout-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08);
+
+ * {
+ transition: all 0.1s;
+ }
+
a, i {
@include hover-focus-active {
color: $nga-color-secondary !important;
@@ -12,12 +18,12 @@
}
nga-layout-header > nav {
- box-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08);
+ box-shadow: $layout-shadow;
}
nga-sidebar {
z-index: 1;
- box-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08);
+ box-shadow: $layout-shadow;
ul li {
&:first-child {
@@ -52,7 +58,7 @@
}
nga-layout-footer > nav {
- box-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08);
+ box-shadow: $layout-shadow;
border: none !important;
padding: 1.25rem;
}
diff --git a/src/app/@theme/styles/styles.scss b/src/app/@theme/styles/styles.scss
deleted file mode 100644
index 306fe91b..00000000
--- a/src/app/@theme/styles/styles.scss
+++ /dev/null
@@ -1,2 +0,0 @@
-@import 'pure/pure.theme';
-@import 'gorgeous/gorgeous.theme';
\ No newline at end of file
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
deleted file mode 100644
index 67e21d3b..00000000
--- a/src/app/app.component.scss
+++ /dev/null
@@ -1 +0,0 @@
-@import '@theme/styles/styles';
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index afcc210a..9b07c0fd 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -8,7 +8,6 @@ import { Component } from '@angular/core';
@Component({
selector: 'app',
template: '
',
- styleUrls: ['./app.component.scss'],
})
export class AppComponent {
}
diff --git a/src/app/pages/dashboard/dashboard.component.ts b/src/app/pages/dashboard/dashboard.component.ts
index 81e1bc1c..36125144 100644
--- a/src/app/pages/dashboard/dashboard.component.ts
+++ b/src/app/pages/dashboard/dashboard.component.ts
@@ -3,9 +3,91 @@ import { Component } from '@angular/core';
@Component({
selector: 'dashboard',
template: `
-
- dashboard works!
-
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
+
+ Test card
+ Some Body
+ Super Footer
+
`,
})
export class DashboardComponent {
diff --git a/src/app/pages/pages.component.ts b/src/app/pages/pages.component.ts
index 5f3c6453..f5058253 100644
--- a/src/app/pages/pages.component.ts
+++ b/src/app/pages/pages.component.ts
@@ -2,6 +2,10 @@ import { Component } from '@angular/core';
@Component({
selector: 'pages',
+ styleUrls: [
+ '../@theme/styles/gorgeous/gorgeous.theme.scss',
+ '../@theme/styles/pure/pure.theme.scss',
+ ],
template: `
diff --git a/src/app/pages/pages.module.ts b/src/app/pages/pages.module.ts
index 20232fc4..4bb79b35 100644
--- a/src/app/pages/pages.module.ts
+++ b/src/app/pages/pages.module.ts
@@ -14,7 +14,7 @@ import { ComponentsComponent } from './components/components.component';
@NgModule({
imports: [
- NgaThemeModule.forRoot({ name: 'pure' }),
+ NgaThemeModule.forRoot({ name: 'gorgeous' }),
NgaSidebarModule.forRoot(),
NgaMenuModule.forRoot({ items: menuItems }),
PagesRoutingModule,