LOL/labolyon.fr
7
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

edit: création des pages statut, sans interactivité pcq je comprends pas comment faire ^^

Browse Source
This commit is contained in:
vgaNAR6ta
2026-07-26 20:54:12 +02:00
parent 13b3b06d11
commit 79f51146c1
8 changed files with 213 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+3 -1
View File
@@ -123,14 +123,16 @@
&emsp;&emsp;Un capteur sur la porte d'entrée indique<br>&emsp;&emsp;si le local est ouvert: &emsp;&emsp;Un capteur sur la porte d'entrée indique<br>&emsp;&emsp;si le local est ouvert:
</p> </p>
</div> </div>
<!-- Preview du statut avec js
<h3 id="lolStatus"> <h3 id="lolStatus">
<small> <small>
Le local est actuellement Le local est actuellement
</small> </small>
Fermé ... Fermé ...
</h3> </h3>
-->
<a href="./status/index.html" class="textBtnStyle">Vérifier si le local <br> est ouvert &rarr; &rarr; &rarr;</a>
</section> </section>
<section id="extraContent"> <section id="extraContent">
<section id="aboutSection" class="solidBox"> <section id="aboutSection" class="solidBox">
<p> <p>
readMe.MD
+1
View File
@@ -0,0 +1 @@
Ce document sert à échanger et partager des idées et trucs à faire pour continuer la mise à jour du site du LOL :
status/closedStyle.css
+73
View File
@@ -0,0 +1,73 @@
:root {
--back-color: #FFFF4D;
--main-color: #000000;
}
/*======================= Page Statut LOL fermé ===*/
#lolIsClosed{
position: relative;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: var(--main-color);
}
#closedContainer{
width:100%;
height: 100%;
border-radius: 33px;
display:flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
section{
width: 333px;
height: 117px;
background-color: var(--back-color);
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding-top: 33px;
margin-top: -77px;
border-radius: 33px;
p{
padding: 0;
margin: 0;
text-transform: none;
font-size: 22px;
font-family: 'velvelyne';
font-weight: bold;
color: var(--main-color);
}
h3{
width: 277px;
height: 50px;
background-color: var(--main-color);
color: var(--back-color);
border-radius: 33px;
text-transform: uppercase;
text-align: center;
font-size: 33px;
font-family: 'karrik';
font-weight: normal;
padding: 0;
margin: 0;
padding-top: 7.77px;
}
}
}
status/index.fermé.html
+20 -1
View File
@@ -1 +1,20 @@
Fermé <!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/svg" href="../assets/favicon.svg" />
<link rel="stylesheet" href="./closedStyle.css">
<link rel="stylesheet" href="../style/animation.css">
<link rel="stylesheet" href="/style/typo.css">
<title>Le LOL est Fermé ...</title>
</head>
<body id="lolIsClosed">
<main id="closedContainer">
<section>
<p>Le LOL est actuellement</p>
<h3 id="lolStatus">fermé ...</h3>
</section>
</main>
</body>
</html>
status/index.ouvert.html
+10 -11
View File
@@ -1,20 +1,19 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" data-theme="open"> <html lang="fr">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/svg" href="/assets/favicon_open.svg" /> <link rel="icon" type="image/svg" href="../assets/favicon_open.svg" />
<style> <link rel="stylesheet" href="./openStyle.css">
:root { <link rel="stylesheet" href="../style/animation.css">
--back-color: #00FF44;
--main-color: #000000;
}
</style>
<title>Le LOL est Ouvert</title> <title>Le LOL est Ouvert</title>
</head> </head>
<body> <body id="lolIsOpen">
<main> <main id="openContainer">
<p id="statusText">Ouvert !</p> <section>
<p>Le LOL est actuellement</p>
<h3 id="lolStatus">ouvert !</h3>
</section>
</main> </main>
</body> </body>
</html> </html>
status/openStyle.css
+69
View File
@@ -26,6 +26,75 @@
height: 120%; height: 120%;
} }
/*======================= Page Statut LOL ouvert ===*/
#lolIsOpen{
position: relative;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: var(--main-color);
}
#openContainer{
width:100%;
height: 100%;
border-radius: 33px;
display:flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
section{
width: 333px;
height: 117px;
background-color: var(--back-color);
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding-top: 33px;
margin-top: -77px;
border-radius: 33px;
p{
padding: 0;
margin: 0;
text-transform: none;
font-size: 22px;
font-family: 'velvelyne';
font-weight: bold;
color: var(--main-color);
}
h3{
width: 277px;
height: 50px;
background-color: var(--main-color);
color: var(--back-color);
border-radius: 33px;
text-transform: uppercase;
text-align: center;
font-size: 33px;
font-family: 'karrik';
font-weight: normal;
padding: 0;
margin: 0;
padding-top: 7.77px;
}
}
}
#lolStatus{ #lolStatus{
animation: blink 3.33s infinite; animation: blink 3.33s infinite;
} }
style/main.css
+6 -1
View File
@@ -277,9 +277,14 @@ main{
padding: 0; padding: 0;
height: 20vh; height: 20vh;
.textBtnStyle{
width: 33vw;
font-size: 11px;
margin-right: 7.77px;
}
#statusDesc{ #statusDesc{
width: 150%; width: 90%;
padding: 7.77px; padding: 7.77px;
padding-right: 13.12px; padding-right: 13.12px;
font-size: 13.12px; font-size: 13.12px;
style/responsive.css
+13 -4
View File
@@ -81,10 +81,10 @@
} }
} }
}
#statuSection{ #statuSection{
.textBtnStyle{
font-size: 16.1px;
}
} }
#extraContent{ #extraContent{
@@ -98,7 +98,10 @@
} }
} }
} }
}
/*===========================Grand format : écrans larges et grands ===*/ /*===========================Grand format : écrans larges et grands ===*/
@media(min-width: 1300px){ @media(min-width: 1300px){
@@ -173,6 +176,12 @@
padding-top: 7.77px; padding-top: 7.77px;
margin-left: -88px; margin-left: -88px;
} }
.textBtnStyle{
font-size: 22px;
margin-right: 33px;
padding-left: 16.1px;
}
} }
#extraContent{ #extraContent{