barraux.a
/
siteWeb
1
0
Fork 0
Code Issues Pull Requests Projects Releases 4 Wiki Activity
Browse Source

indice

master
BARRAUX Arthur 3 years ago
parent
e18eb42cdd
commit
354a5eee3f
3 changed files with 322 additions and 263 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 67
      css/style.css
  2. 34
      prof/index.php
  3. 18
      sass/main.scss

67
css/style.css
View File

@ -2,6 +2,7 @@
font-family: "monofonto";
src: url("../font/raleway.ttf") format("truetype");
}
body {
z-index: 1;
font-family: monofonto;
@ -9,20 +10,24 @@ body {
margin: 143px 20px;
text-align: center;
}
body > a {
position: absolute;
left: 20px;
top: 20px;
margin: auto;
}
body .logo {
display: block;
}
body h1 {
margin: 40px;
font-weight: bold;
color: #454545;
}
body p {
font-weight: bold;
color: #ac2a8d;
@ -37,16 +42,19 @@ body p {
background-color: #84878C;
border-radius: 20px;
}
.nav ul {
margin: auto;
padding: 0;
width: 60%;
}
.nav ul::after {
content: "";
display: block;
clear: both;
}
.nav__link {
width: 20%;
min-width: 100px;
@ -55,11 +63,13 @@ body p {
text-align: center;
list-style-type: none;
}
.nav__link:hover {
background-color: #59184E;
transition: 0.25s;
transition: .25s;
border-radius: 10px;
}
.nav__link a {
padding-top: 10px;
padding-bottom: 10px;
@ -68,6 +78,7 @@ body p {
display: inline-block;
text-decoration: none;
}
.nav__link a:hover {
color: white;
}
@ -86,10 +97,12 @@ form {
.container-field {
position: relative;
}
.container-field small {
display: none;
color: red;
}
.container-field__img {
display: none;
position: relative;
@ -98,6 +111,7 @@ form {
bottom: 20px;
right: 20px;
}
.container-field__field {
background-color: inherit;
position: relative;
@ -114,13 +128,15 @@ form {
border-radius: 30px;
width: 60%;
max-width: 300px;
transition: 0.25s;
transition: .25s;
}
.container-field__field:focus, .container-field__field:hover {
width: 70%;
border-color: #ac2a8d;
background-color: white;
}
.container-field__field--submit:hover {
width: 65%;
border-color: #2ecc71;
@ -128,22 +144,22 @@ form {
}
.hint {
position: relative;
position: absolute;
width: 100%;
top: 0;
}
.hint__int {
position: relative;
width: 100%;
left: 35%;
}
.hint__help {
display: none;
z-index: 2;
position: absolute;
position: relative;
width: 170px;
right: 0;
top: 30%;
right: -50px;
border-radius: 30px;
box-shadow: 0 0 10px black;
padding: 15px;
@ -151,17 +167,21 @@ form {
background-color: #e5e5e5;
font-size: 14px;
}
.hint__help:hover {
display: block;
}
.hint__help p {
position: relative;
font-size: 14px;
}
.hint__help img {
border-radius: 15px;
width: 100%;
}
.hint__help code {
background-color: #aaa;
border-radius: 5px;
@ -179,9 +199,11 @@ form {
color: white;
border: 1px solid #84878C;
}
.table th {
width: 1%;
}
.table td {
background-color: #e5e5e5;
border: 1px solid #84878C;
@ -192,50 +214,61 @@ form {
word-break: break-all;
color: #84878C;
}
.table td img {
width: 40%;
max-width: 40px;
}
.table td input {
border: 2px solid #ac2a8d;
border-radius: 5px;
text-align: inherit;
outline: none;
color: #84878C;
transition: 0.05s;
transition: .05s;
}
.table td input:hover {
font-weight: bold;
}
.table td input:focus {
font-weight: bold;
border: 4px solid #ac2a8d;
}
.table__title td {
color: #ac2a8d;
font-weight: bold;
word-break: normal;
}
.table__switch {
position: relative;
display: inline-block;
width: 60px;
height: 34px;
}
.table__switch input {
opacity: 0;
width: 0;
height: 0;
}
.table__switch input:checked + .table__switch__slider {
background-color: #2ecc71;
}
.table__switch input:focus + .table__switch__slider {
box-shadow: 0 0 1px #2ecc71;
}
.table__switch input:checked + .table__switch__slider:before {
transform: translateX(26px);
}
.table__switch__slider {
position: absolute;
cursor: pointer;
@ -245,8 +278,9 @@ form {
bottom: 0;
background-color: crimson;
border-radius: 34px;
transition: 0.4s;
transition: .4s;
}
.table__switch__slider:before {
position: absolute;
border-radius: 50%;
@ -256,7 +290,7 @@ form {
left: 4px;
bottom: 4px;
background-color: white;
transition: 0.4s;
transition: .4s;
}
.container-popup {
@ -271,10 +305,12 @@ form {
visibility: hidden;
opacity: 0;
}
.container-popup:target {
visibility: visible;
opacity: 1;
}
.container-popup__popup {
margin: auto;
padding: 20px;
@ -289,14 +325,17 @@ form {
position: absolute;
transition: all 5s ease-in-out;
}
.container-popup__popup h2 {
margin-top: 0;
color: #333;
}
.container-popup__popup p {
max-height: 30%;
overflow: auto;
}
.container-popup__popup__close {
position: absolute;
top: 20px;
@ -307,6 +346,7 @@ form {
text-decoration: none;
color: #333;
}
.container-popup__popup__close:hover {
color: #06D85F;
}
@ -316,18 +356,21 @@ form {
background-color: #e5e5e5;
font-weight: bold;
text-decoration: none;
transition: 0.5s;
transition: .5s;
}
.button:hover {
color: #e5e5e5;
background-color: #ac2a8d;
}
.button--small {
width: 3rem;
border-radius: 5px;
margin: 5px;
color: #84878C;
}
.button--large {
color: #ac2a8d;
display: inline-block;
@ -335,5 +378,3 @@ form {
padding: 10px 40px;
border-radius: 20px;
}
/*# sourceMappingURL=style.css.map */

34
prof/index.php
View File

@ -28,7 +28,6 @@ include '../sessions/session.php';
$sql_name = 'dates';
$type = 'date';
$error = 'Veuillez saisir une date';
$help = false;
include("include/champ.php");
?>
</div>
@ -45,7 +44,6 @@ include '../sessions/session.php';
$sql_name = 'lieu';
$type = 'text';
$error = "Vous n'avez saisie de lieu";
$help = true;
include("include/champ.php");
?>
<div class="hint" onmouseleave='hideHelp(lieu)'>
@ -63,28 +61,32 @@ include '../sessions/session.php';
$sql_name = 'salle';
$type = 'text';
$error = "Vous n'avez pas saisie de salle";
$help = true;
include("include/champ.php");
?>
<div class="help" id="salle">
<div class="hint" onmouseleave='hideHelp(salle)'>
<a class="hint__int" href="#" onmouseover=displayHelp(salle)><img src="../img/int.png" alt="point_int" width=20px ></a>
<div class="hint__help" id="salle">
<p>Entrez le nom de la salle dans lequel se trouve le matériel</p><br>
<code>Ex: A 11 codage</code>
</div>
</div>
</div>
<div class="container-field">
<?php
$titre = 'Position dans la salle';
$titre = 'Position :';
$sql_name = 'pos';
$type = 'text';
$error = 'Veuillez remplir ce champ';
$help = true;
include("include/champ.php");
?>
<div class="help" id="pos">
<div class="hint" onmouseleave='hideHelp(pos)'>
<a class="hint__int" href="#" onmouseover=displayHelp(pos)><img src="../img/int.png" alt="point_int" width=20px ></a>
<div class="hint__help" id="pos">
<p>Veillez fournir des présision sur la position du matériel</p><br>
<code>Ex: PC-42 au fond à droite</code>
</div>
</div>
</div>
<div class="container-field">
<p>Matériel :</p>
<select class="container-field__field" name='materiel'>
@ -107,46 +109,52 @@ include '../sessions/session.php';
$help = true;
include("include/champ.php");
?>
<div class="help" id="marque">
<div class="hint" onmouseleave='hideHelp(marque)'>
<a class="hint__int" href="#" onmouseover=displayHelp(marque)><img src="../img/int.png" alt="point_int" width=20px ></a>
<div class="hint__help" id="marque">
<p>Veillez renseigner la marque du matériel</p><br>
<code>Ex: Asus</code>
</div>
</div>
</div>
<div class="container-field">
<?php
$titre = 'Model';
$sql_name = 'model';
$type = 'text';
$error = "Veuillez saisir le model";
$help = true;
include("include/champ.php");
?>
<div class="help" id="model">
<div class="hint" onmouseleave='hideHelp(model)'>
<a class="hint__int" href="#" onmouseover=displayHelp(model)><img src="../img/int.png" alt="point_int" width=20px ></a>
<div class="hint__help" id="model">
<p>Veillez renseigner le modèle du matériel</p><br>
<code>Ex: Lattitude E6410</code>
</div>
</div>
</div>
<div class="container-field">
<?php
$titre = 'N° de série';
$sql_name = 'nserie';
$type = 'text';
$error = "Vous n'avez saisie le n° de série";
$help = true;
include("include/champ.php");
?>
<div class="help" id="nserie" onmouseleave='hideHelp(nserie)'>
<div class="hint" onmouseleave='hideHelp(nserie)'>
<a class="hint__int" href="#" onmouseover=displayHelp(nserie)><img src="../img/int.png" alt="point_int" width=20px ></a>
<div class="hint__help" id="nserie">
<p>Voici un exemple. Pour plus d'aide: <a href="#">ici</a> </p> <br>
<code>Ex: 3A42B14</code>
</div>
</div>
</div>
<div class="container-field">
<?php
$titre = 'Nom';
$sql_name = 'demandeur';
$type = 'text';
$error = 'Veulliez entrer votre nom';
$help = false;
include("include/champ.php");
?>
</div>

18
sass/main.scss
View File

@ -147,16 +147,23 @@ form {
// help
.help {
.hint {
position: absolute;
width: 100%;
top: 0;
&__int {
position: relative;
left: 35%;
}
&__help {
&:hover {
display: block;
}
display: none;
z-index: 2;
position: absolute;
position: relative;
width: 170px;
right: 0;
top: 30%;
right: -50px;
border-radius: 30px;
box-shadow: 0 0 10px black;
padding: 15px;
@ -179,6 +186,9 @@ form {
font-size: 14px;
}
}
}
// table

Write Preview
Loading…
Cancel
Save