diff --git a/package.json b/package.json
index aca6d858b1..d69fc49ae5 100644
--- a/package.json
+++ b/package.json
@@ -126,7 +126,6 @@
]
},
"devDependencies": {
- "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
"@types/dompurify": "^3.0.2",
"@typescript-eslint/eslint-plugin": "^5.0.0",
"@typescript-eslint/parser": "^5.41.0",
diff --git a/src/App.css b/src/App.css
index 3ba0679a49..ff7d1c142e 100644
--- a/src/App.css
+++ b/src/App.css
@@ -620,4 +620,4 @@ small {
::-webkit-scrollbar {
width: 25px;
-}
\ No newline at end of file
+}
diff --git a/src/common/home/home.css b/src/common/home/home.css
index 687f03a5ad..17337fea65 100644
--- a/src/common/home/home.css
+++ b/src/common/home/home.css
@@ -728,7 +728,7 @@
.heart-handshake {
opacity: 0;
transition: all 0.2s ease-in-out;
- position: absolute;
+ position: absolute;
left: 15rem;
}
}
diff --git a/src/common/playlists/PlayThumbnail.jsx b/src/common/playlists/PlayThumbnail.jsx
index 0fbcfb3b8c..cf8bba9e91 100644
--- a/src/common/playlists/PlayThumbnail.jsx
+++ b/src/common/playlists/PlayThumbnail.jsx
@@ -1,7 +1,6 @@
import { useState, useEffect } from 'react';
import { Link } from 'react-router-dom';
import { BsPlayCircleFill } from 'react-icons/bs';
-import thumbPlay from 'images/thumb-play.png';
import Shimmer from 'react-shimmer-effect';
import userImage from 'images/user.png';
import Like from 'common/components/Like/Like';
diff --git a/src/plays/2048/Game2048Styles/game.css b/src/plays/2048/Game2048Styles/game.css
index dc348227ea..5326ebd148 100644
--- a/src/plays/2048/Game2048Styles/game.css
+++ b/src/plays/2048/Game2048Styles/game.css
@@ -6,9 +6,13 @@
position: absolute;
left: 36rem;
top: 11rem;
- box-shadow: 1.9px 2.6px 9.6px rgb(0 0 0 / 7%), 4.6px 6.3px 18.2px rgb(0 0 0 / 10%),
- 8.6px 11.8px 25.8px rgb(0 0 0 / 12%), 15.4px 21px 32.8px rgb(0 0 0 / 14%),
- 28.8px 39.3px 41.4px rgb(0 0 0 / 17%), 69px 94px 80px rgb(0 0 0 / 24%);
+ box-shadow:
+ 1.9px 2.6px 9.6px rgb(0 0 0 / 7%),
+ 4.6px 6.3px 18.2px rgb(0 0 0 / 10%),
+ 8.6px 11.8px 25.8px rgb(0 0 0 / 12%),
+ 15.4px 21px 32.8px rgb(0 0 0 / 14%),
+ 28.8px 39.3px 41.4px rgb(0 0 0 / 17%),
+ 69px 94px 80px rgb(0 0 0 / 24%);
}
.twenty-forty-eight-row {
diff --git a/src/plays/analog-clock/AnalogClock.css b/src/plays/analog-clock/AnalogClock.css
index 9015d88355..807f48c6f8 100644
--- a/src/plays/analog-clock/AnalogClock.css
+++ b/src/plays/analog-clock/AnalogClock.css
@@ -12,7 +12,10 @@
border-radius: 50%;
position: relative;
background-color: #3d3d3d;
- box-shadow: inset 0px 6px 0px 2px #646262, -4px 4px 1px 0px #959393, 0px 0px 1px 2px #959393,
+ box-shadow:
+ inset 0px 6px 0px 2px #646262,
+ -4px 4px 1px 0px #959393,
+ 0px 0px 1px 2px #959393,
-4px 4px 7px 1px #434343;
}
.clock::after {
@@ -24,7 +27,9 @@
top: 49%;
left: 49%;
border-radius: 50%;
- box-shadow: 0px 0px 0px 4px #a3a1a1, 0px 0px 0px 5px #9d9d9d;
+ box-shadow:
+ 0px 0px 0px 4px #a3a1a1,
+ 0px 0px 0px 5px #9d9d9d;
}
.hour-hand {
width: 10px;
diff --git a/src/plays/basic-calculator/styles.css b/src/plays/basic-calculator/styles.css
index 0792a1ee5c..14b635099e 100644
--- a/src/plays/basic-calculator/styles.css
+++ b/src/plays/basic-calculator/styles.css
@@ -17,7 +17,9 @@
border: 0;
outline: 0;
border-radius: 10px;
- box-shadow: -8px -8px 15px rgba(255, 255, 255, 0.1), 5px 5px 15px rgba(0, 0, 0, 0.2);
+ box-shadow:
+ -8px -8px 15px rgba(255, 255, 255, 0.1),
+ 5px 5px 15px rgba(0, 0, 0, 0.2);
background: white;
}
.calculator_grid > button:hover,
diff --git a/src/plays/codenchill/features/DisplayTrackControls/TrackControlSlice.js b/src/plays/codenchill/features/DisplayTrackControls/TrackControlSlice.js
index dfcdeb76e1..7c34d85a57 100644
--- a/src/plays/codenchill/features/DisplayTrackControls/TrackControlSlice.js
+++ b/src/plays/codenchill/features/DisplayTrackControls/TrackControlSlice.js
@@ -1,4 +1,4 @@
-import { createSlice, current } from '@reduxjs/toolkit';
+import { createSlice } from '@reduxjs/toolkit';
import tracks from '../../data/track';
const initialState = {
diff --git a/src/plays/context-with-real-usecases/contextWithRealUsecases.css b/src/plays/context-with-real-usecases/contextWithRealUsecases.css
index c5afe14938..86ec297467 100644
--- a/src/plays/context-with-real-usecases/contextWithRealUsecases.css
+++ b/src/plays/context-with-real-usecases/contextWithRealUsecases.css
@@ -210,14 +210,20 @@ pre {
padding: 2px 10px;
text-transform: capitalize;
color: #fff;
- box-shadow: 1px 1px rgb(123, 123, 123), 2px 2px 5px rgb(173, 173, 173),
- 5px 5px 10px 0px rgb(134, 134, 134), 7px 7px 15px #ccc;
+ box-shadow:
+ 1px 1px rgb(123, 123, 123),
+ 2px 2px 5px rgb(173, 173, 173),
+ 5px 5px 10px 0px rgb(134, 134, 134),
+ 7px 7px 15px #ccc;
margin: 15px;
}
.context-with-real-usecases .btn-cuisine-modal:active {
transform: translateY(1px);
- box-shadow: 1px 1px rgb(123, 123, 123), 2px 2px 3px rgb(173, 173, 173),
- 3px 3px 5px 0px rgb(134, 134, 134), 4px 4px 10px #ccc;
+ box-shadow:
+ 1px 1px rgb(123, 123, 123),
+ 2px 2px 3px rgb(173, 173, 173),
+ 3px 3px 5px 0px rgb(134, 134, 134),
+ 4px 4px 10px #ccc;
}
@media screen and (max-width: 915px) {
diff --git a/src/plays/cricket-game/components/EndGameScreen.jsx b/src/plays/cricket-game/components/EndGameScreen.jsx
index 2ec6dd551e..3e412b711d 100644
--- a/src/plays/cricket-game/components/EndGameScreen.jsx
+++ b/src/plays/cricket-game/components/EndGameScreen.jsx
@@ -16,7 +16,7 @@ export default function EndGameScreen({ endScreenRef, resultTitle, resultDesc, r
diff --git a/src/plays/cricket-game/game/gameLogic.js b/src/plays/cricket-game/game/gameLogic.js
index 1227dffc58..57fff1177f 100644
--- a/src/plays/cricket-game/game/gameLogic.js
+++ b/src/plays/cricket-game/game/gameLogic.js
@@ -1,4 +1,4 @@
-import { plural, sleep, randomChoice } from './utils.js';
+import { sleep, randomChoice } from './utils.js';
import { COMMENTARY } from './commentary.js';
export class GameState {
@@ -87,7 +87,7 @@ export function hitTheBall(event, ballCentre, shotBallRef) {
shotBallRef.current.classList.add(shotName);
// Reset shot ball's position now
- sleep(1 * 1000).then((resp) => {
+ sleep(1 * 1000).then(() => {
shotBallRef.current.classList.add('invisible');
shotBallRef.current.classList.remove(shotName);
diff --git a/src/plays/cricket-game/styles.css b/src/plays/cricket-game/styles.css
index 5d0d935e7c..dd5fb93a9a 100644
--- a/src/plays/cricket-game/styles.css
+++ b/src/plays/cricket-game/styles.css
@@ -5,8 +5,11 @@
/* The main body of game */
.cricket-home-body {
background-image: url('./assets//cricket-ground.jpg');
- box-shadow: 0px 0px 7px 2px rgba(0, 0, 0, 0.2), 0px 0px 7px 2px rgba(0, 0, 0, 0.2),
- 0px 0px 7px 2px rgba(0, 0, 0, 0.2), 0px 0px 7px 2px rgba(0, 0, 0, 0.2);
+ box-shadow:
+ 0px 0px 7px 2px rgba(0, 0, 0, 0.2),
+ 0px 0px 7px 2px rgba(0, 0, 0, 0.2),
+ 0px 0px 7px 2px rgba(0, 0, 0, 0.2),
+ 0px 0px 7px 2px rgba(0, 0, 0, 0.2);
padding: 0px;
margin: 0px;
@@ -37,7 +40,9 @@
.score,
.info-box,
.commentary-and-timeline {
- box-shadow: 5px 5px 5px rgba(38, 107, 245, 0.3), -5px -5px 5px rgba(114, 239, 253, 0.3);
+ box-shadow:
+ 5px 5px 5px rgba(38, 107, 245, 0.3),
+ -5px -5px 5px rgba(114, 239, 253, 0.3);
}
.score,
diff --git a/src/plays/custommemesgenerator/Custommemesgenerator.css b/src/plays/custommemesgenerator/Custommemesgenerator.css
index a82f1b17b4..234863771d 100644
--- a/src/plays/custommemesgenerator/Custommemesgenerator.css
+++ b/src/plays/custommemesgenerator/Custommemesgenerator.css
@@ -166,8 +166,16 @@
text-transform: uppercase;
color: white;
letter-spacing: 1px;
- text-shadow: 2px 2px 0 #000, -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, 0 2px 0 #000,
- 2px 0 0 #000, 0 -2px 0 #000, -2px 0 0 #000, 2px 2px 5px #000;
+ text-shadow:
+ 2px 2px 0 #000,
+ -2px -2px 0 #000,
+ 2px -2px 0 #000,
+ -2px 2px 0 #000,
+ 0 2px 0 #000,
+ 2px 0 0 #000,
+ 0 -2px 0 #000,
+ -2px 0 0 #000,
+ 2px 2px 5px #000;
}
@media screen and (max-width: 400px) {
diff --git a/src/plays/custommemesgenerator/Custommemesgenerator.jsx b/src/plays/custommemesgenerator/Custommemesgenerator.jsx
index 284af0368b..3aefca12cf 100644
--- a/src/plays/custommemesgenerator/Custommemesgenerator.jsx
+++ b/src/plays/custommemesgenerator/Custommemesgenerator.jsx
@@ -1,10 +1,9 @@
-import PlayHeader from 'common/playlists/PlayHeader';
import './Custommemesgenerator.css';
import Header from './Header.jsx';
import Meme from './Meme.jsx';
// WARNING: Do not change the entry componenet name
-function Custommemesgenerator(props) {
+function Custommemesgenerator() {
// Your Code Start below.
return (
diff --git a/src/plays/dad-jokes/components/jokeList/jokeList.css b/src/plays/dad-jokes/components/jokeList/jokeList.css
index 883bcc5c9d..7e2aa9b8e8 100644
--- a/src/plays/dad-jokes/components/jokeList/jokeList.css
+++ b/src/plays/dad-jokes/components/jokeList/jokeList.css
@@ -49,7 +49,9 @@
.dad-jokes-play .jokelist-sidebar-emoji img {
width: 45%;
border-radius: 50%;
- box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.1);
+ box-shadow:
+ 0 19px 38px rgba(0, 0, 0, 0.3),
+ 0 15px 12px rgba(0, 0, 0, 0.1);
}
/*----------------------------New Jokes Button----------------------------*/
@@ -85,7 +87,9 @@
align-self: center;
width: 70%;
overflow: scroll;
- box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.1);
+ box-shadow:
+ 0 19px 38px rgba(0, 0, 0, 0.3),
+ 0 15px 12px rgba(0, 0, 0, 0.1);
}
.dad-jokes-play .dark .jokelist-jokes {
diff --git a/src/plays/dad-jokes/components/singleJoke/SingleJoke.css b/src/plays/dad-jokes/components/singleJoke/SingleJoke.css
index 3b21800c2e..476d1e437d 100644
--- a/src/plays/dad-jokes/components/singleJoke/SingleJoke.css
+++ b/src/plays/dad-jokes/components/singleJoke/SingleJoke.css
@@ -39,7 +39,9 @@
font-size: 20px;
font-weight: 300;
border: 3px solid red;
- box-shadow: 0 10px 38px rgba(0, 0, 0, 0.2), 0 10px 12px rgba(0, 0, 0, 0.1);
+ box-shadow:
+ 0 10px 38px rgba(0, 0, 0, 0.2),
+ 0 10px 12px rgba(0, 0, 0, 0.1);
color: #0d0d0d;
}
@@ -81,7 +83,9 @@
font-size: 3rem;
margin-left: auto;
border-radius: 50%;
- box-shadow: 0 10px 38px rgba(0, 0, 0, 0.2), 0 10px 12px rgba(0, 0, 0, 0.1);
+ box-shadow:
+ 0 10px 38px rgba(0, 0, 0, 0.2),
+ 0 10px 12px rgba(0, 0, 0, 0.1);
color: #ffc107;
}
diff --git a/src/plays/dev-jokes/devJokes.css b/src/plays/dev-jokes/devJokes.css
index 0f32cdb3fe..ee9feced5f 100644
--- a/src/plays/dev-jokes/devJokes.css
+++ b/src/plays/dev-jokes/devJokes.css
@@ -46,16 +46,24 @@
text-transform: uppercase;
text-align: center;
text-decoration: none;
- box-shadow: rgba(44, 187, 99, 0.2) 0 -25px 18px -14px inset, rgba(44, 187, 99, 0.15) 0 1px 2px,
- rgba(44, 187, 99, 0.15) 0 2px 4px, rgba(44, 187, 99, 0.15) 0 4px 8px,
- rgba(44, 187, 99, 0.15) 0 8px 16px, rgba(44, 187, 99, 0.15) 0 16px 32px;
+ box-shadow:
+ rgba(44, 187, 99, 0.2) 0 -25px 18px -14px inset,
+ rgba(44, 187, 99, 0.15) 0 1px 2px,
+ rgba(44, 187, 99, 0.15) 0 2px 4px,
+ rgba(44, 187, 99, 0.15) 0 4px 8px,
+ rgba(44, 187, 99, 0.15) 0 8px 16px,
+ rgba(44, 187, 99, 0.15) 0 16px 32px;
position: relative;
}
.dev-jokes-btn:hover {
- box-shadow: rgba(44, 187, 99, 0.35) 0 -25px 18px -14px inset, rgba(44, 187, 99, 0.25) 0 1px 2px,
- rgba(44, 187, 99, 0.25) 0 2px 4px, rgba(44, 187, 99, 0.25) 0 4px 8px,
- rgba(44, 187, 99, 0.25) 0 8px 16px, rgba(44, 187, 99, 0.25) 0 16px 32px;
+ box-shadow:
+ rgba(44, 187, 99, 0.35) 0 -25px 18px -14px inset,
+ rgba(44, 187, 99, 0.25) 0 1px 2px,
+ rgba(44, 187, 99, 0.25) 0 2px 4px,
+ rgba(44, 187, 99, 0.25) 0 4px 8px,
+ rgba(44, 187, 99, 0.25) 0 8px 16px,
+ rgba(44, 187, 99, 0.25) 0 16px 32px;
transform: scale(1.05) rotate(-1deg);
}
@media screen and (max-width: 764px) {
diff --git a/src/plays/digital-delight/components/CategoryFact.jsx b/src/plays/digital-delight/components/CategoryFact.jsx
index 8ed3c8c5dd..96d8080ee4 100644
--- a/src/plays/digital-delight/components/CategoryFact.jsx
+++ b/src/plays/digital-delight/components/CategoryFact.jsx
@@ -8,7 +8,7 @@ import './Categoryfact.css';
function CategoryFact() {
const [fact, setFact] = useState(CategoryFacts);
- const [error, setError] = useState('');
+ // const [error, setError] = useState('');
const [selectedVoice, setSelectedVoice] = useState('Zira');
const [showSelecter, setShowSelecter] = useState(false);
const speechHandler = (msg) => {
@@ -42,7 +42,7 @@ function CategoryFact() {
speechHandler(new SpeechSynthesisUtterance(data.number + ' is ' + data.text));
setShowSelecter(true);
} catch (error) {
- setError('Error fetching fact. Please try again later.');
+ // setError('Error fetching fact. Please try again later.');
}
};
diff --git a/src/plays/digital-delight/components/Categoryfact.css b/src/plays/digital-delight/components/Categoryfact.css
index 8bf147f85b..484d17bd17 100644
--- a/src/plays/digital-delight/components/Categoryfact.css
+++ b/src/plays/digital-delight/components/Categoryfact.css
@@ -82,8 +82,18 @@
.tooltip {
position: relative;
- font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu,
- Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+ font-family:
+ system-ui,
+ -apple-system,
+ BlinkMacSystemFont,
+ 'Segoe UI',
+ Roboto,
+ Oxygen,
+ Ubuntu,
+ Cantarell,
+ 'Open Sans',
+ 'Helvetica Neue',
+ sans-serif;
color: rgb(106, 101, 94);
font-size: 18px;
padding: 5px;
diff --git a/src/plays/digital-delight/components/Modal.css b/src/plays/digital-delight/components/Modal.css
index f1902e2f58..adfd0f322f 100644
--- a/src/plays/digital-delight/components/Modal.css
+++ b/src/plays/digital-delight/components/Modal.css
@@ -179,7 +179,9 @@
cursor: pointer;
will-change: box-shadow, transform;
background: radial-gradient(100% 100% at 100% 0%, #89e5ff 0%, #5468ff 100%);
- box-shadow: 0px 2px 4px rgb(45 35 66 / 40%), 0px 7px 13px -3px rgb(45 35 66 / 30%),
+ box-shadow:
+ 0px 2px 4px rgb(45 35 66 / 40%),
+ 0px 7px 13px -3px rgb(45 35 66 / 30%),
inset 0px -3px 0px rgb(58 65 111 / 50%);
padding: 0 32px;
border-radius: 6px;
@@ -187,11 +189,15 @@
height: 48px;
font-size: 18px;
text-shadow: 0 1px 0 rgb(0 0 0 / 40%);
- transition: box-shadow 0.15s ease, transform 0.15s ease;
+ transition:
+ box-shadow 0.15s ease,
+ transform 0.15s ease;
}
.digits-delight-modal .content .button-section button :hover {
- box-shadow: 0px 4px 8px rgb(45 35 66 / 40%), 0px 7px 13px -3px rgb(45 35 66 / 30%),
+ box-shadow:
+ 0px 4px 8px rgb(45 35 66 / 40%),
+ 0px 7px 13px -3px rgb(45 35 66 / 30%),
inset 0px -3px 0px #3c4fe0;
transform: translateY(-2px);
}
diff --git a/src/plays/digital-delight/components/Modal.jsx b/src/plays/digital-delight/components/Modal.jsx
index b734a1a88f..f6b14066ff 100644
--- a/src/plays/digital-delight/components/Modal.jsx
+++ b/src/plays/digital-delight/components/Modal.jsx
@@ -7,7 +7,7 @@ import { MdClose } from 'react-icons/md';
const Modal = ({ showModal, toggle }) => {
const [currState, setCurrentState] = useState(0);
- const data = structuringData[currState];
+ // const data = structuringData[currState];
useEffect(() => {
setCurrentState(0);
diff --git a/src/plays/digital-delight/components/TextFact.css b/src/plays/digital-delight/components/TextFact.css
index f3574c9796..6d4b6fd37a 100644
--- a/src/plays/digital-delight/components/TextFact.css
+++ b/src/plays/digital-delight/components/TextFact.css
@@ -11,7 +11,9 @@
color: #ff4742;
background: 0 0;
padding: 8px;
- box-shadow: rgba(0, 0, 0, 0.07) 0px 2px 4px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1.5px 0px;
+ box-shadow:
+ rgba(0, 0, 0, 0.07) 0px 2px 4px 0px,
+ rgba(0, 0, 0, 0.05) 0px 1px 1.5px 0px;
font-weight: 800;
font-size: 16px;
height: 42px;
@@ -31,7 +33,9 @@
border-radius: 4px;
padding: 8px 16px;
border: 2px solid transparent;
- box-shadow: rgb(0 0 0 / 12%) 0px 1px 3px, rgb(0 0 0 / 24%) 0px 1px 2px;
+ box-shadow:
+ rgb(0 0 0 / 12%) 0px 1px 3px,
+ rgb(0 0 0 / 24%) 0px 1px 2px;
background: rgb(251, 251, 251);
transition: all 0.1s ease 0s;
}
diff --git a/src/plays/digital-delight/components/Title.jsx b/src/plays/digital-delight/components/Title.jsx
index a2ef9aea20..00779bb36d 100644
--- a/src/plays/digital-delight/components/Title.jsx
+++ b/src/plays/digital-delight/components/Title.jsx
@@ -1,4 +1,3 @@
-import React, { useState } from 'react';
import './Title.css';
function RealTitle() {
diff --git a/src/plays/emoji-game/components/welcome.css b/src/plays/emoji-game/components/welcome.css
index 213d4a9f10..cac34a8eaf 100644
--- a/src/plays/emoji-game/components/welcome.css
+++ b/src/plays/emoji-game/components/welcome.css
@@ -18,7 +18,9 @@
white-space: nowrap; /* Keeps the content on a single line */
margin: 0 auto; /* Gives that scrolling effect as the typing happens */
letter-spacing: 0.15em; /* Adjust as needed */
- animation: typing 3.5s steps(40, end), blink-caret 0.75s step-end infinite;
+ animation:
+ typing 3.5s steps(40, end),
+ blink-caret 0.75s step-end infinite;
}
/* The typing effect */
diff --git a/src/plays/github-user-finder/components/InputCard.css b/src/plays/github-user-finder/components/InputCard.css
index ebc17cc2d5..4348aa3f13 100644
--- a/src/plays/github-user-finder/components/InputCard.css
+++ b/src/plays/github-user-finder/components/InputCard.css
@@ -7,7 +7,9 @@
outline: none;
border-radius: 20px;
background: #ffffff;
- box-shadow: 20px 20px 60px #d9d9d9, -20px -20px 60px #ffffff;
+ box-shadow:
+ 20px 20px 60px #d9d9d9,
+ -20px -20px 60px #ffffff;
}
.guf .search-btn {
@@ -108,19 +110,27 @@
}
.guf .search-btn:hover #leftTop {
- animation: 0.1s ease-in-out 0.05s both changeColor8, 0.2s linear 0.4s both lightEffect8;
+ animation:
+ 0.1s ease-in-out 0.05s both changeColor8,
+ 0.2s linear 0.4s both lightEffect8;
}
.guf .search-btn:hover #rightTop {
- animation: 0.1s ease-in-out 0.15s both changeColor8, 0.2s linear 0.4s both lightEffect8;
+ animation:
+ 0.1s ease-in-out 0.15s both changeColor8,
+ 0.2s linear 0.4s both lightEffect8;
}
.guf .search-btn:hover #rightBottom {
- animation: 0.1s ease-in-out 0.25s both changeColor8, 0.2s linear 0.4s both lightEffect8;
+ animation:
+ 0.1s ease-in-out 0.25s both changeColor8,
+ 0.2s linear 0.4s both lightEffect8;
}
.guf .search-btn:hover #leftBottom {
- animation: 0.1s ease-in-out 0.35s both changeColor8, 0.2s linear 0.4s both lightEffect8;
+ animation:
+ 0.1s ease-in-out 0.35s both changeColor8,
+ 0.2s linear 0.4s both lightEffect8;
}
.guf .search-btn:hover .corner {
diff --git a/src/plays/github-user-finder/styles.css b/src/plays/github-user-finder/styles.css
index 8733bf03e5..b0bbb8cb5e 100644
--- a/src/plays/github-user-finder/styles.css
+++ b/src/plays/github-user-finder/styles.css
@@ -6,7 +6,9 @@
gap: 0.5rem;
border-radius: 20px;
background: #ffffff;
- box-shadow: 20px 20px 60px #d9d9d9, -20px -20px 60px #ffffff;
+ box-shadow:
+ 20px 20px 60px #d9d9d9,
+ -20px -20px 60px #ffffff;
grid-template-columns: repeat(3, auto);
grid-template-areas:
'avatar name joined'
@@ -37,7 +39,9 @@
grid-area: data;
border-radius: 20px;
background: #ffffff;
- box-shadow: 20px 20px 60px #d9d9d9, -20px -20px 60px #ffffff;
+ box-shadow:
+ 20px 20px 60px #d9d9d9,
+ -20px -20px 60px #ffffff;
}
/* click-btn */
diff --git a/src/plays/hangman-game/Readme.md b/src/plays/hangman-game/Readme.md
index 13102f2095..1fb9cf580f 100644
--- a/src/plays/hangman-game/Readme.md
+++ b/src/plays/hangman-game/Readme.md
@@ -1,6 +1,6 @@
# Hangman Game
-Hangman is an old school favorite, a word game where the goal is simply to find the missing word or words. You will be presented with a number of blank spaces representing the missing letters you need to find. Use the keyboard to guess a letter.
+Hangman is an old school favorite, a word game where the goal is simply to find the missing word or words. You will be presented with a number of blank spaces representing the missing letters you need to find. Use the keyboard to guess a letter.
## Play Demographic
@@ -11,30 +11,29 @@ Hangman is an old school favorite, a word game where the goal is simply to find
- User: ANKITy102
- Gihub Link: https://github.com/ANKITy102
-- Blog:
-- Video:
+- Blog:
+- Video:
## Implementation Details
The Hangman game is structured around four major components, each designed for enhanced aesthetics and responsiveness using the Styled Components library:
1. Drawing.tsx
-The Drawing.tsx component plays a crucial role in rendering the visual representation of the Hangman figure as the game progresses. It provides a visual cue to the player regarding their current progress and incorrect guesses.
+ The Drawing.tsx component plays a crucial role in rendering the visual representation of the Hangman figure as the game progresses. It provides a visual cue to the player regarding their current progress and incorrect guesses.
2. Word.tsx
-The Word.tsx component is responsible for managing the user's input and displaying the correct answer. It ensures a seamless interaction between the player's guesses and the hidden word, providing real-time feedback on the correctness of their choices.
+ The Word.tsx component is responsible for managing the user's input and displaying the correct answer. It ensures a seamless interaction between the player's guesses and the hidden word, providing real-time feedback on the correctness of their choices.
3. Keyboard.tsx
-The Keyboard.tsx component is designed to facilitate user input. It presents an interactive keyboard to players, allowing them to select letters as guesses. This component enhances the user experience by making it intuitive and straightforward to make guesses.
+ The Keyboard.tsx component is designed to facilitate user input. It presents an interactive keyboard to players, allowing them to select letters as guesses. This component enhances the user experience by making it intuitive and straightforward to make guesses.
4. Main.tsx
-The Main.tsx component serves as the central hub where all other components are integrated, resulting in the complete Hangman game experience. It orchestrates the flow of the game, including initializing the game state, tracking guessed letters, and determining whether the player has won or lost.
+ The Main.tsx component serves as the central hub where all other components are integrated, resulting in the complete Hangman game experience. It orchestrates the flow of the game, including initializing the game state, tracking guessed letters, and determining whether the player has won or lost.
In addition to these core components, the game relies on a wordList.json file, which contains a collection of hints and words used throughout the gameplay. These hints provide context to players and make the game more engaging and challenging.
This modular and organized structure ensures that the Hangman game is not only enjoyable but also maintainable and extensible, making it an excellent showcase of best practices in React development.
-
## Consideration
Update all considerations(if any)
diff --git a/src/plays/hangman-game/components/Drawing.tsx b/src/plays/hangman-game/components/Drawing.tsx
index a6d75c7df9..45f863efd7 100644
--- a/src/plays/hangman-game/components/Drawing.tsx
+++ b/src/plays/hangman-game/components/Drawing.tsx
@@ -1,5 +1,4 @@
import React from 'react';
-import styled from 'styled-components';
import {
Head,
Body,
diff --git a/src/plays/hangman-game/components/Keyboard.tsx b/src/plays/hangman-game/components/Keyboard.tsx
index 84b1bd5cb8..e3350ae45c 100644
--- a/src/plays/hangman-game/components/Keyboard.tsx
+++ b/src/plays/hangman-game/components/Keyboard.tsx
@@ -1,6 +1,5 @@
import { useEffect } from 'react';
import React from 'react';
-import styled from 'styled-components';
import { KEYS } from '../constants/constants';
import { Key, KeyboardGrid, KeyContainer } from '../styled-components';
diff --git a/src/plays/hangman-game/components/Word.tsx b/src/plays/hangman-game/components/Word.tsx
index b25d22fdf3..c2bb21a937 100644
--- a/src/plays/hangman-game/components/Word.tsx
+++ b/src/plays/hangman-game/components/Word.tsx
@@ -1,5 +1,4 @@
import React from 'react';
-import styled from 'styled-components';
import { Border, LetterComponent, WordContainer } from '../styled-components';
interface WordProps {
diff --git a/src/plays/hangman-game/constants/constants.tsx b/src/plays/hangman-game/constants/constants.tsx
index f2fb8c576f..2179c09ee1 100644
--- a/src/plays/hangman-game/constants/constants.tsx
+++ b/src/plays/hangman-game/constants/constants.tsx
@@ -1,5 +1,3 @@
-import React from 'react';
-
export const KEYS = [
'a',
'b',
diff --git a/src/plays/hangman-game/styled-components.tsx b/src/plays/hangman-game/styled-components.tsx
index dd0f1e6d6a..69243eeeb0 100644
--- a/src/plays/hangman-game/styled-components.tsx
+++ b/src/plays/hangman-game/styled-components.tsx
@@ -17,8 +17,19 @@ export const Container = styled.div`
gap: 2rem;
min-height: 100vh;
max-width: 800px;
- font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell,
- Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
+ font-family:
+ Inter,
+ -apple-system,
+ BlinkMacSystemFont,
+ Segoe UI,
+ Roboto,
+ Oxygen,
+ Ubuntu,
+ Cantarell,
+ Fira Sans,
+ Droid Sans,
+ Helvetica Neue,
+ sans-serif;
position: relative;
padding-bottom: 10px;
@media (min-width: 768px) {
diff --git a/src/plays/hangman-game/styles.css b/src/plays/hangman-game/styles.css
index f314329435..5fd508fa9e 100644
--- a/src/plays/hangman-game/styles.css
+++ b/src/plays/hangman-game/styles.css
@@ -1,2 +1 @@
/* enter stlyes here */
-
diff --git a/src/plays/image-gallery/styles.css b/src/plays/image-gallery/styles.css
index 95e4ecaf39..eccdcc0853 100644
--- a/src/plays/image-gallery/styles.css
+++ b/src/plays/image-gallery/styles.css
@@ -49,7 +49,9 @@
bottom: 5px;
left: 20px;
opacity: 0;
- transition: transform 0.3s ease, opacity 0.3s ease;
+ transition:
+ transform 0.3s ease,
+ opacity 0.3s ease;
}
.know-image-transparent-box {
@@ -109,7 +111,9 @@
transition: all 0.3s ease;
position: relative;
display: inline-block;
- box-shadow: inset 2px 2px 2px 0px rgba(255, 255, 255, 0.5), 7px 7px 20px 0px rgba(0, 0, 0, 0.1),
+ box-shadow:
+ inset 2px 2px 2px 0px rgba(255, 255, 255, 0.5),
+ 7px 7px 20px 0px rgba(0, 0, 0, 0.1),
4px 4px 5px 0px rgba(0, 0, 0, 0.1);
outline: none;
left: 42rem;
@@ -140,7 +144,10 @@
height: 2px;
width: 0;
background: #f0094a;
- box-shadow: -1px -1px 5px 0px #fff, 7px 7px 20px 0px #0003, 4px 4px 5px 0px #0002;
+ box-shadow:
+ -1px -1px 5px 0px #fff,
+ 7px 7px 20px 0px #0003,
+ 4px 4px 5px 0px #0002;
transition: 400ms ease all;
}
diff --git a/src/plays/infinite-scroll-with-debouncing-concept/InfiniteScrollWithDebouncingConcept.jsx b/src/plays/infinite-scroll-with-debouncing-concept/InfiniteScrollWithDebouncingConcept.jsx
index 6dd7f9a10b..0ae09c59b0 100644
--- a/src/plays/infinite-scroll-with-debouncing-concept/InfiniteScrollWithDebouncingConcept.jsx
+++ b/src/plays/infinite-scroll-with-debouncing-concept/InfiniteScrollWithDebouncingConcept.jsx
@@ -34,14 +34,14 @@ function InfiniteScrollWithDebouncingConcept(props) {
return new Promise((resolve, reject) => {
if (apiQuery) {
try {
- const promise = fetch(
+ fetch(
'https://openlibrary.org/search.json?' +
new URLSearchParams({
q: apiQuery,
page: pageNumber
})
).then((res) => {
- const data = res.json().then((data) => {
+ res.json().then((data) => {
resolve();
if (data.docs.length === 0) {
setNoData(true);
diff --git a/src/plays/inspirational-quotes/card.css b/src/plays/inspirational-quotes/card.css
index 3b7d0c3c50..218377a8ae 100644
--- a/src/plays/inspirational-quotes/card.css
+++ b/src/plays/inspirational-quotes/card.css
@@ -8,7 +8,9 @@
text-align: center;
background: #242625;
border-radius: 10px;
- box-shadow: 25px 25px 50px #1b1c1b, -25px -25px 50px #2d302f;
+ box-shadow:
+ 25px 25px 50px #1b1c1b,
+ -25px -25px 50px #2d302f;
}
.card__content {
width: 90%;
@@ -21,7 +23,9 @@
margin: 10px auto;
border-radius: 5px;
padding: 20px;
- box-shadow: 16px 16px 44px #0a0a0a, -16px -16px 44px #282a28;
+ box-shadow:
+ 16px 16px 44px #0a0a0a,
+ -16px -16px 44px #282a28;
transition: 0.3s all ease-in-out;
}
.card__content:hover {
diff --git a/src/plays/markdown-editor/styles.css b/src/plays/markdown-editor/styles.css
index 53a650ed33..40657c6350 100644
--- a/src/plays/markdown-editor/styles.css
+++ b/src/plays/markdown-editor/styles.css
@@ -3,8 +3,18 @@
/* MarkdownEditor.js */
.md-editor.play-details {
background-color: #323031;
- font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu,
- Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+ font-family:
+ system-ui,
+ -apple-system,
+ BlinkMacSystemFont,
+ 'Segoe UI',
+ Roboto,
+ Oxygen,
+ Ubuntu,
+ Cantarell,
+ 'Open Sans',
+ 'Helvetica Neue',
+ sans-serif;
box-sizing: border-box;
}
diff --git a/src/plays/motivate-me/components/cards/index.css b/src/plays/motivate-me/components/cards/index.css
index 0b70de5b60..88391e6806 100644
--- a/src/plays/motivate-me/components/cards/index.css
+++ b/src/plays/motivate-me/components/cards/index.css
@@ -3,7 +3,9 @@
width: 100%;
min-height: 100px;
border-radius: 15px;
- box-shadow: 0 0.4rem 0.8rem -0.1rem rgb(0 32 128 / 10%), 0 0 0 1px #f0f2f7;
+ box-shadow:
+ 0 0.4rem 0.8rem -0.1rem rgb(0 32 128 / 10%),
+ 0 0 0 1px #f0f2f7;
padding: 0 48px;
overflow: hidden;
padding-bottom: 0;
diff --git a/src/plays/motivate-me/components/search-bar/index.css b/src/plays/motivate-me/components/search-bar/index.css
index 7306113588..3b029b08ce 100644
--- a/src/plays/motivate-me/components/search-bar/index.css
+++ b/src/plays/motivate-me/components/search-bar/index.css
@@ -6,7 +6,14 @@
width: 100%;
}
.motivate-me-Dropdown_items {
- font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
+ font-family:
+ -apple-system,
+ BlinkMacSystemFont,
+ Segoe UI,
+ Roboto,
+ Helvetica,
+ Arial,
+ sans-serif;
color: #51526f;
line-height: 1.6;
box-sizing: inherit;
@@ -23,7 +30,10 @@
border: 1px solid #c8cbf2;
overflow: hidden;
border-radius: 4px;
- transition: transform 0.2s, opacity 0.2s, visibility 0.2s;
+ transition:
+ transform 0.2s,
+ opacity 0.2s,
+ visibility 0.2s;
opacity: 0;
transform: rotateX(-20deg) scale(0.97);
will-change: transform;
@@ -32,7 +42,14 @@
.motivate-me-Dropdown_items {
tab-size: 4;
- font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
+ font-family:
+ -apple-system,
+ BlinkMacSystemFont,
+ Segoe UI,
+ Roboto,
+ Helvetica,
+ Arial,
+ sans-serif;
color: #51526f;
line-height: 1.6;
visibility: hidden;
@@ -56,7 +73,10 @@
font-weight: 700;
font-size: 17px;
padding: 8px 16px;
- transition: background 0.12s, color 0.12s, border-color 0.12s;
+ transition:
+ background 0.12s,
+ color 0.12s,
+ border-color 0.12s;
outline: 0;
cursor: pointer;
display: flex;
@@ -91,7 +111,9 @@
font-size: 18px;
cursor: pointer;
color: inherit;
- transition: background 0.1s, color 0.1s;
+ transition:
+ background 0.1s,
+ color 0.1s;
}
.motivate-me-Dropdown_items li:hover {
background: linear-gradient(130deg, #fdc5b8, #fdc5b8);
diff --git a/src/plays/multiplayer-tic-tac-toe/MultiplayerTicTacToe.tsx b/src/plays/multiplayer-tic-tac-toe/MultiplayerTicTacToe.tsx
index 264cbd32b8..90d8fabbd0 100644
--- a/src/plays/multiplayer-tic-tac-toe/MultiplayerTicTacToe.tsx
+++ b/src/plays/multiplayer-tic-tac-toe/MultiplayerTicTacToe.tsx
@@ -20,7 +20,6 @@ function MultiplayerTicTacToe(props: any) {
const [isCross, setIsCross] = useState(true);
const [isFinished, setIsFinished] = useState(false);
const [finalMessage, setFinalMessage] = useState('');
- let count = 0;
// ! Game Logic
const findWinner = () => {
diff --git a/src/plays/object-detector/ObjectDetector.jsx b/src/plays/object-detector/ObjectDetector.jsx
index 3223acd92c..b898502293 100644
--- a/src/plays/object-detector/ObjectDetector.jsx
+++ b/src/plays/object-detector/ObjectDetector.jsx
@@ -1,6 +1,5 @@
import PlayHeader from 'common/playlists/PlayHeader';
import React, { useRef, useEffect } from 'react';
-import * as tf from '@tensorflow/tfjs';
import * as cocossd from '@tensorflow-models/coco-ssd';
import Webcam from 'react-webcam';
diff --git a/src/plays/pokemon-stats/components/pokecard.css b/src/plays/pokemon-stats/components/pokecard.css
index 19015f5e36..0b8a1dd700 100644
--- a/src/plays/pokemon-stats/components/pokecard.css
+++ b/src/plays/pokemon-stats/components/pokecard.css
@@ -77,7 +77,9 @@
background-color: #fcfcfd;
border-radius: 4px;
border-width: 0;
- box-shadow: rgba(45, 35, 66, 0.4) 0 2px 4px, rgba(45, 35, 66, 0.3) 0 7px 13px -3px,
+ box-shadow:
+ rgba(45, 35, 66, 0.4) 0 2px 4px,
+ rgba(45, 35, 66, 0.3) 0 7px 13px -3px,
#d6d6e7 0 -3px 0 inset;
box-sizing: border-box;
color: #36395a;
diff --git a/src/plays/pokemon-stats/components/search.css b/src/plays/pokemon-stats/components/search.css
index cdf465c728..4704d499d7 100644
--- a/src/plays/pokemon-stats/components/search.css
+++ b/src/plays/pokemon-stats/components/search.css
@@ -71,7 +71,9 @@
background-color: #fcfcfd;
border-radius: 4px;
border-width: 0;
- box-shadow: rgba(45, 35, 66, 0.4) 0 2px 4px, rgba(45, 35, 66, 0.3) 0 7px 13px -3px,
+ box-shadow:
+ rgba(45, 35, 66, 0.4) 0 2px 4px,
+ rgba(45, 35, 66, 0.3) 0 7px 13px -3px,
#d6d6e7 0 -3px 0 inset;
box-sizing: border-box;
color: #36395a;
@@ -86,7 +88,9 @@
position: relative;
text-align: center;
text-decoration: none;
- transition: box-shadow 0.15s, transform 0.15s;
+ transition:
+ box-shadow 0.15s,
+ transform 0.15s;
user-select: none;
-webkit-user-select: none;
touch-action: manipulation;
@@ -96,12 +100,17 @@
}
.poke-stats-sumbit-btn:focus {
- box-shadow: #d6d6e7 0 0 0 1.5px inset, rgba(45, 35, 66, 0.4) 0 2px 4px,
- rgba(45, 35, 66, 0.3) 0 7px 13px -3px, #d6d6e7 0 -3px 0 inset;
+ box-shadow:
+ #d6d6e7 0 0 0 1.5px inset,
+ rgba(45, 35, 66, 0.4) 0 2px 4px,
+ rgba(45, 35, 66, 0.3) 0 7px 13px -3px,
+ #d6d6e7 0 -3px 0 inset;
}
.poke-stats-sumbit-btn:hover {
- box-shadow: rgba(45, 35, 66, 0.4) 0 4px 8px, rgba(45, 35, 66, 0.3) 0 7px 13px -3px,
+ box-shadow:
+ rgba(45, 35, 66, 0.4) 0 4px 8px,
+ rgba(45, 35, 66, 0.3) 0 7px 13px -3px,
#d6d6e7 0 -3px 0 inset;
transform: translateY(-2px);
}
diff --git a/src/plays/quizeo/components/questions/questions.styles.css b/src/plays/quizeo/components/questions/questions.styles.css
index 0f226ffcfa..2ae43a1a89 100644
--- a/src/plays/quizeo/components/questions/questions.styles.css
+++ b/src/plays/quizeo/components/questions/questions.styles.css
@@ -46,7 +46,9 @@
background-color: #d8e2f7;
margin-top: 2rem;
border-radius: 0.75rem;
- box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+ box-shadow:
+ 0 10px 15px -3px rgba(0, 0, 0, 0.1),
+ 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}
.quizeo .question-title {
@@ -81,7 +83,9 @@
width: 13rem;
border-radius: 9999px;
cursor: pointer;
- box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+ box-shadow:
+ 0 10px 15px -3px rgba(0, 0, 0, 0.1),
+ 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}
.quizeo .option-button:hover {
diff --git a/src/plays/quizeo/pages/score-page/score.styles.css b/src/plays/quizeo/pages/score-page/score.styles.css
index 91d86ec270..a75dc02c6a 100644
--- a/src/plays/quizeo/pages/score-page/score.styles.css
+++ b/src/plays/quizeo/pages/score-page/score.styles.css
@@ -44,5 +44,7 @@
margin-left: 5rem;
margin-right: 5rem;
border-radius: 1.5rem;
- box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+ box-shadow:
+ 0 10px 15px -3px rgba(0, 0, 0, 0.1),
+ 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}
diff --git a/src/plays/random-quote-card-generator/Components/SideBarOperation.jsx b/src/plays/random-quote-card-generator/Components/SideBarOperation.jsx
index 788b6cc5eb..a508fb862e 100644
--- a/src/plays/random-quote-card-generator/Components/SideBarOperation.jsx
+++ b/src/plays/random-quote-card-generator/Components/SideBarOperation.jsx
@@ -109,7 +109,7 @@ const SideBarOperation = ({
// 2. Card Color Feature
- const handleCardColor = (e) => {
+ const handleCardColor = () => {
if (cardColor === 'Light') {
setCardColor('Dark');
} else {
diff --git a/src/plays/registration-form/Registration-form.css b/src/plays/registration-form/Registration-form.css
index ff3a945a15..db949af9e9 100644
--- a/src/plays/registration-form/Registration-form.css
+++ b/src/plays/registration-form/Registration-form.css
@@ -19,7 +19,9 @@
text-align: left;
background: #fff;
padding: 30px;
- box-shadow: 2px 2px 11px 1px #ccc, -2px -2px 16px 1px #ccc;
+ box-shadow:
+ 2px 2px 11px 1px #ccc,
+ -2px -2px 16px 1px #ccc;
border-radius: 10px;
}
.registration-form .user-input {
diff --git a/src/plays/self-clicking-button/SelfClickingButton.jsx b/src/plays/self-clicking-button/SelfClickingButton.jsx
index 5f92255963..30be0b49fb 100644
--- a/src/plays/self-clicking-button/SelfClickingButton.jsx
+++ b/src/plays/self-clicking-button/SelfClickingButton.jsx
@@ -9,7 +9,7 @@ function SelfClickingButton(props) {
const buttonRef = useRef(null);
const [counter, setCounter] = useState(0);
- function clickHandler(event) {
+ function clickHandler() {
setCounter((prev) => prev + 1);
}
diff --git a/src/plays/tube2tunes/Tube2tunes.jsx b/src/plays/tube2tunes/Tube2tunes.jsx
index 6d2f686516..0b23236264 100644
--- a/src/plays/tube2tunes/Tube2tunes.jsx
+++ b/src/plays/tube2tunes/Tube2tunes.jsx
@@ -57,7 +57,7 @@ function Tube2tunes(props) {
setLoading(false);
}
})
- .catch((err) => {
+ .catch(() => {
// console.log('Error: ', err);
});
diff --git a/src/plays/why-typescript/wizard/index.css b/src/plays/why-typescript/wizard/index.css
index 89e3b696a5..a3bf3806c3 100644
--- a/src/plays/why-typescript/wizard/index.css
+++ b/src/plays/why-typescript/wizard/index.css
@@ -62,7 +62,9 @@
background-image: linear-gradient(to bottom right, #e9eaec, #ffffff);
counter-increment: ol-cards-count;
filter: drop-shadow(10px 10px 10px rgba(0, 0, 0, 0.25));
- box-shadow: inset 2px 2px 2px white, inset -1px -1px 1px rgba(0, 0, 0, 0.25);
+ box-shadow:
+ inset 2px 2px 2px white,
+ inset -1px -1px 1px rgba(0, 0, 0, 0.25);
}
.ol-cards li > .icon {
@@ -122,7 +124,9 @@
border: 2px solid #000;
}
.s-button:hover {
- box-shadow: 0 2px 0 #000, 0 2px 0px 2px #000;
+ box-shadow:
+ 0 2px 0 #000,
+ 0 2px 0px 2px #000;
}
.s-button:active {
top: 4px;
@@ -132,7 +136,9 @@
.s-button {
position: relative;
float: left;
- font: normal 14px/15px 'Patrick Hand', sans-serif;
+ font:
+ normal 14px/15px 'Patrick Hand',
+ sans-serif;
margin-right: 10px;
text-transform: uppercase;
color: #000;
@@ -140,7 +146,10 @@
padding-bottom: 3px;
border-radius: 5px;
box-shadow: 0 2px 0 #000;
- transition: padding 0.1s, box-shadow 0.1s, top 0.1s;
+ transition:
+ padding 0.1s,
+ box-shadow 0.1s,
+ top 0.1s;
background-image: url('data:image/gif;base64,R0lGODlhBAAEAIABAAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjEgNjQuMTQwOTQ5LCAyMDEwLzEyLzA3LTEwOjU3OjAxICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1LjEgV2luZG93cyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo5NUY1OENCRDdDMDYxMUUyOTEzMEE1MEM5QzM0NDVBMyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo5NUY1OENCRTdDMDYxMUUyOTEzMEE1MEM5QzM0NDVBMyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjk1RjU4Q0JCN0MwNjExRTI5MTMwQTUwQzlDMzQ0NUEzIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjk1RjU4Q0JDN0MwNjExRTI5MTMwQTUwQzlDMzQ0NUEzIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Af/+/fz7+vn49/b19PPy8fDv7u3s6+rp6Ofm5eTj4uHg397d3Nva2djX1tXU09LR0M/OzczLysnIx8bFxMPCwcC/vr28u7q5uLe2tbSzsrGwr66trKuqqainpqWko6KhoJ+enZybmpmYl5aVlJOSkZCPjo2Mi4qJiIeGhYSDgoGAf359fHt6eXh3dnV0c3JxcG9ubWxramloZ2ZlZGNiYWBfXl1cW1pZWFdWVVRTUlFQT05NTEtKSUhHRkVEQ0JBQD8+PTw7Ojk4NzY1NDMyMTAvLi0sKyopKCcmJSQjIiEgHx4dHBsaGRgXFhUUExIREA8ODQwLCgkIBwYFBAMCAQAAIfkEAQAAAQAsAAAAAAQABAAAAgYEEpdoeQUAOw==');
}
diff --git a/src/service-worker.js b/src/service-worker.js
index fae0169328..8260060811 100644
--- a/src/service-worker.js
+++ b/src/service-worker.js
@@ -12,19 +12,22 @@ clientsClaim();
precacheAndRoute(self.__WB_MANIFEST);
const fileExtensionRegexp = new RegExp('/[^/?]+\\.[^/]+$');
-registerRoute(({ request, url }) => {
- if (request.mode !== 'navigate') {
- return false;
- }
- if (url.pathname.startsWith('/_')) {
- return false;
- }
- if (url.pathname.match(fileExtensionRegexp)) {
- return false;
- }
-
- return true;
-}, createHandlerBoundToURL(process.env.PUBLIC_URL + '/index.html'));
+registerRoute(
+ ({ request, url }) => {
+ if (request.mode !== 'navigate') {
+ return false;
+ }
+ if (url.pathname.startsWith('/_')) {
+ return false;
+ }
+ if (url.pathname.match(fileExtensionRegexp)) {
+ return false;
+ }
+
+ return true;
+ },
+ createHandlerBoundToURL(process.env.PUBLIC_URL + '/index.html')
+);
registerRoute(
({ url }) => {