klmp200/Sith
1
0
Fork 0
mirror of https://github.com/ae-utbm/sith.git synced 2024-11-26 02:54:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

core: still some design improvements

Browse Source 
Signed-off-by: Skia <skia@libskia.so>
This commit is contained in:
Skia 2017-09-02 20:59:45 +02:00
parent 6d09a9e9b0
commit f5abfc3c12
2 changed files with 130 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

112
core/static/core/style.scss
View File

@ -68,8 +68,9 @@ a {
#header_language_chooser { #header_language_chooser {
position: absolute; position: absolute;
top: 1em; top: 0.2em;
width: 5%; right: 0.5em;
width: 3%;
text-align: center; text-align: center;
input { input {
display: block; display: block;
@ -79,18 +80,25 @@ a {
} }
form { form {
display: block; display: block;
margin: 0.2em 0em;
width: 100%;
} }
} }
header { header {
width: 90%; width: 90%;
margin: 0 auto; margin: 0px auto;
display: flex; display: flex;
box-shadow: black 1px 1px 5px;
border: solid 1px $black-color;
border-top: none;
background-color: $primary-neutral-dark-color;
#header_logo { #header_logo {
display: inline-block; display: inline-block;
flex: none; flex: none;
background-size: 100% 100%; background-size: 100% 100%;
background-color: $white-color;
padding: 0.2em; padding: 0.2em;
a { a {
display: inline-block; display: inline-block;
@ -102,6 +110,7 @@ header {
#header_connect_links { #header_connect_links {
margin: 0.6em 0.6em 0em auto; margin: 0.6em 0.6em 0em auto;
color: $white-color;
form { form {
display: inline; display: inline;
width: 100%; width: 100%;
@ -115,11 +124,19 @@ header {
} }
#header_bar { #header_bar {
background-color: $secondary-light-color;
display: flex; display: flex;
flex: auto; flex: auto;
width: 80%; width: 80%;
a {
text-decoration: none;
margin: 0em 1em;
color: $white-color;
&:hover {
color: $secondary-color;
}
}
#header_bars_infos { #header_bars_infos {
width: 35ch; width: 35ch;
flex: initial; flex: initial;
@ -146,14 +163,6 @@ header {
flex: auto; flex: auto;
} }
} }
a {
text-decoration: none;
margin: 0em 1em;
color: $black-color;
&:hover {
color: $secondary-color;
}
}
.white { .white {
background: $white-color; background: $white-color;
} }
@ -224,22 +233,26 @@ header {
min-width: 10%; min-width: 10%;
max-width: 46%; max-width: 46%;
min-height: 20px; min-height: 20px;
box-shadow: black 1px 1px 5px;
&:before { &:before {
float: left; float: left;
margin: 0.2em; margin: 0.2em;
margin-right: 0.5em; margin-right: 0.5em;
} }
.markdown {
margin-top: 0.5em;
}
} }
#info_box { #info_box {
border: solid 1px $primary-neutral-light-color; border: solid 1px $black-color;
background: $white-color; background: $white-color;
&:before { &:before {
content: url('img/info.png'); content: url('img/info.png');
} }
} }
#alert_box { #alert_box {
border: solid 1px grey; border: solid 1px $black-color;
background: gold; background: $second-color;
&:before { &:before {
content: url('img/warning.png'); content: url('img/warning.png');
} }
@ -247,35 +260,35 @@ header {
} }
/*---------------------------------NAV---------------------------------*/ #page {
box-shadow: black 1px 1px 5px;
nav {
display: block;
width: 90%; width: 90%;
margin: 1em auto 0em auto; margin: 0em auto;
background: $primary-color; border: solid 1px $black-color;
/*---------------------------------NAV---------------------------------*/
nav {
display: flex;
flex-wrap: wrap;
background-color: $primary-dark-color;
color: $white-color; color: $white-color;
a { a {
flex: auto;
text-align: center;
padding: 20px;
color: $white-color; color: $white-color;
font-style: normal; font-style: normal;
font-weight: bolder; font-weight: bolder;
text-decoration: none; text-decoration: none;
display: inline-block;
padding: 20px;
&:hover { &:hover {
background: $primary-dark-color; background: $secondary-neutral-color;
color: $white-color; color: $white-color;
} }
} }
} }
/*--------------------------------CONTENT------------------------------*/ /*--------------------------------CONTENT------------------------------*/
#quick_notif {
.helptext {
display: block;
}
#quick_notif {
width: 90%; width: 90%;
margin: 0px auto; margin: 0px auto;
list-style-type: none; list-style-type: none;
@ -283,14 +296,19 @@ nav {
li { li {
padding: 10px; padding: 10px;
} }
} }
#content {
width: 88%; #content {
margin: 0px auto;
padding: 1em 1%; padding: 1em 1%;
background: $white-color; background: $white-color;
overflow: auto; overflow: auto;
}
}
.helptext {
display: block;
} }
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
@ -763,13 +781,27 @@ textarea {
/*--------------------------------FOOTER-------------------------------*/ /*--------------------------------FOOTER-------------------------------*/
footer { footer {
width: 90%;
margin: 2em auto;
font-size: 80%;
text-align: center; text-align: center;
vertical-align: middle;
div { div {
margin-top: 25px; margin: 0.6em 0em;
margin-bottom: 15px; color: $white-color;
} display: flex;
background-color: $primary-neutral-dark-color;
box-shadow: black 1px 1px 5px;
border: solid 1px $black-color;
a { a {
margin: 1px 20px; padding: 0.8em;
flex: 1;
color: $white-color;
&:hover {
color: $secondary-color;
}
}
} }
} }
@ -847,7 +879,7 @@ label {
line-height: 120%; line-height: 120%;
} }
a { a {
color: $primary-light-color; color: $primary-dark-color;
} }
a:hover { a:hover {
text-decoration: underline; text-decoration: underline;

2
core/templates/core/base.jinja
View File

@ -138,6 +138,7 @@
{% endblock %} {% endblock %}
<!-- END HEADER --> <!-- END HEADER -->
<div id="page">
{% block nav %} {% block nav %}
{% if not popup %} {% if not popup %}
<nav> <nav>
@ -183,6 +184,7 @@
{% block content %} {% block content %}
{% endblock %} {% endblock %}
</div> </div>
</div>
{% if not popup %} {% if not popup %}
<footer> <footer>