klmp200/Sith
1
0
Fork 0
mirror of https://github.com/ae-utbm/sith.git synced 2024-11-29 20:44:24 +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

142
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,52 +260,57 @@ 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;
color: $white-color;
a { /*---------------------------------NAV---------------------------------*/
nav {
display: flex;
flex-wrap: wrap;
background-color: $primary-dark-color;
color: $white-color; color: $white-color;
font-style: normal; a {
font-weight: bolder; flex: auto;
text-decoration: none; text-align: center;
display: inline-block; padding: 20px;
padding: 20px;
&:hover {
background: $primary-dark-color;
color: $white-color; color: $white-color;
font-style: normal;
font-weight: bolder;
text-decoration: none;
&:hover {
background: $secondary-neutral-color;
color: $white-color;
}
} }
} }
}
/*--------------------------------CONTENT------------------------------*/ /*--------------------------------CONTENT------------------------------*/
#quick_notif {
width: 90%;
margin: 0px auto;
list-style-type: none;
background: $second-color;
li {
padding: 10px;
}
}
#content {
padding: 1em 1%;
background: $white-color;
overflow: auto;
}
}
.helptext { .helptext {
display: block; display: block;
} }
#quick_notif {
width: 90%;
margin: 0px auto;
list-style-type: none;
background: $second-color;
li {
padding: 10px;
}
}
#content {
width: 88%;
margin: 0px auto;
padding: 1em 1%;
background: $white-color;
overflow: auto;
}
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
font-weight: bold; font-weight: bold;
margin-top: 0.5em; margin-top: 0.5em;
@ -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;
a { background-color: $primary-neutral-dark-color;
margin: 1px 20px; box-shadow: black 1px 1px 5px;
border: solid 1px $black-color;
a {
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;

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

@ -138,50 +138,52 @@
{% endblock %} {% endblock %}
<!-- END HEADER --> <!-- END HEADER -->
{% block nav %} <div id="page">
{% if not popup %} {% block nav %}
<nav> {% if not popup %}
<a href="https://ae2.utbm.fr/">{% trans %}Main{% endtrans %}</a> <nav>
<a href="{{ url('matmat:search_clear') }}">{% trans %}Matmatronch{% endtrans %}</a> <a href="https://ae2.utbm.fr/">{% trans %}Main{% endtrans %}</a>
<a href="{{ url('core:page', page_name="Index") }}">{% trans %}Wiki{% endtrans %}</a> <a href="{{ url('matmat:search_clear') }}">{% trans %}Matmatronch{% endtrans %}</a>
<a href="{{ url('sas:main') }}">{% trans %}SAS{% endtrans %}</a> <a href="{{ url('core:page', page_name="Index") }}">{% trans %}Wiki{% endtrans %}</a>
<a href="{{ url('forum:main') }}">{% trans %}Forum{% endtrans %}</a> <a href="{{ url('sas:main') }}">{% trans %}SAS{% endtrans %}</a>
<a href="{{ url('core:page', "services") }}">{% trans %}Services{% endtrans %}</a> <a href="{{ url('forum:main') }}">{% trans %}Forum{% endtrans %}</a>
<a href="{{ url('core:file_list') }}">{% trans %}Files{% endtrans %}</a> <a href="{{ url('core:page', "services") }}">{% trans %}Services{% endtrans %}</a>
<a href="{{ url('core:page', page_name="partenaires")}}">{% trans %}Sponsors{% endtrans %}</a> <a href="{{ url('core:file_list') }}">{% trans %}Files{% endtrans %}</a>
<a href="https://ae2.utbm.fr/article.php?name=docs:index">{% trans %}Help{% endtrans %}</a> <a href="{{ url('core:page', page_name="partenaires")}}">{% trans %}Sponsors{% endtrans %}</a>
</nav> <a href="https://ae2.utbm.fr/article.php?name=docs:index">{% trans %}Help{% endtrans %}</a>
{% endif %} </nav>
{% endblock %} {% endif %}
{% endblock %}
<ul id="quick_notif"> <ul id="quick_notif">
{% for n in quick_notifs %} {% for n in quick_notifs %}
<li>{{ n }}</li> <li>{{ n }}</li>
{% endfor %} {% endfor %}
</ul> </ul>
<div id="content"> <div id="content">
{% if list_of_tabs %} {% if list_of_tabs %}
<div class="tool-bar"> <div class="tool-bar">
<div>{{ tabs_title }}</div> <div>{{ tabs_title }}</div>
<div class="tools"> <div class="tools">
{% for t in list_of_tabs %} {% for t in list_of_tabs %}
<a href="{{ t.url }}" <a href="{{ t.url }}"
{%- if current_tab == t.slug %} {%- if current_tab == t.slug %}
class="selected_tab" class="selected_tab"
{%- endif -%} {%- endif -%}
>{{ t.name }}</a> >{{ t.name }}</a>
{% endfor %} {% endfor %}
</div> </div>
<hr> <hr>
</div> </div>
{% endif %} {% endif %}
{% if error %} {% if error %}
{{ error }} {{ error }}
{% endif %} {% endif %}
{% block content %} {% block content %}
{% endblock %} {% endblock %}
</div>
</div> </div>
{% if not popup %} {% if not popup %}