artus/mystic_forest
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

tries more variables

Browse Source
This commit is contained in:
Arthur Gerbaud
2019-06-26 14:24:19 +02:00
parent 52b1760b27
commit 930566f3fb
1 changed files with 49 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
mystic_forest/custom_portal.css
View File

@@ -5,13 +5,16 @@
=============================================================================== ===============================================================================
*/ */
/* Defines theme variables */
:root { :root {
--background-color: #141709; --background-color: #141709;
--primary-color: #525c2e; --primary-color: #525c2e;
--primary-hover-color: #708a00; --primary-hover-color: #708a00;
--logo-width: 412px;
--logo-height: 175px;
--box-width: 21em;
} }
.ynh-user-portal { .ynh-user-portal {
background: var(--background-color); background: var(--background-color);
display: flex; display: flex;
@@ -20,10 +23,23 @@
align-items: center; align-items: center;
} }
.content { .classic-btn {
padding: 0%; background: var(--primary-color);
width: 21em;
} }
.classic-btn:hover {
background: var(--primary-hover-color);
}
.messages {
margin: 0;
/*width: 100%; */
}
.messages.info {
background: var(--primary-color);
}
/* Styling specific to portal view */
.logged .content { .logged .content {
display: flex; display: flex;
@@ -35,8 +51,8 @@
.user { .user {
background: url("./forest.png"); background: url("./forest.png");
background-repeat: no-repeat; background-repeat: no-repeat;
padding-top: 175px; padding-top: var(--logo-height);
width: 412px; width: var(--logo-width);
flex: 0 1 auto; flex: 0 1 auto;
display: flex; display: flex;
flex-flow: column-reverse nowrap; flex-flow: column-reverse nowrap;
@@ -44,52 +60,57 @@
margin-left: 4%; margin-left: 4%;
} }
.user-menu, .user-container { .user-menu,
.user-container {
background-color: var(--primary-color); background-color: var(--primary-color);
max-width: 21em; width: var(--box-width);
margin-left: 38px; margin-left: calc((var(--logo-width) - 21em) / 2);
} }
.apps { .apps {
width: 50%; width: 50%; /* Hack to force footer to wrap on another row */
flex: 1 1 auto; flex: 1 1 auto;
margin: 4%; margin: 4%;
} }
.footer { flex: 1 1 auto; margin: 4%; } .footer {
flex: 1 1 auto;
margin: 4%;
}
/* Styling specific to the login view */
:not(.logged) .content {
padding: 0%;
width: 21em;
}
/* Select only non-logged in view */
:not(.logged) > .ynh-logo{ :not(.logged) > .ynh-logo{
background-image: url("./forest.png"); background-image: url("./forest.png");
width: 412px; width: var(--logo-width);
height: 175px; height: var(--logo-height);
opacity: 1; opacity: 1;
flex: 0 0 auto; flex: 0 0 auto;
margin-top: 0; margin-top: 0;
} }
.ynh-wrapper.login { margin: 0; width: 100%;} .ynh-wrapper.login {
margin: 0;
width: 100%;
}
.login-form .form-group { .login-form .form-group {
margin: 0; margin: 0;
border: 0.4em solid var(--primary-color); border: 0.4em solid var(--primary-color);
border-top: none; border-top: none;
} }
.login-form .btn { margin-top: 0.4em; }
.classic-btn { background: var(--primary-color); } .login-form .btn {
.classic-btn:hover { background: var(--primary-hover-color); } margin-top: 0.4em;
.messages {
margin: 0;
/*width: 100%; */
} }
.messages.info { /* End of custom theme
background: var(--primary-color); Tiles colors are copied from default theme */
}
/* Tiles colors are copied from default theme */
.bluebg { .bluebg {
background: #3498DB!important; background: #3498DB!important;