Skip to content

Commit

Permalink
Meilleure intégration des thèmes
Browse files Browse the repository at this point in the history 
Sauf pour les icônes, je ne comprends pas du tout comment le changement d'images en fonction
du thème opère sur 'infoEvry' donc je ne peux pas copier son fonctionnement
  • Loading branch information
@DridriLaBastos
DridriLaBastos committed Nov 18, 2020
1 parent 7e50457 commit 624fd81
Show file tree
Hide file tree
Showing 10 changed files with 24 additions and 25 deletions.
3 changes: 0 additions & 3 deletions public/css/standard.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,6 @@
--light-element-border-alpha: rgba(230, 230, 230, 0.6);
--light-element-border: rgba(230, 230, 230, 0.7);
--light-element-border-hover: rgba(230, 230, 230, 0.8);
--light-element-modal-background-color: rgba(230, 230, 230,1);/*Obligé de la rajouter sinon les fenetres modales avaient un fond transparent avec le thème light*/
--light-border-alpha: rgba(230, 230, 230, 0.6);
--light-border: rgba(230, 230, 230, 0.7);
--light-border-hover: rgba(230, 230, 230, 0.8);
Expand Down Expand Up @@ -284,7 +283,6 @@
--caption-background-hover: var(--light-caption-background-hover);
--element-background-alpha: var(--light-element-background-alpha);
--element-background: var(--light-element-background);
--element-modal-background: var(--light-element-modal-background-color);
--element-background-hover: var(--light-element-background-hover);
--element-border-alpha: var(--light-element-border-alpha);
--element-border: var(--light-element-border);
Expand Down Expand Up @@ -336,7 +334,6 @@
--caption-background-hover: var(--dark-caption-background-hover);
--element-background-alpha: var(--dark-element-background-alpha);
--element-background: var(--dark-element-background);
--element-modal-background: var(--element-background);
--element-background-hover: var(--dark-element-background-hover);
--element-border-alpha: var(--dark-element-border-alpha);
--element-border: var(--dark-element-border);
Expand Down
8 changes: 5 additions & 3 deletions public/css/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2261,7 +2261,8 @@ body:not(.singular) .post-header .post-meta>* {
height: 100vh;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, .8);
background-color: var(--dark-page-color-alpha);
cursor: pointer;

display: none;
justify-content: center;
Expand All @@ -2273,8 +2274,9 @@ body:not(.singular) .post-header .post-meta>* {
min-height: 66%;
min-width: 66%;
border-radius: 15px;
background-color: var(--element-modal-background);
box-shadow: 0 0 60px black;
background-color: var(--page-color);
box-shadow: 0px 5px 20px -2px var(--input-shadow-alpha);
cursor: default;
}

.el-modal > .el-add {
Expand Down
0 public/img/icons/calandar-icon-100x100.png → public/img/icons/calandar-icon-dsc.png
View file
File renamed without changes
Binary file added public/img/icons/calandar-icon-lsc.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
0 public/img/icons/transport-icon-100x100.png → public/img/icons/transport-icon-dsc.png
View file
File renamed without changes
Binary file added public/img/icons/transport-icon-lsc.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
0 public/img/icons/weather-icon-100x100.png → public/img/icons/weather-icon-dsc.png
View file
File renamed without changes
Binary file added public/img/icons/weather-icon-lsc.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
28 changes: 14 additions & 14 deletions public/js/app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -384,22 +384,22 @@ child.push( async function () {
}
}

} );

let elModalCloses = document.querySelectorAll(".el-modal-close");

elModalCloses.forEach((elModalClose) => {
elModalClose.addEventListener('click', () => {
document.querySelectorAll('.el-modal-bg').forEach((elModal) => {
elModal.style.display = 'none';
document.getElementById('site-header').style.display = 'flex';
/*TODO: quit when clicking the little 'x' or outside the modal window */
let elModalCloses = document.querySelectorAll(".el-modal-close");

elModalCloses.forEach((elModalClose) => {
elModalClose.addEventListener('click', () => {
document.querySelectorAll('.el-modal-bg').forEach((elModal) => {
elModal.style.display = 'none';
document.getElementById('site-header').style.display = 'flex';
});
});
});
});

document.getElementById("el-utility-edt").onclick = () => {
document.getElementById("el-modal-edt").style.display = "flex";
document.getElementById('site-header').style.display = 'none';
};
document.getElementById("el-utility-edt").onclick = () => {
document.getElementById("el-modal-edt").style.display = "flex";
document.getElementById('site-header').style.display = 'none';
};
} );

child.run();
10 changes: 5 additions & 5 deletions views/home.ejs
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<%- include('includes/head') %>

<body class="home color-scheme-auto singular header-adaptative header-auto-hide color-scheme-dark">
<body class="home color-scheme-auto singular header-adaptative header-auto-hide color-scheme-light">
<%- include('includes/header') %>

<main id="site-content">
Expand All @@ -10,21 +10,21 @@
<ul class="element el-utilities">
<li class="element el-utility">
<a id="el-utility-edt" href="javascript:void(0);">
<img class="el-utility-content" src="img/icons/calandar-icon-100x100.png" alt="calandar" width="30" height="30">
<img class="el-utility-content" src="img/icons/calandar-icon-dsc.png" alt="calandar" width="30" height="30">
<h2 class="el-utility-content">EDT</h2>
</a>
</li>

<li class="element el-utility">
<a href="javascript:void(0);">
<img class="el-utility-content" src="img/icons/weather-icon-100x100.png" alt="cloud with sun in background" width="30" height="30"/>
<img class="el-utility-content" src="img/icons/weather-icon-dsc.png" alt="cloud with sun in background" width="30" height="30"/>
<h2 class="el-utility-content">METEO</h2>
</a>
</li>

<li class="element el-utility">
<a href="javascript:void(0);">
<img class="el-utility-content" src="img/icons/transport-icon-100x100.png" alt="face view of a tram" width="30" height="30">
<img class="el-utility-content" src="img/icons/transport-icon-dsc.png" alt="face view of a tram" width="30" height="30">
<h2 class="el-utility-content">TRAJET</h2>
</a>
</li>
Expand Down Expand Up @@ -66,7 +66,7 @@

<div class="el-modal-bg" id="el-modal-edt">
<div class ="el-modal element">
<span class="el-modal-close">&times;</span>
<a href="javascript:void(0);" class="el-modal-close">&times;</a>
<div class="el-add">
<div id="edt-container">
<div id="edt-form">
Expand Down

0 comments on commit 624fd81

Please sign in to comment.