Skip to content
GitLab
Explorer
Connexion
Navigation principale
Rechercher ou aller à…
Projet
perso
Gestion
Activité
Membres
Labels
Programmation
Tickets
Tableaux des tickets
Jalons
Wiki
Wiki externe
Code
Requêtes de fusion
Dépôt
Branches
Validations
Étiquettes
Graphe du dépôt
Comparer les révisions
Extraits de code
Compilation
Pipelines
Jobs
Planifications de pipeline
Artéfacts
Déploiement
Releases
Registre de paquets
Registre de conteneurs
Registre de modèles
Opération
Environnements
Modules Terraform
Surveillance
Incidents
Analyse
Données d'analyse des chaînes de valeur
Analyse des contributeurs
Données d'analyse CI/CD
Données d'analyse du dépôt
Expériences du modèle
Aide
Aide
Support
Documentation de GitLab
Comparer les forfaits GitLab
Forum de la communauté GitLab
Contribuer à GitLab
Donner votre avis
Raccourcis clavier
?
Extraits de code
Groupes
Projets
Afficher davantage de fils d'Ariane
salixor
perso
Validations
844a7625
Vérifiée
Valider
844a7625
rédigé
Il y a 1 an
par
salixor
Parcourir les fichiers
Options
Téléchargements
Correctifs
Plain Diff
Rafraichissement du changeur de thème
parent
07419c6d
Aucune branche associée trouvée
Aucune étiquette associée trouvée
Aucune requête de fusion associée trouvée
Modifications
4
Afficher les modifications d'espaces
En ligne
Côte à côte
Affichage de
4 fichiers modifiés
cours-ensiie.html
+4
-9
4 ajouts, 9 suppressions
cours-ensiie.html
index.html
+4
-9
4 ajouts, 9 suppressions
index.html
lightsoff.js
+36
-13
36 ajouts, 13 suppressions
lightsoff.js
styles.css
+14
-19
14 ajouts, 19 suppressions
styles.css
avec
58 ajouts
et
50 suppressions
cours-ensiie.html
+
4
−
9
Voir le fichier @
844a7625
...
...
@@ -30,15 +30,10 @@
<div
class=
"description"
>
Au fond, je suis un peu un weeb.
</div>
</a>
<div
class=
"floating_links"
>
<button
type=
"button"
class=
"theme_toggle"
onclick=
"toggleLights(this)"
data-dark=
"⚬"
data-light=
"☀"
title=
"Changer de thème"
>
{LIGHT SWITCHER}
</button>
</div>
<button
type=
"button"
class=
"theme_toggle"
onclick=
"toggleLights(this)"
title=
"Changer de thème"
>
<svg
id=
"theme-toggle-light"
width=
"40"
height=
"40"
viewBox=
"0 0 40 40"
fill=
"currentColor"
xmlns=
"http://www.w3.org/2000/svg"
><text
x=
"7"
y=
"32"
>
☀
</text></svg>
<svg
id=
"theme-toggle-dark"
width=
"40"
height=
"40"
viewBox=
"0 0 40 40"
fill=
"currentColor"
xmlns=
"http://www.w3.org/2000/svg"
><text
x=
"7"
y=
"32"
>
⚬
</text></svg>
</button>
</header>
<section
class=
"header_links"
>
...
...
Ce diff est replié.
Cliquez pour l'agrandir.
index.html
+
4
−
9
Voir le fichier @
844a7625
...
...
@@ -30,15 +30,10 @@
<div
class=
"description"
>
Au fond, je suis un peu un weeb.
</div>
</a>
<div
class=
"floating_links"
>
<button
type=
"button"
class=
"theme_toggle"
onclick=
"toggleLights(this)"
data-dark=
"⚬"
data-light=
"☀"
title=
"Changer de thème"
>
{LIGHT SWITCHER}
</button>
</div>
<button
type=
"button"
class=
"theme_toggle"
onclick=
"toggleLights(this)"
title=
"Changer de thème"
>
<svg
id=
"theme-toggle-light"
width=
"40"
height=
"40"
viewBox=
"0 0 40 40"
fill=
"currentColor"
xmlns=
"http://www.w3.org/2000/svg"
><text
x=
"7"
y=
"32"
>
☀
</text></svg>
<svg
id=
"theme-toggle-dark"
width=
"40"
height=
"40"
viewBox=
"0 0 40 40"
fill=
"currentColor"
xmlns=
"http://www.w3.org/2000/svg"
><text
x=
"7"
y=
"32"
>
⚬
</text></svg>
</button>
</header>
<section
class=
"header_links"
>
...
...
Ce diff est replié.
Cliquez pour l'agrandir.
lightsoff.js
+
36
−
13
Voir le fichier @
844a7625
const
setElementDisplay
=
(
element
,
display
)
=>
{
element
.
style
.
display
=
display
;
};
const
toggleElementDisplay
=
(
element
)
=>
{
setElementDisplay
(
element
,
element
.
style
.
display
===
"
inline-block
"
?
"
none
"
:
"
inline-block
"
);
};
let
lightDisplay
,
darkDisplay
;
document
.
addEventListener
(
"
DOMContentLoaded
"
,
function
()
{
let
lightsoff
=
getCookie
(
"
lightsoff
"
)
===
"
on
"
;
let
switcher
=
document
.
getElementsByClassName
(
"
theme_toggle
"
)[
0
];
switcher
.
style
.
display
=
"
inline-block
"
;
switcher
.
innerHTML
=
lightsoff
?
switcher
.
dataset
.
light
:
switcher
.
dataset
.
dark
;
const
lightsoff
=
getCookie
(
"
lightsoff
"
)
===
"
on
"
;
setElementDisplay
(
document
.
querySelector
(
"
.theme_toggle
"
),
"
inline-block
"
);
if
(
lightsoff
)
toggleLights
(
switcher
);
lightDisplay
=
document
.
querySelector
(
"
#theme-toggle-light
"
);
darkDisplay
=
document
.
querySelector
(
"
#theme-toggle-dark
"
);
setElementDisplay
(
lightDisplay
,
lightsoff
?
"
inline-block
"
:
"
none
"
);
setElementDisplay
(
darkDisplay
,
!
lightsoff
?
"
inline-block
"
:
"
none
"
);
if
(
lightsoff
)
updateTheme
();
});
function
toggleLights
(
switcher
)
{
let
html_tag
=
document
.
getElementsByTagName
(
"
html
"
)[
0
];
let
is_dark
=
(
html_tag
.
className
===
""
);
const
updateTheme
=
()
=>
{
const
htmlTag
=
document
.
querySelector
(
"
html
"
);
htmlTag
.
classList
.
toggle
(
"
dark
"
);
const
isLightsOff
=
htmlTag
.
classList
.
contains
(
"
dark
"
)
?
"
on
"
:
"
off
"
;
setCookie
(
"
lightsoff
"
,
isLightsOff
,
365
);
};
html_tag
.
className
=
is_dark
?
"
dark
"
:
""
;
switcher
.
innerHTML
=
is_dark
?
switcher
.
dataset
.
light
:
switcher
.
dataset
.
dark
;
setCookie
(
"
lightsoff
"
,
is_dark
?
"
on
"
:
"
off
"
,
365
);
}
const
toggleLights
=
()
=>
{
toggleElementDisplay
(
lightDisplay
);
toggleElementDisplay
(
darkDisplay
);
updateTheme
();
};
Ce diff est replié.
Cliquez pour l'agrandir.
styles.css
+
14
−
19
Voir le fichier @
844a7625
...
...
@@ -192,30 +192,28 @@ section.cours a::after {
/* Styles used for the header of the page */
div
.floating_links
{
float
:
right
;
margin
:
10px
15px
0
0
;
}
button
.theme_toggle
{
display
:
block
;
background
:
none
;
position
:
absolute
;
top
:
0
;
padding
:
15px
0
3px
0
;
right
:
15px
;
cursor
:
pointer
;
outline
:
none
;
border
:
none
;
border-radius
:
5px
;
padding
:
5px
8px
;
color
:
#ffffff
;
font-size
:
8px
;
text-transform
:
uppercase
;
width
:
100%
;
text-align
:
center
;
line-height
:
30
px
;
line-height
:
24
px
;
font-size
:
30px
;
display
:
none
;
border-radius
:
0
0
30px
30px
;
border
:
2px
dashed
transparent
;
border-top
:
none
;
}
button
.theme_toggle
{
background-color
:
#333333
;
display
:
none
;
margin-bottom
:
5px
;
}
button
.theme_toggle
:hover
{
background-color
:
#505050
;
}
button
.theme_toggle
{
color
:
#000
;
background-color
:
#e6e6e6
;
}
button
.theme_toggle
:hover
{
color
:
#252850
;
border-color
:
#252850
;
}
html
.dark
button
.theme_toggle
{
color
:
#fff
;
background-color
:
#222
;
}
html
.dark
button
.theme_toggle
:hover
{
color
:
orange
;
border-color
:
orange
;
}
/* Files list */
...
...
@@ -286,9 +284,6 @@ html.dark, html.dark body {
color
:
#ffffff
;
}
html
.dark
button
.theme_toggle
{
background-color
:
#FFFFFF
;
color
:
#333333
;
}
html
.dark
button
.theme_toggle
:hover
{
background-color
:
#DEDEDE
;
color
:
#333333
;
}
html
.dark
a
{
color
:
#ccc
;
}
html
.dark
a
:hover
{
color
:
#999
;
}
html
.dark
a
:active
{
color
:
#bbb
;
}
...
...
Ce diff est replié.
Cliquez pour l'agrandir.
Aperçu
0%
Chargement en cours
Veuillez réessayer
ou
joindre un nouveau fichier
.
Annuler
You are about to add
0
people
to the discussion. Proceed with caution.
Terminez d'abord l'édition de ce message.
Enregistrer le commentaire
Annuler
Veuillez vous
inscrire
ou vous
se connecter
pour commenter