vgaNAR6ta/LOLv333
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

edit: style de l'indicateur d'ouverture

Browse Source
This commit is contained in:
vgaNAR6ta
2026-07-06 04:21:38 +02:00
parent 55bf14fc73
commit eaba21e126
3 changed files with 18 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+1 -1
View File
@@ -88,7 +88,7 @@
</svg> </svg>
</div> </div>
<div class="uiStyle" id="lolOpener"> <div class="uiStyle" id="lolOpener">
<p>Le lieu est parfois ouvert en dehors des horaires habituels donc on a installé un capteur sur la porte :</p> <p id="desc">Le lieu est parfois ouvert en dehors des horaires habituels donc on a installé un capteur sur la porte :</p>
</div> </div>
</div> </div>
<div id="aboutSection"> <div id="aboutSection">
src/components/lolStatus.vue
+13 -6
View File
@@ -8,30 +8,37 @@
#lolStatusContainer{ #lolStatusContainer{
width: 161px; width: 161px;
height: 33px; height: 33px;
background-color: transparent; background-color: var(--main-color);
color: var(--main-color); color: var(--back-color);
border-color: var(--main-color); border-color: var(--main-color);
border-style: solid; border-style: solid;
border-width: thin; border-width: thin;
border-radius: 0; border-radius: 33px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-around; justify-content: space-around;
padding-bottom: 3.33px; padding-bottom: 7.77px;
margin-left: 1.61vw; margin-left: 1.61vw;
padding-left: 3.33px;
filter: contrast(200%) saturate(200%);
p{ p{
font-family: 'pressStart2P'; font-family: 'pressStart2P';
font-size: 13.12px; font-size: 16.1px;
letter-spacing: 1.61px; letter-spacing: 1.61px;
font-weight: normal; font-weight: normal;
} }
} }
#lolOpener #lolStatusContainer{ #lolOpener #lolStatusContainer{
padding-top: 3.33px;
margin-left: 0; margin-left: 0;
width: 90%; width: 90%;
align-self: center; align-self: center;
@media(min-width: 700px){
width: 44%;
}
} }
</style> </style>
@@ -56,7 +63,7 @@
this.statusText = this.lolCurrentStatus ? 'OUVERT !' : 'FERMÉ...'; this.statusText = this.lolCurrentStatus ? 'OUVERT !' : 'FERMÉ...';
document.documentElement.setAttribute('data-theme' , currentTheme); document.documentElement.setAttribute('data-theme' , currentTheme);
document.querySelector('link').href = this.lolCurrentStatus ? './src/assets/favicon_open.svg' : './src/assets/favicon.svg' document.querySelector('link').href = this.lolCurrentStatus ? './src/assets/favicon_open.svg' : './src/assets/favicon.svg'
this.$refs.lolStatus.style.animation = this.lolCurrentStatus ? 'blink 1.61s infinite' : 'none'; this.$refs.lolStatus.style.animation = this.lolCurrentStatus ? 'blink 3.33s infinite' : 'none';
} }
}, },
computed: { computed: {
src/style.css
+2 -15
View File
@@ -536,18 +536,6 @@ html, body{
position: relative; position: relative;
gap: 0; gap: 0;
height: auto; height: auto;
#lolStatus{
width:90%;
height: 44px;
border-color: var(--main-color);
border-style: solid;
border-width: thin;
border-radius: 0;
align-self: center;
margin-bottom: 7.77px;
}
} }
@media(min-width: 700px){ @media(min-width: 700px){
@@ -598,10 +586,9 @@ html, body{
padding-left: 16.1px; padding-left: 16.1px;
height: 77px; height: 77px;
#lolStatus{ #desc{
width: 44%; width: 44%;
align-self: center; box-sizing: border-box;
margin-top: 7.77px;
} }
} }