benjamin/wgenerator
1
0
Fork 0
Code Releases Activity

changing styles

Browse Source
This commit is contained in:
smuddyx
2020-04-19 19:15:57 +02:00
committed by smuddy
parent cdd0bfec0c
commit 4f1a12bd00
5 changed files with 25 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/modules/presentation/remote/remote.component.less
View File

@@ -1,7 +1,7 @@
@import "../../../../styles/shadow"; @import "../../../../styles/shadow";
.song { .song {
background: #fffa; background: #fffe;
width: 100%; width: 100%;
padding: 10px; padding: 10px;
border-radius: 8px; border-radius: 8px;

16
src/app/widget-modules/components/application-frame/navigation/link/link.component.less
View File

@@ -1,16 +1,17 @@
@import "../../../../../../styles/styles"; @import "../../../../../../styles/styles";
a { a {
opacity: 0.8;
display: block; display: block;
height: 60px; height: 50px;
color: @navigation-link-color; font-size: 16px;
font-size: 20px;
font-weight: bold; font-weight: bold;
text-decoration: none; text-decoration: none;
padding: 20px; padding: 15px;
box-sizing: border-box; box-sizing: border-box;
background: transparent; background: transparent;
transition: @transition; transition: @transition;
border-color: #222;
fa-icon { fa-icon {
display: inline-block; display: inline-block;
@@ -25,7 +26,8 @@ a {
} }
&:hover { &:hover {
background: #eee; opacity: 0.9;
border-bottom: 5px solid #555;
fa-icon { fa-icon {
transform: scale(1.2); transform: scale(1.2);
@@ -33,8 +35,8 @@ a {
} }
&.active { &.active {
background: @primary-color; border-bottom: 5px solid @primary-color;
color: #fff; opacity: 1;
fa-icon { fa-icon {
transform: scale(1.3); transform: scale(1.3);

5
src/app/widget-modules/components/application-frame/navigation/navigation.component.less
View File

@@ -7,8 +7,9 @@ nav {
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
height: 60px; height: 50px;
background: @navigation-background; background: #222;
color: #fff;
z-index: 1; z-index: 1;
.card-3; .card-3;
transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;

2
src/app/widget-modules/components/card/card.component.less
View File

@@ -7,7 +7,7 @@
background: #fffb; background: #fffb;
overflow: hidden; overflow: hidden;
width: 800px; width: 800px;
transition: 300ms all ease-in-out;
@media screen and (max-width: 860px) { @media screen and (max-width: 860px) {
width: 100vw; width: 100vw;
border-radius: 0px; border-radius: 0px;

16
src/styles/styles.less
View File

@@ -1,7 +1,6 @@
@primary-color: #4286f4; @primary-color: #4286f4;
@navigation-background: #fffffff1; @navigation-background: #fffffff1;
@navigation-link-color: #555;
@transition: all 300ms ease-in-out; @transition: all 300ms ease-in-out;
@@ -18,8 +17,8 @@ body {
font-size: 14px; font-size: 14px;
background: #373b44; /* fallback for old browsers */ background: #373b44; /* fallback for old browsers */
background: -webkit-linear-gradient(to top, #373b44, #4286f4); /* Chrome 10-25, Safari 5.1-6 */ background: -webkit-linear-gradient(to bottom, #373b44, @primary-color); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to top, #373b44, #4286f4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ background: linear-gradient(to bottom, #373b44, @primary-color); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
background-attachment: fixed; background-attachment: fixed;
} }
@@ -28,11 +27,15 @@ p {
} }
h1, h2, h3, h4 { h1, h2, h3, h4 {
color: @navigation-link-color; opacity: 0.5;
padding: 0; padding: 0;
margin: 0 0 20px 0; margin: 0 0 20px 0;
} }
a {
color: inherit;
}
.mat-form-field { .mat-form-field {
width: 100%; width: 100%;
} }
@@ -47,11 +50,14 @@ h1, h2, h3, h4 {
.content > *:not(router-outlet) { .content > *:not(router-outlet) {
margin-top: 60px;
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
.content {
padding-top: 50px;
}
.btn-icon { .btn-icon {
opacity: 0.2; opacity: 0.2;
transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;