KazV2/dockers/quotas/html/express_webapp/public/stylesheets/style.css

211 lines
3.6 KiB
CSS
Raw Normal View History

2024-06-03 18:43:35 +02:00
/*
_____________________________________________________________________________________
Ce fichier CSS est script permettent de modifier l'apparence de nos page web
utiliser par : -groupes.jade
-index.jade
-indexAdmin.jade
-serviceg.jade
-users.jade
-usersError.jade
-usersfound.jade
Auteurs : Lauryne GAULTIER, GUIQUERRO Nathaniel
_____________________________________________________________________________________
*/
html{
overflow: hidden
}
body {
background-color: #f2f3f1;
text-align: center;
}
#entete, #menu, #contenu, #footer {
padding:1px 0;
font-family: "Courier New", monospace;
}
#entete {
font-family: "Source Sans Pro", Helvetica, sans-serif;
background-color:#eeecec;
color: #585858;
}
#entete:hover{
border-bottom-color: transparent;
color: #3dbbf5 !important;
}
#main {
position: relative;
}
#menu {
background-color:#eeecec;
float:left;
position : fixed;
top:0;
bottom:0;
width: 30%;
}
#contenu {
font-family: "Source Sans Pro", Helvetica, sans-serif;
font-size: 125%;
color: #585858;
text-align: center;
position: fixed;
top:20;
left:50%;
overflow: visible;
margin-bottom: 50px;
}
#gauche{
position: fixed;
left: 35%;
}
#droite{
position: fixed;
left: 65%;
}
#footer {
font-family: "Source Sans Pro", Helvetica, sans-serif;
background-color:#eeecec;
margin-top :5%;
position: relative;
bottom: 0;
left: 0;
right: 0;
top: 506px;
color: #585858;
text-align:center;
clear:both;
}
button {
display: inline-block;
background-color: #585858;
border-radius: 10px;
border: 4px double #cccccc;
color: #eeeeee;
text-align: center;
font-size: 28px;
padding: 20px;
width: 500px;
transition: all 0.5s;
cursor: pointer;
margin: 15px;
}
button span {
cursor: pointer;
display: inline-block;
position: relative;
transition: 0.5s;
}
button span:after {
content: '\00bb';
position: absolute;
opacity: 0;
top: 0;
right: -20px;
transition: 0.5s;
}
button:hover {
background-color: #3dbbf5
}
button:hover span {
padding-right: 25px;
}
button:hover span:after {
opacity: 1;
right: 0;
}
#textAR{
margin-left:10%;
}
#valide,
#valide::after {
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
#valide{
background: none;
border: 4px solid rgb(53, 53, 53);
border-radius: 10px;
color: rgb(53, 53, 53);
display: block;
font-size: 0.5em;
font-weight: bold;
margin: 10px auto;
padding: 2em 6em;
text-transform: uppercase;
}
#valide::before,
#valide::after {
background: rgb(53, 53, 53);
content: '';
position: absolute;
z-index: -1;
}
#valide:hover {
color: #3dbbf5
}
#valide::after {
height: 0;
left: 0;
top: 0;
width: 100%;
}
#valide::after {
height: 0;
left: 50%;
top: 50%;
width: 0;
}
#valide:hover:after {
height: 100%;
left: 0;
top: 0;
width: 100%;
}
#champ.textbox[type=text] {
width: 60%;
border-radius:20px;
padding: 12px 20px;
text-align: center;
font-family: Moderne Sans, sans-serif;
color: #1a1919;
font-size: 2vmin;
box-sizing: border-box;
border: 3px solid rgb(104, 103, 103);
transition: 0.5s;
outline: none;
}
#champ.textbox[type=text]:focus {
border: 3px solid rgb(37, 37, 37);
}