added CSS (Merci Camille!)
This commit is contained in:
parent
f8f353f3e2
commit
fe6019e5f0
5 changed files with 758 additions and 407 deletions
2
.gitignore
vendored
2
.gitignore
vendored
|
@ -9,3 +9,5 @@
|
||||||
/venv/
|
/venv/
|
||||||
|
|
||||||
*.sqlite3
|
*.sqlite3
|
||||||
|
fiches/templates/fiches/base_old.html
|
||||||
|
fiches/static/fiches/css_old/
|
||||||
|
|
348
fiches/static/fiches/css/annuaire.css
Normal file
348
fiches/static/fiches/css/annuaire.css
Normal file
|
@ -0,0 +1,348 @@
|
||||||
|
@charset "UTF-8";
|
||||||
|
#main-menu a a, #account-area a, a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: #FFDC00; }
|
||||||
|
|
||||||
|
#main-menu a a:hover, #account-area a:hover, a:hover,
|
||||||
|
#main-menu a a:active,
|
||||||
|
#account-area a:active,
|
||||||
|
a:active,
|
||||||
|
#main-menu a a:focus,
|
||||||
|
#account-area a:focus,
|
||||||
|
a:focus {
|
||||||
|
color: #ffbb00; }
|
||||||
|
|
||||||
|
#menu {
|
||||||
|
display: grid;
|
||||||
|
float: right;
|
||||||
|
width: 320px;
|
||||||
|
grid-template-columns: auto;
|
||||||
|
grid-template-rows: auto auto auto auto 120px;
|
||||||
|
grid-template-areas: "title" "language" "search" "menu" "account"; }
|
||||||
|
|
||||||
|
#title {
|
||||||
|
grid-area: title;
|
||||||
|
margin: 0;
|
||||||
|
padding: 20px 20px 0 20px;
|
||||||
|
font-size: 2.2rem;
|
||||||
|
text-align: center; }
|
||||||
|
#title a, #title a:hover, #title a:active, #title a:focus, #title a:visited {
|
||||||
|
color: #FFFFFF; }
|
||||||
|
|
||||||
|
#search-area {
|
||||||
|
grid-area: search;
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
width: calc(100% - 40px);
|
||||||
|
height: 50px;
|
||||||
|
margin: 5px 0 20px 0;
|
||||||
|
padding: 0 20px; }
|
||||||
|
#search-area input {
|
||||||
|
-webkit-box-flex: 1;
|
||||||
|
-ms-flex-positive: 1;
|
||||||
|
flex-grow: 1;
|
||||||
|
width: calc(100% - 10px);
|
||||||
|
height: 100%;
|
||||||
|
padding: 5px 10px;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
border: none;
|
||||||
|
font-size: 1.4rem; }
|
||||||
|
#search-area button {
|
||||||
|
width: 50px;
|
||||||
|
height: 100%;
|
||||||
|
margin: 0;
|
||||||
|
color: transparent;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black" width="18px" height="18px"><path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/><path d="M0 0h24v24H0z" fill="none"/></svg>');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: 50%;
|
||||||
|
background-position: center;
|
||||||
|
border: none;
|
||||||
|
-webkit-transition: 25ms ease-in-out;
|
||||||
|
transition: 25ms ease-in-out; }
|
||||||
|
#search-area button:hover {
|
||||||
|
background-color: #FFDC00; }
|
||||||
|
|
||||||
|
#language_switch {
|
||||||
|
grid-area: language;
|
||||||
|
margin: 0 20px 25px 20px;
|
||||||
|
text-align: center; }
|
||||||
|
#language_switch .language {
|
||||||
|
display: inline-block;
|
||||||
|
color: #DFDFDF; }
|
||||||
|
#language_switch .language:hover {
|
||||||
|
color: #FFDC00; }
|
||||||
|
#language_switch .language::after,
|
||||||
|
#language_switch .current-language::after {
|
||||||
|
content: "·";
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0 1ex;
|
||||||
|
color: #DFDFDF; }
|
||||||
|
#language_switch .language:last-child::after {
|
||||||
|
content: none; }
|
||||||
|
#language_switch .current-language {
|
||||||
|
text-decoration: underline; }
|
||||||
|
|
||||||
|
#main-menu a a, #account-area a {
|
||||||
|
display: inline-block;
|
||||||
|
width: 100%;
|
||||||
|
margin: 5px 0;
|
||||||
|
padding: 5px 10px;
|
||||||
|
color: #FFDC00;
|
||||||
|
font-size: 1.2rem; }
|
||||||
|
#main-menu a a:hover, #account-area a:hover {
|
||||||
|
color: #ffbb00; }
|
||||||
|
|
||||||
|
#main-menu {
|
||||||
|
grid-area: menu;
|
||||||
|
padding: 20px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
text-align: center; }
|
||||||
|
#main-menu a {
|
||||||
|
display: inline-block;
|
||||||
|
width: 100%;
|
||||||
|
margin: 5px 0;
|
||||||
|
padding: 5px 10px;
|
||||||
|
color: #FFDC00;
|
||||||
|
font-size: 1.2rem; }
|
||||||
|
#main-menu a:hover {
|
||||||
|
color: #ffbb00; }
|
||||||
|
|
||||||
|
#account-area {
|
||||||
|
grid-area: account;
|
||||||
|
display: block;
|
||||||
|
padding: 20px;
|
||||||
|
text-align: center; }
|
||||||
|
#account-area .clipper {
|
||||||
|
font-family: "Source Code Pro", monospace; }
|
||||||
|
|
||||||
|
#content-area {
|
||||||
|
color: #FFFFFF; }
|
||||||
|
|
||||||
|
.content {
|
||||||
|
max-width: 780px;
|
||||||
|
width: 50vw;
|
||||||
|
margin: 20px; }
|
||||||
|
.content h2 {
|
||||||
|
margin: 50px 0 50px 0;
|
||||||
|
padding: 0;
|
||||||
|
font-size: 2rem;
|
||||||
|
text-align: center; }
|
||||||
|
.content input {
|
||||||
|
min-height: 30px;
|
||||||
|
padding: 5px; }
|
||||||
|
.content input[type="button"],
|
||||||
|
.content input[type="submit"] {
|
||||||
|
padding: 10px;
|
||||||
|
background-color: #724162;
|
||||||
|
border: none;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
color: #FFFFFF;
|
||||||
|
-webkit-box-shadow: 2px 2px 0 rgba(31, 14, 25, 0.3);
|
||||||
|
box-shadow: 2px 2px 0 rgba(31, 14, 25, 0.3);
|
||||||
|
-webkit-transition: 25ms ease-in-out;
|
||||||
|
transition: 25ms ease-in-out; }
|
||||||
|
.content input[type="button"]:hover,
|
||||||
|
.content input[type="submit"]:hover {
|
||||||
|
background-color: #4e2d43; }
|
||||||
|
|
||||||
|
#content-home form {
|
||||||
|
display: grid;
|
||||||
|
width: 400px;
|
||||||
|
margin: 0 auto;
|
||||||
|
grid-template-columns: 150px 250px;
|
||||||
|
gap: 20px; }
|
||||||
|
#content-home form label {
|
||||||
|
grid-column: 1;
|
||||||
|
margin: 5px 0 0 0;
|
||||||
|
text-align: right; }
|
||||||
|
#content-home form input {
|
||||||
|
grid-column: 2; }
|
||||||
|
#content-home form select {
|
||||||
|
grid-column: 2; }
|
||||||
|
#content-home form input[type="submit"] {
|
||||||
|
width: 100%;
|
||||||
|
margin: 20px 0 50px 0; }
|
||||||
|
#content-home form .wide-form-entry {
|
||||||
|
grid-column: 1/3; }
|
||||||
|
#content-home form .checkbox label {
|
||||||
|
display: inline; }
|
||||||
|
#content-home form .checkbox input[type="checkbox"] {
|
||||||
|
display: inline;
|
||||||
|
width: 1rem;
|
||||||
|
float: right; }
|
||||||
|
|
||||||
|
#content-view-profile {
|
||||||
|
display: grid;
|
||||||
|
grid-template-rows: 150px auto auto;
|
||||||
|
grid-template-columns: 3fr 1fr;
|
||||||
|
grid-template-areas: "header header" "infos infos" "free-text free-text";
|
||||||
|
gap: 20px; }
|
||||||
|
#content-view-profile .content-header {
|
||||||
|
grid-area: header;
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-pack: center;
|
||||||
|
-ms-flex-pack: center;
|
||||||
|
justify-content: center;
|
||||||
|
-webkit-box-align: center;
|
||||||
|
-ms-flex-align: center;
|
||||||
|
align-items: center;
|
||||||
|
height: 150px; }
|
||||||
|
#content-view-profile .name {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
font-size: 2rem; }
|
||||||
|
#content-view-profile .name .alias {
|
||||||
|
display: block;
|
||||||
|
color: #DFDFDF;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
font-weight: normal;
|
||||||
|
text-align: center; }
|
||||||
|
#content-view-profile .photo {
|
||||||
|
height: 150px;
|
||||||
|
margin: 0 20px 0 0;
|
||||||
|
border-radius: 150px;
|
||||||
|
border: 2px solid rgba(31, 14, 25, 0.3); }
|
||||||
|
#content-view-profile .label {
|
||||||
|
margin: 0 0 5px 0;
|
||||||
|
font-style: italic;
|
||||||
|
color: #FFDC00;
|
||||||
|
font-size: 1.2rem; }
|
||||||
|
#content-view-profile .label, #content-view-profile .value {
|
||||||
|
display: block; }
|
||||||
|
#content-view-profile .infos {
|
||||||
|
grid-area: infos;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
gap: 20px; }
|
||||||
|
#content-view-profile .infos > * {
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0;
|
||||||
|
padding: 10px;
|
||||||
|
background-color: #3b1e31;
|
||||||
|
-webkit-box-shadow: 2px 2px 0 rgba(31, 14, 25, 0.3);
|
||||||
|
box-shadow: 2px 2px 0 rgba(31, 14, 25, 0.3); }
|
||||||
|
#content-view-profile .free-text {
|
||||||
|
grid-area: free-text;
|
||||||
|
padding: 10px; }
|
||||||
|
#content-view-profile .free-text .label {
|
||||||
|
display: none; }
|
||||||
|
#content-view-profile .free-text .value {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0; }
|
||||||
|
|
||||||
|
#content-edit-profile form {
|
||||||
|
width: 400px;
|
||||||
|
margin: 0 auto; }
|
||||||
|
#content-edit-profile form .form-entry {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
margin: 0 0 20px 0;
|
||||||
|
padding: 10px;
|
||||||
|
background-color: #3b1e31;
|
||||||
|
-webkit-box-shadow: 2px 2px 0 rgba(31, 14, 25, 0.3);
|
||||||
|
box-shadow: 2px 2px 0 rgba(31, 14, 25, 0.3); }
|
||||||
|
#content-edit-profile form .form-entry > * {
|
||||||
|
display: block; }
|
||||||
|
#content-edit-profile form .form-entry label {
|
||||||
|
margin: 0 0 5px 0;
|
||||||
|
color: #FFDC00;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
font-style: italic;
|
||||||
|
text-align: left; }
|
||||||
|
#content-edit-profile form .form-entry input, #content-edit-profile form .form-entry select {
|
||||||
|
width: 100%; }
|
||||||
|
#content-edit-profile form .form-entry.checkbox > * {
|
||||||
|
display: inline;
|
||||||
|
width: auto; }
|
||||||
|
#content-edit-profile form input[type="submit"] {
|
||||||
|
width: 100%;
|
||||||
|
margin: 20px 0 50px 0; }
|
||||||
|
#content-edit-profile form .checkbox label {
|
||||||
|
display: inline; }
|
||||||
|
#content-edit-profile form .checkbox input[type="checkbox"] {
|
||||||
|
display: block;
|
||||||
|
width: auto;
|
||||||
|
float: right; }
|
||||||
|
#content-edit-profile #free-text-edit-form textarea {
|
||||||
|
width: 100%;
|
||||||
|
padding: 5px; }
|
||||||
|
#content-edit-profile #photo-edit-form .current-photo {
|
||||||
|
margin: 0 0 20px 0;
|
||||||
|
text-align: center; }
|
||||||
|
#content-edit-profile #photo-edit-form .current-photo img {
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
margin: 0 20px 0 0;
|
||||||
|
border-radius: 150px;
|
||||||
|
border: 2px solid rgba(31, 14, 25, 0.3);
|
||||||
|
-o-object-fit: cover;
|
||||||
|
object-fit: cover; }
|
||||||
|
#content-edit-profile #photo-edit-form .photo-edit-controls .control {
|
||||||
|
margin: 0 0 10px 0; }
|
||||||
|
#content-edit-profile #photo-edit-form .photo-edit-controls .control:last-child {
|
||||||
|
margin: 0; }
|
||||||
|
#content-edit-profile #photo-edit-form .photo-edit-controls label {
|
||||||
|
font-size: 1rem;
|
||||||
|
color: #FFDC00;
|
||||||
|
font-style: italic; }
|
||||||
|
#content-edit-profile #photo-edit-form .photo-edit-controls input[type="file"] {
|
||||||
|
text-align: center; }
|
||||||
|
|
||||||
|
#footer {
|
||||||
|
max-width: 780px;
|
||||||
|
padding: 20px;
|
||||||
|
color: #DFDFDF;
|
||||||
|
text-align: center; }
|
||||||
|
#footer .thanks {
|
||||||
|
display: block;
|
||||||
|
text-align: center; }
|
||||||
|
|
||||||
|
* {
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
box-sizing: border-box; }
|
||||||
|
|
||||||
|
body, html {
|
||||||
|
height: 100%; }
|
||||||
|
|
||||||
|
body {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: auto auto;
|
||||||
|
grid-template-areas: "aside main";
|
||||||
|
background-color: #301827;
|
||||||
|
color: #FFFFFF;
|
||||||
|
font-family: "Fira Sans", "Roboto", sans-serif; }
|
||||||
|
|
||||||
|
#aside {
|
||||||
|
grid-area: aside;
|
||||||
|
padding: 0 0 0 10vw;
|
||||||
|
background-color: #1f0e19;
|
||||||
|
-webkit-box-shadow: 4px 0 0 rgba(31, 14, 25, 0.3);
|
||||||
|
box-shadow: 4px 0 0 rgba(31, 14, 25, 0.3);
|
||||||
|
z-index: 1000; }
|
||||||
|
|
||||||
|
#main {
|
||||||
|
grid-area: main;
|
||||||
|
padding: 0 10vw 0 0;
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
-webkit-box-direction: normal;
|
||||||
|
-ms-flex-direction: column;
|
||||||
|
flex-direction: column;
|
||||||
|
-webkit-box-pack: justify;
|
||||||
|
-ms-flex-pack: justify;
|
||||||
|
justify-content: space-between;
|
||||||
|
background-color: #301827;
|
||||||
|
z-index: 500; }
|
||||||
|
|
||||||
|
@media only screen and (max-width: 1200px) {
|
||||||
|
#header {
|
||||||
|
margin: 0; }
|
||||||
|
|
||||||
|
#main {
|
||||||
|
margin: 0; } }
|
349
fiches/static/fiches/css/normalize.css
vendored
Normal file
349
fiches/static/fiches/css/normalize.css
vendored
Normal file
|
@ -0,0 +1,349 @@
|
||||||
|
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
|
||||||
|
|
||||||
|
/* Document
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the line height in all browsers.
|
||||||
|
* 2. Prevent adjustments of font size after orientation changes in iOS.
|
||||||
|
*/
|
||||||
|
|
||||||
|
html {
|
||||||
|
line-height: 1.15; /* 1 */
|
||||||
|
-webkit-text-size-adjust: 100%; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Sections
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the margin in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Render the `main` element consistently in IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
main {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the font size and margin on `h1` elements within `section` and
|
||||||
|
* `article` contexts in Chrome, Firefox, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 2em;
|
||||||
|
margin: 0.67em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Grouping content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct box sizing in Firefox.
|
||||||
|
* 2. Show the overflow in Edge and IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
hr {
|
||||||
|
box-sizing: content-box; /* 1 */
|
||||||
|
height: 0; /* 1 */
|
||||||
|
overflow: visible; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||||
|
* 2. Correct the odd `em` font sizing in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
pre {
|
||||||
|
font-family: monospace, monospace; /* 1 */
|
||||||
|
font-size: 1em; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Text-level semantics
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the gray background on active links in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
a {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Remove the bottom border in Chrome 57-
|
||||||
|
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
abbr[title] {
|
||||||
|
border-bottom: none; /* 1 */
|
||||||
|
text-decoration: underline; /* 2 */
|
||||||
|
text-decoration: underline dotted; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
b,
|
||||||
|
strong {
|
||||||
|
font-weight: bolder;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||||
|
* 2. Correct the odd `em` font sizing in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
code,
|
||||||
|
kbd,
|
||||||
|
samp {
|
||||||
|
font-family: monospace, monospace; /* 1 */
|
||||||
|
font-size: 1em; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font size in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
small {
|
||||||
|
font-size: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||||
|
* all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
sub,
|
||||||
|
sup {
|
||||||
|
font-size: 75%;
|
||||||
|
line-height: 0;
|
||||||
|
position: relative;
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
sub {
|
||||||
|
bottom: -0.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
sup {
|
||||||
|
top: -0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Embedded content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the border on images inside links in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
img {
|
||||||
|
border-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Forms
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Change the font styles in all browsers.
|
||||||
|
* 2. Remove the margin in Firefox and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input,
|
||||||
|
optgroup,
|
||||||
|
select,
|
||||||
|
textarea {
|
||||||
|
font-family: inherit; /* 1 */
|
||||||
|
font-size: 100%; /* 1 */
|
||||||
|
line-height: 1.15; /* 1 */
|
||||||
|
margin: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Show the overflow in IE.
|
||||||
|
* 1. Show the overflow in Edge.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input { /* 1 */
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||||
|
* 1. Remove the inheritance of text transform in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
select { /* 1 */
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
[type="button"],
|
||||||
|
[type="reset"],
|
||||||
|
[type="submit"] {
|
||||||
|
-webkit-appearance: button;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inner border and padding in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button::-moz-focus-inner,
|
||||||
|
[type="button"]::-moz-focus-inner,
|
||||||
|
[type="reset"]::-moz-focus-inner,
|
||||||
|
[type="submit"]::-moz-focus-inner {
|
||||||
|
border-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Restore the focus styles unset by the previous rule.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button:-moz-focusring,
|
||||||
|
[type="button"]:-moz-focusring,
|
||||||
|
[type="reset"]:-moz-focusring,
|
||||||
|
[type="submit"]:-moz-focusring {
|
||||||
|
outline: 1px dotted ButtonText;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the padding in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
fieldset {
|
||||||
|
padding: 0.35em 0.75em 0.625em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the text wrapping in Edge and IE.
|
||||||
|
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||||
|
* 3. Remove the padding so developers are not caught out when they zero out
|
||||||
|
* `fieldset` elements in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
legend {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
color: inherit; /* 2 */
|
||||||
|
display: table; /* 1 */
|
||||||
|
max-width: 100%; /* 1 */
|
||||||
|
padding: 0; /* 3 */
|
||||||
|
white-space: normal; /* 1 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||||
|
*/
|
||||||
|
|
||||||
|
progress {
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the default vertical scrollbar in IE 10+.
|
||||||
|
*/
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct box sizing in IE 10.
|
||||||
|
* 2. Remove the padding in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="checkbox"],
|
||||||
|
[type="radio"] {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
padding: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="number"]::-webkit-inner-spin-button,
|
||||||
|
[type="number"]::-webkit-outer-spin-button {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the odd appearance in Chrome and Safari.
|
||||||
|
* 2. Correct the outline style in Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="search"] {
|
||||||
|
-webkit-appearance: textfield; /* 1 */
|
||||||
|
outline-offset: -2px; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inner padding in Chrome and Safari on macOS.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="search"]::-webkit-search-decoration {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
* 2. Change font properties to `inherit` in Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
::-webkit-file-upload-button {
|
||||||
|
-webkit-appearance: button; /* 1 */
|
||||||
|
font: inherit; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Interactive
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add the correct display in Edge, IE 10+, and Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
details {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add the correct display in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
summary {
|
||||||
|
display: list-item;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Misc
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 10+.
|
||||||
|
*/
|
||||||
|
|
||||||
|
template {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[hidden] {
|
||||||
|
display: none;
|
||||||
|
}
|
|
@ -1,351 +0,0 @@
|
||||||
html {
|
|
||||||
background-color: black;
|
|
||||||
color: #FFF;
|
|
||||||
font-family: Verdana, Verdana, Geneva, sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
margin: 0 0 0.8em 0;
|
|
||||||
min-height: 538px;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
a:link {
|
|
||||||
background-color: inherit;
|
|
||||||
color: #7978DA;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
a:visited {
|
|
||||||
background-color: inherit;
|
|
||||||
color: #9CA6FF;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
a:hover {
|
|
||||||
background-color: inherit;
|
|
||||||
color: #006CE3;
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
margin-top: 0.6em;
|
|
||||||
margin-bottom: 0.6em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ens {
|
|
||||||
color: #89C4FF;
|
|
||||||
background-color: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tiny {
|
|
||||||
font-size: 0.8em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.verytiny {
|
|
||||||
font-size: 0.7em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dark {
|
|
||||||
color: #666;
|
|
||||||
background-color: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
.center {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.right {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.spacer {
|
|
||||||
width: 100%;
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
.error {
|
|
||||||
font-weight: bold;
|
|
||||||
color: #FB0000;
|
|
||||||
background-color: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
.warning {
|
|
||||||
font-weight: bold;
|
|
||||||
color: #FF8A00;
|
|
||||||
background-color: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mainspacer {
|
|
||||||
width: 100%;
|
|
||||||
height: 0.8em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.success {
|
|
||||||
font-weight: bold;
|
|
||||||
color: #00E000;
|
|
||||||
background-color: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
.success a:link {
|
|
||||||
background-color: inherit;
|
|
||||||
color: #008800;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.success a:visited {
|
|
||||||
background-color: inherit;
|
|
||||||
color: #008800;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.success a:hover {
|
|
||||||
background-color: inherit;
|
|
||||||
color: #4FFF4F;
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.block {
|
|
||||||
background-color: #333;
|
|
||||||
-webkit-border-radius: 5px;
|
|
||||||
-moz-border-radius: 5px;
|
|
||||||
text-align: justify;
|
|
||||||
padding: 0.5em 0.5em;
|
|
||||||
margin: 0 1em 1em 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#main {
|
|
||||||
padding-top: 0.5em;
|
|
||||||
margin-left: 1em;
|
|
||||||
background-color: transparent;
|
|
||||||
color: #FFF;
|
|
||||||
width: 40em;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
#header {
|
|
||||||
margin: 0 1em 0 1em;
|
|
||||||
float: left;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#header h1 {
|
|
||||||
margin-top: 0;
|
|
||||||
font-family: Georgia, sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
#header h1 a:link, #header h1 a:visited {
|
|
||||||
color: #FFF;
|
|
||||||
background-color: inherit;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#header h1 a:hover {
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
#language_switch {
|
|
||||||
margin-top: 0.5em;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
#language_switch form {
|
|
||||||
float: left;
|
|
||||||
padding: 0;
|
|
||||||
margin-left: 0.5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#content {
|
|
||||||
}
|
|
||||||
|
|
||||||
#content h3 {
|
|
||||||
margin-top: 0;
|
|
||||||
margin-bottom: 0.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#content h4 {
|
|
||||||
margin-top: 0.5em;
|
|
||||||
margin-bottom: 0.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#footer {
|
|
||||||
padding: 0.2em 0;
|
|
||||||
margin: 1em 5em 0 5em;
|
|
||||||
clear: both;
|
|
||||||
background-color: #333;
|
|
||||||
-webkit-border-radius: 5px;
|
|
||||||
-moz-border-radius: 5px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#contact {
|
|
||||||
margin: 0.5em 8em 0 8em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#search {
|
|
||||||
margin-bottom: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.errorlist {
|
|
||||||
display: inline;
|
|
||||||
margin-top: 0;
|
|
||||||
margin-bottom: 0;
|
|
||||||
padding-left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.errorlist li {
|
|
||||||
display: inline;
|
|
||||||
font-weight: bold;
|
|
||||||
color: #E00000;
|
|
||||||
background-color: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
#advanced_search {
|
|
||||||
border: 1px solid #CCC;
|
|
||||||
padding: 0.5em;
|
|
||||||
margin-bottom: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.advanced_filter {
|
|
||||||
width: 50%;
|
|
||||||
margin-top: 1px;
|
|
||||||
margin-bottom: 1px;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.advanced_filter input {
|
|
||||||
max-width: 60%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.submit_button {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.add_delete_button {
|
|
||||||
text-align: right;
|
|
||||||
margin: 0.3em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#pdflink {
|
|
||||||
text-align: right;
|
|
||||||
font-size: 0.8em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#picture {
|
|
||||||
width: 8em;
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
#picture img {
|
|
||||||
margin-top: 0.3em;
|
|
||||||
max-width: 8em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#infos {
|
|
||||||
padding-left: 1em;
|
|
||||||
float: left;
|
|
||||||
width: 31em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#ficheedit {
|
|
||||||
margin-top: 0;
|
|
||||||
padding-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.editfield {
|
|
||||||
padding-top: 0.2em;
|
|
||||||
padding-bottom: 0.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.editfield input {
|
|
||||||
}
|
|
||||||
|
|
||||||
.editfield textarea {
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
margin-top:0.2em;
|
|
||||||
display: block;
|
|
||||||
width: 98%;
|
|
||||||
height: 3em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.message {
|
|
||||||
margin-top: 0.3em;
|
|
||||||
margin-bottom: 0.3em;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.long_message {
|
|
||||||
margin-top: 0.6em;
|
|
||||||
margin-bottom: 0.6em;
|
|
||||||
text-align: justify;
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldset.address .editfield textarea, fieldset.quote .editfield textarea {
|
|
||||||
height: 3em;
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldset.address, fieldset.quote {
|
|
||||||
padding-bottom: 0.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#main-login-container {
|
|
||||||
width: 500px;
|
|
||||||
margin: 3.5em auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
#main-login-container h3.error {
|
|
||||||
text-align: center;
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
font-size: 1.3em;
|
|
||||||
font-family: 'Droid Serif', serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
#main-login {
|
|
||||||
width: 500px;
|
|
||||||
border: 15px solid #333;
|
|
||||||
-webkit-border-radius: 20px;
|
|
||||||
-moz-border-radius: 20px;
|
|
||||||
border-radius: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#main-login.login_block {
|
|
||||||
padding: 2em;
|
|
||||||
box-shadow: 0 0 100px #AAA inset;
|
|
||||||
}
|
|
||||||
|
|
||||||
a#login_clipper, a#login_outsider {
|
|
||||||
float: left;
|
|
||||||
display: block;
|
|
||||||
width: 250px;
|
|
||||||
height: 200px;
|
|
||||||
text-align: center;
|
|
||||||
font-family: 'Droid Serif', serif;
|
|
||||||
font-size: 1.3em;
|
|
||||||
font-weight: bold;
|
|
||||||
line-height: 190px;
|
|
||||||
text-decoration: none;
|
|
||||||
color: #FFF;
|
|
||||||
}
|
|
||||||
|
|
||||||
a#login_clipper {
|
|
||||||
background-color: #123E96;
|
|
||||||
box-shadow: 0 0 100px #040C78 inset;
|
|
||||||
}
|
|
||||||
|
|
||||||
a#login_clipper:hover {
|
|
||||||
background-color: #164BB6;
|
|
||||||
}
|
|
||||||
|
|
||||||
a#login_outsider {
|
|
||||||
background-color: #961221;
|
|
||||||
box-shadow: 0 0 100px #780411 inset;
|
|
||||||
}
|
|
||||||
|
|
||||||
a#login_outsider:hover {
|
|
||||||
background-color: #B31729;
|
|
||||||
}
|
|
|
@ -1,29 +1,35 @@
|
||||||
{% load i18n %}
|
{% load i18n %}
|
||||||
{% load staticfiles %}
|
{% load staticfiles %}
|
||||||
<!doctype html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
|
||||||
|
<meta charset="UTF-8">
|
||||||
<title>
|
<title>
|
||||||
{% block title_onglet %}{% trans "Annuaire des élèves de l'ENS" %}{% endblock %}
|
{% block title_onglet %}{% trans "Annuaire des élèves de l'ENS" %}{% endblock %}
|
||||||
</title>
|
</title>
|
||||||
<link rel="stylesheet" type="text/css" href="{% static "fiches/css/style.css" %}" />
|
<link rel="stylesheet" type="text/css" href="view_fiche_files/style.css">
|
||||||
|
<link rel="stylesheet" type="text/css" href="{% static "fiches/css/normalize.css" %}" />
|
||||||
{% block extrahead %}{% endblock %}
|
<link rel="stylesheet" type="text/css" href="{% static "fiches/css/annuaire.css" %}" />
|
||||||
{# Pour pouvoir ajouter des trucs dans le head sur une autre page #}
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="header">
|
<div id="aside">
|
||||||
|
<div id="menu">
|
||||||
<div id="language_switch">
|
<div id="language_switch">
|
||||||
|
<a class="language french current-language" href="/">Français</a><a class="language english" href="/">English</a><a class="language esperanto" href="/">Esperanto</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="spacer"></div>
|
|
||||||
<h1>
|
<form id="search-area">
|
||||||
|
<input type="search" placeholder="Marc Mézard">
|
||||||
|
<button type="submit">Rechercher</button>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<h1 id="title">
|
||||||
{% block title %} <a href='{% url "home" %}'>{% trans "Annuaire des élèves de l'ENS" %}</a>{% endblock %}
|
{% block title %} <a href='{% url "home" %}'>{% trans "Annuaire des élèves de l'ENS" %}</a>{% endblock %}
|
||||||
</h1>
|
</h1>
|
||||||
{% if user.is_authenticated %}
|
|
||||||
{% blocktrans %}Connecté en tant que <tt>{{ user }}</tt>{% endblocktrans %}<br />
|
|
||||||
|
|
||||||
{% endif %}
|
|
||||||
|
<div id="main-menu">
|
||||||
<nav>
|
<nav>
|
||||||
<a href='{% url "home" %}'> Accueil </a>
|
<a href='{% url "home" %}'> Accueil </a>
|
||||||
<a href='{% url "fiche_modif" %}'> Modifier sa fiche d'annuaire </a>
|
<a href='{% url "fiche_modif" %}'> Modifier sa fiche d'annuaire </a>
|
||||||
|
@ -34,38 +40,35 @@
|
||||||
{% else %}
|
{% else %}
|
||||||
<a href='{% url "cas_ng_login" %}'> Se connecter</a>
|
<a href='{% url "cas_ng_login" %}'> Se connecter</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
</nav>
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div id="account-area">
|
||||||
|
{% if user.is_authenticated %}
|
||||||
|
{% blocktrans %}Connecté en tant que <tt>{{ user }}</tt>{% endblocktrans %}<br />
|
||||||
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="main">
|
<div id="main">
|
||||||
<div id="content">
|
<div id="content-area">
|
||||||
|
|
||||||
{% block contentspacer %}{% endblock %}
|
{% block contentspacer %}{% endblock %}
|
||||||
{% block content %}{% endblock %}
|
{% block content %}{% endblock %}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div id="footer">
|
<div id="footer">
|
||||||
|
|
||||||
{% block footer %}
|
{% block footer %}
|
||||||
[<a href="http://www.ens.fr">ENS</a>]
|
<span class="thanks">
|
||||||
[<a href="http://www.eleves.ens.fr/">{% trans "Page des élèves" %}</a>]
|
Crée par KDENS · Propulsé par Django
|
||||||
{% endblock %}
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div id="contact" class="verytiny">
|
|
||||||
|
|
||||||
{% block contact %}
|
|
||||||
<a href="mailto:klub-dev@ens.fr">
|
|
||||||
{% trans "Contacter l'équipe annuaire" %}
|
|
||||||
</a>
|
|
||||||
<span class="right dark" title="annuaireweb v{{ VERSION }}">
|
|
||||||
powered by Django, KDENS
|
|
||||||
</span>
|
</span>
|
||||||
<div class="spacer"></div>
|
|
||||||
{% endblock %}
|
|
||||||
|
|
||||||
|
[<a href="http://www.ens.fr/">ENS</a>]
|
||||||
|
[<a href="http://www.eleves.ens.fr/">{% trans "Page des élèves" %}</a>]
|
||||||
|
[<a href="mailto:klub-dev@ens.fr">{% trans "Contacter l'équipe annuaire" %} </a>]
|
||||||
|
{% endblock %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="spacer"></div>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
Loading…
Reference in a new issue