magnus/Notes
1
0
Fork 0
Code Issues 4 Pull requests Projects Releases 4 Packages Wiki Activity

Fixed login screen.

Browse source
This commit is contained in:
Magnus Åhall 2023-07-18 07:09:03 +02:00
parent 2cd17871b5
commit cc9c1ca82e
7 changed files with 154 additions and 80 deletions
Download patch file Download diff file Expand all files Collapse all files

46
static/css/login.css
View file

@ -1,33 +1,53 @@
/*
@theme_gradient: linear-gradient(to right, #009fff, #ec2f4b);
@theme_gradient: linear-gradient(to right, #f5af19, #f12711);
@theme_gradient: linear-gradient(to right, #fdc830, #f37335);
@theme_gradient: linear-gradient(to right, #8a2387, #e94057, #f27121);
@theme_gradient: linear-gradient(to right, #659999, #f4791f);
*/
#login {
height: 100%;
background: #eee;
}
#login .header {
background: linear-gradient(to right, #3e5151, #decba4);
width: 100%;
padding: 16px;
text-align: center;
color: #fff;
}
#login .header h1 {
margin-bottom: 0px;
}
#login .fields {
display: grid;
justify-items: center;
height: 100%;
padding: 32px;
}
#login input {
max-width: 300px;
#login .fields input {
margin-bottom: 32px;
width: 100%;
border: 0px;
border-bottom: 1px solid #444;
font-size: 18pt;
border: 1px solid #444;
padding: 8px;
width: 100%;
font-size: 1.25em;
background-color: #fff;
}
#login input:focus {
#login .fields input:focus {
outline: none;
}
#login button {
max-width: 300px;
#login .fields button {
border: 1px solid #666;
background: #fff;
color: #444;
padding: 16px 32px;
font-size: 1em;
padding: 12px 24px;
font-size: 1.25em;
align-self: center;
}
#login button:hover {
#login .fields button:hover {
background: #ddd;
}
#login .auth-failed {
#login .fields .auth-failed {
margin-top: 32px;
color: #a00;
background: #fff;

42
static/css/main.css
View file

@ -1,3 +1,10 @@
/*
@theme_gradient: linear-gradient(to right, #009fff, #ec2f4b);
@theme_gradient: linear-gradient(to right, #f5af19, #f12711);
@theme_gradient: linear-gradient(to right, #fdc830, #f37335);
@theme_gradient: linear-gradient(to right, #8a2387, #e94057, #f27121);
@theme_gradient: linear-gradient(to right, #659999, #f4791f);
*/
html {
box-sizing: border-box;
}
@ -134,11 +141,6 @@ header {
align-items: center;
padding: 8px 0px;
color: #333c11;
background: linear-gradient(to right, #009fff, #ec2f4b);
background: linear-gradient(to right, #f5af19, #f12711);
background: linear-gradient(to right, #fdc830, #f37335);
background: linear-gradient(to right, #8a2387, #e94057, #f27121);
background: linear-gradient(to right, #659999, #f4791f);
background: linear-gradient(to right, #3e5151, #decba4);
color: #fff;
}
@ -512,7 +514,13 @@ header .menu {
.layout-keys #keys {
display: block;
}
#app {
#app.login {
padding-top: 64px;
display: grid;
grid-template-columns: minmax(min-content, 300px);
justify-content: center;
}
#app.node {
display: grid;
grid-template-areas: "header header" "tree crumbs" "tree child-nodes" "tree name" "tree content" "tree files" "tree blank";
grid-template-columns: min-content 1fr;
@ -521,26 +529,26 @@ header .menu {
color: #fff;
height: 100%;
}
#app.toggle-tree {
#app.node.toggle-tree {
grid-template-areas: "header" "crumbs" "child-nodes" "name" "content" "files" "blank";
grid-template-columns: 1fr;
grid-template-rows: min-content /* header */ min-content /* crumbs */ min-content /* child-nodes */ min-content /* name */ min-content /* content */ min-content /* files */ 1fr;
/* blank */
}
#app.toggle-tree #tree {
#app.node.toggle-tree #tree {
display: none;
}
@media only screen and (max-width: 932px) {
#app {
#app.node {
grid-template-areas: "header" "crumbs" "child-nodes" "name" "content" "files" "blank";
grid-template-columns: 1fr;
grid-template-rows: min-content /* header */ min-content /* crumbs */ min-content /* child-nodes */ min-content /* name */ min-content /* content */ min-content /* files */ 1fr;
/* blank */
}
#app #tree {
#app.node #tree {
display: none;
}
#app.toggle-tree {
#app.node.toggle-tree {
display: grid;
grid-template-areas: "header" "tree";
grid-template-columns: 1fr;
@ -549,22 +557,22 @@ header .menu {
color: #fff;
height: 100%;
}
#app.toggle-tree #crumbs {
#app.node.toggle-tree #crumbs {
display: none;
}
#app.toggle-tree .child-nodes {
#app.node.toggle-tree .child-nodes {
display: none;
}
#app.toggle-tree .node-name {
#app.node.toggle-tree .node-name {
display: none;
}
#app.toggle-tree .grow-wrap {
#app.node.toggle-tree .grow-wrap {
display: none;
}
#app.toggle-tree #file-section {
#app.node.toggle-tree #file-section {
display: none;
}
#app.toggle-tree #tree {
#app.node.toggle-tree #tree {
display: block;
}
.node-content {

7
static/css/theme.css
View file

@ -0,0 +1,7 @@
/*
@theme_gradient: linear-gradient(to right, #009fff, #ec2f4b);
@theme_gradient: linear-gradient(to right, #f5af19, #f12711);
@theme_gradient: linear-gradient(to right, #fdc830, #f37335);
@theme_gradient: linear-gradient(to right, #8a2387, #e94057, #f27121);
@theme_gradient: linear-gradient(to right, #659999, #f4791f);
*/