test: add svg

theomorphic · Mar 25, 2024 · 6166049 · 6166049
1 parent d20697e
commit 6166049
Show file tree

Hide file tree

Showing 10 changed files with 16 additions and 10 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+ "liveServer.settings.port": 5501
+}
diff --git a/img/emotions/looking.png b/img/emotions/looking.png
diff --git a/img/emotions/looking.svg b/img/emotions/looking.svg
diff --git a/img/emotions/normal.png b/img/emotions/normal.png
diff --git a/img/emotions/normal.svg b/img/emotions/normal.svg
diff --git a/img/emotions/wondering.png b/img/emotions/wondering.png
diff --git a/img/emotions/wondering.svg b/img/emotions/wondering.svg
diff --git a/js/script.js b/js/script.js
@@ -4,9 +4,9 @@ const mainFace = document.getElementById("mainFace");
 const body = document.getElementById("body");
 
 (function(){
- // setTimeout(() => {
- //  mainFace.style.backgroundImage = "url(../img/emotions/wondering.png)";
- // }, 2500);
+ setTimeout(() => {
+ mainFace.style.backgroundImage = "url(../img/emotions/wondering.svg)";
+ }, 2500);
  setTimeout(() => {
  body.classList.remove("start");
  mainFace.classList.remove("start");
@@ -15,7 +15,7 @@ const body = document.getElementById("body");
  console.log("%cHe's laid-back and ready to talk",
  "color: #1e7062; font-size: 14px")
  }, 4000);
- // setTimeout(() => {
- //  mainFace.style.backgroundImage = "";
- // }, 5000);
+ setTimeout(() => {
+ mainFace.style.backgroundImage = "";
+ }, 5000);
 })();
diff --git a/scss/style.css b/scss/style.css
@@ -22,7 +22,7 @@ body {
 }
 
 .mainFace {
- background-image: url(../img/emotions/normal.png);
+ background-image: url(../img/emotions/normal.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 250px;
@@ -34,7 +34,7 @@ body {
 }
 
 .mainFace:hover {
- background-image: url(../img/emotions/looking.png);
+ background-image: url(../img/emotions/looking.svg);
  animation: none;
 }
 

diff --git a/scss/style.scss b/scss/style.scss
@@ -17,7 +17,7 @@ body{
 
 
 .mainFace{
- background-image: url(../img/emotions/normal.png);
+ background-image: url(../img/emotions/normal.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 250px; 
@@ -32,7 +32,7 @@ body{
 
 
 .mainFace:hover{
- background-image: url(../img/emotions/looking.png);
+ background-image: url(../img/emotions/looking.svg);
  animation: none;
 }