edit: favicon change de couleur à l'ouverture ^^

This commit is contained in:
2026-07-03 18:38:03 +02:00
parent 126d3f81b9
commit a5e64c49e5
4 changed files with 84 additions and 5 deletions
+2 -2
View File
@@ -3,7 +3,7 @@
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/svg" href="./src/assets/favicon.svg" />
<link rel="icon" type="image/svg" href="" />
<title>L(. O.)L</title>
</head>
<body>
@@ -12,7 +12,7 @@
<div class="uiStyle" id="topBar">
<div class="left">
<img src="./src/assets/logo/logo-contreforme.svg" class="icon" id="mainLogo">
<p>L<strong>O</strong>L</p>
<p>L<strong></strong>L</p>
</div>
<div class="right">
<a href="#" name="git" class="textBtnStyle">Git</a>
+2 -2
View File
@@ -61,14 +61,14 @@
inkscape:pagecheckerboard="1"
inkscape:deskcolor="#d1d1d1" />
<rect
style="opacity:1;fill:#000000;fill-opacity:1;stroke:#fff600;stroke-width:5.58135;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
style="opacity:1;fill:#000000;fill-opacity:1;stroke:#ffff4d;stroke-width:5.58135;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect4542"
width="88.88665"
height="88.88665"
x="2.7906749"
y="2.7906749" />
<circle
style="opacity:1;fill:#ffff00;fill-opacity:1;stroke:none;stroke-width:33.0659;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
style="opacity:1;fill:#ffff4d;fill-opacity:1;stroke:none;stroke-width:33.0659;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="circle868"
cx="47.234001"
cy="47.234001"

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 2.3 KiB

+76
View File
@@ -0,0 +1,76 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
id="svg2"
version="1.1"
inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
width="94.468002"
height="94.468002"
viewBox="0 0 94.468002 94.468003"
sodipodi:docname="favicon.svg"
inkscape:export-filename="logo.png"
inkscape:export-xdpi="130.08"
inkscape:export-ydpi="130.08"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:dc="http://purl.org/dc/elements/1.1/">
<metadata
id="metadata8">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title />
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs6" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1341"
inkscape:window-height="927"
id="namedview4"
showgrid="false"
inkscape:zoom="4.8680853"
inkscape:cx="38.824299"
inkscape:cy="53.306379"
inkscape:current-layer="svg2"
inkscape:window-x="56"
inkscape:window-y="50"
inkscape:window-maximized="0"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
inkscape:showpageshadow="0"
inkscape:pagecheckerboard="1"
inkscape:deskcolor="#d1d1d1" />
<rect
style="opacity:1;fill:#000000;fill-opacity:1;stroke:#00ff44;stroke-width:5.58135;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect4542"
width="88.88665"
height="88.88665"
x="2.7906749"
y="2.7906749" />
<circle
style="opacity:1;fill:#00ff44;fill-opacity:1;stroke:none;stroke-width:33.0659;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="circle868"
cx="47.234001"
cy="47.234001"
r="16.613539" />
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

+4 -1
View File
@@ -50,9 +50,12 @@
methods: {
updateVisibleStatus(){
let currentTheme = this.lolCurrentStatus ? 'open' : 'closed';
console.log(currentTheme);
let pageIcon = document.querySelector('link');
//console.log(currentTheme);
console.log(pageIcon.href);
this.statusText = this.lolCurrentStatus ? 'OUVERT !' : 'FERMÉ...';
document.documentElement.setAttribute('data-theme' , currentTheme);
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';
}
},