beau/projet-clicodrome2.0
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Téléverser les fichiers vers "css/alerte"

Browse source
This commit is contained in:
Justine Beau 2024-12-24 15:12:19 +01:00
parent 5f91e61a80
commit 02c0d28c54
4 changed files with 154 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
css/alerte/a1.css Normal file
View file

@ -0,0 +1,32 @@
.modal {
display: none;
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: #ccc; /* Gris uni */
}
.modal-content {
background-color: white;
margin: 15% auto;
padding: 10px;
border: 2px solid black; /* Bordures noires bien visibles */
width: 40vw;
text-align: left; /* Alignement à gauche */
font-family: Arial, sans-serif; /* Typo basique */
}
.close-btn {
color: black;
font-size: 18px;
}
.modal.button {
padding: 5px 10px;
background-color: #008CBA; /* Bleu très simple */
color: white;
}

39
css/alerte/a2.css Normal file
View file

@ -0,0 +1,39 @@
.modal {
display: none;
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: #ccc; /* Gris uni */
}
.modal-content {
background-color: white;
margin: 15% auto;
padding: 10px;
border: 2px solid black; /* Bordures noires bien visibles */
width: 40vw;
text-align: left; /* Alignement à gauche */
font-family: Arial, sans-serif; /* Typo basique */
border-radius: 5px; /* Bordures légèrement arrondies */
border: 1px solid gray;
}
.close-btn {
color: black;
font-size: 18px;
}
.modal.button {
padding: 5px 10px;
background-color: #008CBA; /* Bleu très simple */
color: white;
}
.close-btn:hover,
.close-btn:focus {
color: red; /* Rouge pour attirer l’attention */
}

39
css/alerte/a3.css Normal file
View file

@ -0,0 +1,39 @@
.modal {
display: none;
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: url('background.jpg') repeat; /* Texture kitsch */
}
.modal-content {
background-color: white;
margin: 15% auto;
padding: 10px;
width: 40vw;
text-align: left; /* Alignement à gauche */
border-radius: 5px; /* Bordures légèrement arrondies */
border: 1px solid gray;
font-family: "Comic Sans MS", cursive; /* Typo iconique des années 2000 */
background-color: pink; /* Couleurs flashy */
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5); /* Ombres portées pour effet "pop" */
}
.close-btn {
color: black;
font-size: 18px;
}
.modal.button {
padding: 5px 10px;
background-color: #ff69b4; /* Rose bonbon */
font-weight: bold;}
.close-btn:hover,
.close-btn:focus {
color: red; /* Rouge pour attirer l’attention */
}

44
css/alerte/a4.css Normal file
View file

@ -0,0 +1,44 @@
.modal {
display: none;
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: url('../../img/tecktonik.jpeg') repeat; /* Texture kitsch */
}
@font-face {
font-family: "Comic Sans MS";
src: url("../font/comic-sans.woff") format("woff");
}
.modal-content {
margin: 15% auto;
padding: 10px;
width: 40vw;
text-align: left; /* Alignement à gauche */
font-family:"Comic Sans MS"; /* Typo iconique des années 2000 */
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.7); /* Ombres portées pour effet "pop" */
background: linear-gradient(to bottom, #ffffff, #e0e0e0); /* Dégradé élégant */
border: none;
border-radius: 10px;
color:purple;
}
.close-btn {
color: black;
font-size: 18px;
}
.modal.button {
padding: 5px 10px;
background-color: #ff69b4; /* Rose bonbon */
font-weight: bold;
border-radius: 0px !important;
}
.close-btn:hover,
.close-btn:focus {
color: red; /* Rouge pour attirer l’attention */
}