diff --git a/.github/workflows/node.js.yml b/.github/workflows/node.js.yml
index 43818df2..137c0707 100644
--- a/.github/workflows/node.js.yml
+++ b/.github/workflows/node.js.yml
@@ -2,25 +2,25 @@ name: Continuous Integration
# This action works with pull requests and pushes
on:
- pull_request:
- push:
- branches:
- - main
- - staging
+ pull_request:
+ push:
+ branches:
+ - main
+ - staging
jobs:
- prettier:
- runs-on: ubuntu-latest
+ prettier:
+ runs-on: ubuntu-latest
- steps:
- - name: Checkout
- uses: actions/checkout@v3
- with:
- # Make sure the actual branch is checked out when running on pull requests
- ref: ${{ github.head_ref }}
+ steps:
+ - name: Checkout
+ uses: actions/checkout@v3
+ with:
+ # Make sure the actual branch is checked out when running on pull requests
+ ref: ${{ github.head_ref }}
- - name: Prettify code
- uses: creyD/prettier_action@v4.3
- with:
- # This part is also where you can pass other options, for example:
- prettier_options: --write **/*.{js,md}
+ - name: Prettify code
+ uses: creyD/prettier_action@v4.3
+ with:
+ # This part is also where you can pass other options, for example:
+ prettier_options: --write **/*.{js,md}
diff --git a/.prettierrc b/.prettierrc
new file mode 100644
index 00000000..6fba5fcf
--- /dev/null
+++ b/.prettierrc
@@ -0,0 +1,11 @@
+{
+ "trailingComma": "es5",
+ "tabWidth": 2,
+ "semi": true,
+ "useTabs": false,
+ "printWidth": 120,
+ "singleQuote": false,
+ "jsxSingleQuote": false,
+ "quoteProps": "as-needed",
+ "arrowParens": "avoid"
+}
diff --git a/CLA.md b/CLA.md
index 57bb12de..ff5fbbcb 100644
--- a/CLA.md
+++ b/CLA.md
@@ -6,9 +6,9 @@ You accept and agree to the following terms and conditions for Your present and
1. Definitions.
- "You" (or "Your") shall mean the copyright owner or legal entity authorized by the copyright owner that is making this Agreement with Astrostation. For legal entities, the entity making a Contribution and all other entities that control, are controlled by, or are under common control with that entity are considered to be a single Contributor. For the purposes of this definition, "control" means (i) the power, direct or indirect, to cause the direction or management of such entity, whether by contract or otherwise, or (ii) ownership of fifty percent (50%) or more of the outstanding shares, or (iii) beneficial ownership of such entity.
+ "You" (or "Your") shall mean the copyright owner or legal entity authorized by the copyright owner that is making this Agreement with Astrostation. For legal entities, the entity making a Contribution and all other entities that control, are controlled by, or are under common control with that entity are considered to be a single Contributor. For the purposes of this definition, "control" means (i) the power, direct or indirect, to cause the direction or management of such entity, whether by contract or otherwise, or (ii) ownership of fifty percent (50%) or more of the outstanding shares, or (iii) beneficial ownership of such entity.
- "Contribution" shall mean any original work of authorship, including any modifications or additions to an existing work, that is intentionally submitted by You to Astrostation for inclusion in, or documentation of, any of the products owned or managed by Astrostation (the "Work"). For the purposes of this definition, "submitted" means any form of electronic, verbal, or written communication sent to Astrostation or its representatives, including but not limited to communication on electronic mailing lists, source code control systems, and issue tracking systems that are managed by, or on behalf of, Astrostation for the purpose of discussing and improving the Work, but excluding communication that is conspicuously marked or otherwise designated in writing by You as "Not a Contribution."
+ "Contribution" shall mean any original work of authorship, including any modifications or additions to an existing work, that is intentionally submitted by You to Astrostation for inclusion in, or documentation of, any of the products owned or managed by Astrostation (the "Work"). For the purposes of this definition, "submitted" means any form of electronic, verbal, or written communication sent to Astrostation or its representatives, including but not limited to communication on electronic mailing lists, source code control systems, and issue tracking systems that are managed by, or on behalf of, Astrostation for the purpose of discussing and improving the Work, but excluding communication that is conspicuously marked or otherwise designated in writing by You as "Not a Contribution."
2. Grant of Copyright License. Subject to the terms and conditions of this Agreement, You hereby grant to Astrostation and to recipients of software distributed by Astrostation a perpetual, worldwide, non-exclusive, no-charge, royalty-free, irrevocable copyright license to reproduce, prepare derivative works of, publicly display, publicly perform, sublicense, and distribute Your Contributions and such derivative works.
diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md
index 890c14f4..2af02452 100644
--- a/CODE_OF_CONDUCT.md
+++ b/CODE_OF_CONDUCT.md
@@ -17,24 +17,24 @@ diverse, inclusive, and healthy community.
Examples of behavior that contributes to a positive environment for our
community include:
-- Demonstrating empathy and kindness toward other people
-- Being respectful of differing opinions, viewpoints, and experiences
-- Giving and gracefully accepting constructive feedback
-- Accepting responsibility and apologizing to those affected by our mistakes,
- and learning from the experience
-- Focusing on what is best not just for us as individuals, but for the overall
- community
+- Demonstrating empathy and kindness toward other people
+- Being respectful of differing opinions, viewpoints, and experiences
+- Giving and gracefully accepting constructive feedback
+- Accepting responsibility and apologizing to those affected by our mistakes,
+ and learning from the experience
+- Focusing on what is best not just for us as individuals, but for the overall
+ community
Examples of unacceptable behavior include:
-- The use of sexualized language or imagery, and sexual attention or advances
- of any kind
-- Trolling, insulting or derogatory comments, and personal or political attacks
-- Public or private harassment
-- Publishing others’ private information, such as a physical or email address,
- without their explicit permission
-- Other conduct which could reasonably be considered inappropriate in a
- professional setting
+- The use of sexualized language or imagery, and sexual attention or advances
+ of any kind
+- Trolling, insulting or derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others’ private information, such as a physical or email address,
+ without their explicit permission
+- Other conduct which could reasonably be considered inappropriate in a
+ professional setting
## Enforcement Responsibilities
diff --git a/assets/images/index/favicon144x144.png b/assets/images/index/favicon144x144.png
new file mode 100644
index 00000000..6bd65aa3
Binary files /dev/null and b/assets/images/index/favicon144x144.png differ
diff --git a/contributors.yml b/contributors.yml
index 5de0d7c3..ff2024e6 100644
--- a/contributors.yml
+++ b/contributors.yml
@@ -1,5 +1,13 @@
-- royanger
-- nchudleigh
+- creativenull
- emalineg
-- Samathingamajig
- eraychumak
+- justnat3
+- pizzaintheoven
+- hacksore
+- herropaul
+- madeleine-patience
+- mastermajorman
+- melkeydev
+- nchudleigh
+- royanger
+- Samathingamajig
diff --git a/index.html b/index.html
index 13447d29..fa8ba22b 100644
--- a/index.html
+++ b/index.html
@@ -1,80 +1,77 @@
-
-
-
-
- Astrostation - Aesthetic Online Pomodoro Timer for Improved Productivity
-
+
+
+
+
+ Astrostation - Aesthetic Online Pomodoro Timer for Improved Productivity
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/package-lock.json b/package-lock.json
index 899279d6..9b1a7df1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,17 +1,19 @@
{
"name": "client",
- "version": "1.0.3",
+ "version": "1.1.0",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "client",
- "version": "1.0.3",
+ "version": "1.1.0",
"dependencies": {
"@emotion/react": "^11.9.0",
"@emotion/styled": "^11.8.1",
+ "@floating-ui/core": "^1.2.2",
"@floating-ui/react-dom": "^1.0.0",
"clsx": "^1.2.1",
+ "csstype": "^3.1.1",
"dotenv": "^16.0.0",
"ethers": "^5.6.2",
"rc-slider": "^10.0.0-alpha.4",
@@ -27,6 +29,7 @@
"react-tsparticles": "^2.1.0",
"react-youtube": "^7.13.1",
"sass": "^1.49.8",
+ "scroll-snap": "^4.0.3",
"tsparticles": "^2.1.0",
"tsparticles-engine": "^2.1.0",
"uuid": "^8.3.2",
@@ -1257,9 +1260,9 @@
}
},
"node_modules/@floating-ui/core": {
- "version": "1.0.1",
- "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.0.1.tgz",
- "integrity": "sha512-bO37brCPfteXQfFY0DyNDGB3+IMe4j150KFQcgJ5aBP295p9nBGeHEs/p0czrRbtlHq4Px/yoPXO/+dOCcF4uA=="
+ "version": "1.2.4",
+ "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.2.4.tgz",
+ "integrity": "sha512-SQOeVbMwb1di+mVWWJLpsUTToKfqVNioXys011beCAhyOIFtS+GQoW4EQSneuxzmQKddExDwQ+X0hLl4lJJaSQ=="
},
"node_modules/@floating-ui/dom": {
"version": "1.0.3",
@@ -1632,13 +1635,19 @@
}
},
"node_modules/caniuse-lite": {
- "version": "1.0.30001312",
- "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001312.tgz",
- "integrity": "sha512-Wiz1Psk2MEK0pX3rUzWaunLTZzqS2JYZFzNKqAiJGiuxIjRPLgV6+VDPOg6lQOUxmDwhTlh198JsTTi8Hzw6aQ==",
- "funding": {
- "type": "opencollective",
- "url": "https://opencollective.com/browserslist"
- }
+ "version": "1.0.30001468",
+ "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001468.tgz",
+ "integrity": "sha512-zgAo8D5kbOyUcRAgSmgyuvBkjrGk5CGYG5TYgFdpQv+ywcyEpo1LOWoG8YmoflGnh+V+UsNuKYedsoYs0hzV5A==",
+ "funding": [
+ {
+ "type": "opencollective",
+ "url": "https://opencollective.com/browserslist"
+ },
+ {
+ "type": "tidelift",
+ "url": "https://tidelift.com/funding/github/npm/caniuse-lite"
+ }
+ ]
},
"node_modules/chalk": {
"version": "2.4.2",
@@ -1745,9 +1754,9 @@
}
},
"node_modules/csstype": {
- "version": "3.0.11",
- "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz",
- "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw=="
+ "version": "3.1.1",
+ "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz",
+ "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw=="
},
"node_modules/debug": {
"version": "4.3.3",
@@ -3248,6 +3257,11 @@
"resolved": "https://registry.npmjs.org/scroll/-/scroll-3.0.1.tgz",
"integrity": "sha512-pz7y517OVls1maEzlirKO5nPYle9AXsFzTMNJrRGmT951mzpIBy7sNHOg5o/0MQd/NqliCiWnAi0kZneMPFLcg=="
},
+ "node_modules/scroll-snap": {
+ "version": "4.0.3",
+ "resolved": "https://registry.npmjs.org/scroll-snap/-/scroll-snap-4.0.3.tgz",
+ "integrity": "sha512-7am2JXqY/0jHN9+3b2zhZtm55NmzEQhZTXZBIdC/fVb6aVN5nonjbRpf+OghU9LhguJB+rq5ty9SmQcYzMvMxw=="
+ },
"node_modules/scrollparent": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/scrollparent/-/scrollparent-2.0.1.tgz",
@@ -4735,9 +4749,9 @@
}
},
"@floating-ui/core": {
- "version": "1.0.1",
- "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.0.1.tgz",
- "integrity": "sha512-bO37brCPfteXQfFY0DyNDGB3+IMe4j150KFQcgJ5aBP295p9nBGeHEs/p0czrRbtlHq4Px/yoPXO/+dOCcF4uA=="
+ "version": "1.2.4",
+ "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.2.4.tgz",
+ "integrity": "sha512-SQOeVbMwb1di+mVWWJLpsUTToKfqVNioXys011beCAhyOIFtS+GQoW4EQSneuxzmQKddExDwQ+X0hLl4lJJaSQ=="
},
"@floating-ui/dom": {
"version": "1.0.3",
@@ -5037,9 +5051,9 @@
"dev": true
},
"caniuse-lite": {
- "version": "1.0.30001312",
- "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001312.tgz",
- "integrity": "sha512-Wiz1Psk2MEK0pX3rUzWaunLTZzqS2JYZFzNKqAiJGiuxIjRPLgV6+VDPOg6lQOUxmDwhTlh198JsTTi8Hzw6aQ=="
+ "version": "1.0.30001468",
+ "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001468.tgz",
+ "integrity": "sha512-zgAo8D5kbOyUcRAgSmgyuvBkjrGk5CGYG5TYgFdpQv+ywcyEpo1LOWoG8YmoflGnh+V+UsNuKYedsoYs0hzV5A=="
},
"chalk": {
"version": "2.4.2",
@@ -5122,9 +5136,9 @@
"dev": true
},
"csstype": {
- "version": "3.0.11",
- "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz",
- "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw=="
+ "version": "3.1.1",
+ "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz",
+ "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw=="
},
"debug": {
"version": "4.3.3",
@@ -6145,6 +6159,11 @@
"resolved": "https://registry.npmjs.org/scroll/-/scroll-3.0.1.tgz",
"integrity": "sha512-pz7y517OVls1maEzlirKO5nPYle9AXsFzTMNJrRGmT951mzpIBy7sNHOg5o/0MQd/NqliCiWnAi0kZneMPFLcg=="
},
+ "scroll-snap": {
+ "version": "4.0.3",
+ "resolved": "https://registry.npmjs.org/scroll-snap/-/scroll-snap-4.0.3.tgz",
+ "integrity": "sha512-7am2JXqY/0jHN9+3b2zhZtm55NmzEQhZTXZBIdC/fVb6aVN5nonjbRpf+OghU9LhguJB+rq5ty9SmQcYzMvMxw=="
+ },
"scrollparent": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/scrollparent/-/scrollparent-2.0.1.tgz",
diff --git a/package.json b/package.json
index eaf1c8bb..1076e906 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "client",
"private": true,
- "version": "1.1.0",
+ "version": "1.2.0",
"scripts": {
"dev": "vite",
"build": "vite build",
@@ -30,6 +30,7 @@
"react-tsparticles": "^2.1.0",
"react-youtube": "^7.13.1",
"sass": "^1.49.8",
+ "scroll-snap": "^4.0.3",
"tsparticles": "^2.1.0",
"tsparticles-engine": "^2.1.0",
"uuid": "^8.3.2",
diff --git a/src/App.tsx b/src/App.tsx
index ef06c742..6a24b58c 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,17 +1,15 @@
import { useEffect } from "react";
import { Backgrounds } from "@Components/Backgrounds/utils";
-import { HomePage } from "@Pages/Homepage";
+import { Astrostation } from "@Root/src/pages/Astrostation";
+import { InfoSection } from "@Root/src/pages/InfoSection";
import { SideNav } from "@Components/Nav/SideNav";
-import {
- useDarkToggleStore,
- useFirstTimeUserStore,
- useBreakStarted,
-} from "@Store";
+import { useDarkToggleStore, useFirstTimeUserStore, useBreakStarted, useSeoVisibilityStore } from "@Store";
import { Toaster } from "react-hot-toast";
import { version } from "@Root/package.json";
import { Walkthrough } from "@Components/Walkthrough/Walkthrough";
import useSetDefault from "@App/utils/hooks/useSetDefault";
import clsx from "clsx";
+import { useRef } from "react";
enum backgrounds {
CITY,
@@ -26,10 +24,21 @@ enum backgrounds {
}
function App() {
- const isDark = useDarkToggleStore((state) => state.isDark);
+ const isDark = useDarkToggleStore(state => state.isDark);
const { isFirstTimeUser } = useFirstTimeUserStore();
const { breakStarted } = useBreakStarted();
const setDefault = useSetDefault();
+ const { isSeoVisible, setSeoVisibility } = useSeoVisibilityStore();
+ const astroStationRef = useRef(null);
+
+ const handleButtonClick = () => {
+ if (astroStationRef.current) {
+ astroStationRef.current.scrollIntoView({ behavior: "smooth" });
+ }
+ setTimeout(() => {
+ setSeoVisibility(!isSeoVisible);
+ }, 700);
+ };
useEffect(() => {
if (isDark) {
@@ -51,14 +60,16 @@ function App() {
{isFirstTimeUser && }
>
);
diff --git a/src/components/Backgrounds/City/City.scss b/src/components/Backgrounds/City/City.scss
index 0276f50a..a3c09b74 100644
--- a/src/components/Backgrounds/City/City.scss
+++ b/src/components/Backgrounds/City/City.scss
@@ -27,11 +27,7 @@
height: 10px;
background: white;
border-radius: 50%;
- background-image: radial-gradient(
- hsl(180, 100%, 80%),
- hsl(180, 100%, 80%) 40%,
- hsla(180, 100%, 80%, 0) 86%
- );
+ background-image: radial-gradient(hsl(180, 100%, 80%), hsl(180, 100%, 80%) 40%, hsla(180, 100%, 80%, 0) 86%);
@for $i from 1 through $total {
$random-x: random(1000000) * 0.0001vw;
diff --git a/src/components/Backgrounds/City/City.tsx b/src/components/Backgrounds/City/City.tsx
index 0fc0b9e7..8d47f192 100644
--- a/src/components/Backgrounds/City/City.tsx
+++ b/src/components/Backgrounds/City/City.tsx
@@ -3,7 +3,7 @@ import "./City.scss";
export const City = () => {
return (
- {[...Array(150).keys()].map((i) => (
+ {[...Array(150).keys()].map(i => (
))}
diff --git a/src/components/Backgrounds/Dvd/DvdContent.tsx b/src/components/Backgrounds/Dvd/DvdContent.tsx
index 50de90a6..6014b8f1 100644
--- a/src/components/Backgrounds/Dvd/DvdContent.tsx
+++ b/src/components/Backgrounds/Dvd/DvdContent.tsx
@@ -159,8 +159,7 @@ export const DvdContent = () => {
if (el.nodeName === "path") {
var path = new Path2D(el.getAttribute("d"));
- ctx.fillStyle =
- el.getAttribute("fill") === "#fff" ? background : logo_color;
+ ctx.fillStyle = el.getAttribute("fill") === "#fff" ? background : logo_color;
ctx.fill(path);
} else if (el.nodeName === "ellipse") {
ctx.beginPath();
@@ -174,8 +173,7 @@ export const DvdContent = () => {
Math.PI * 2
);
ctx.closePath();
- ctx.fillStyle =
- el.getAttribute("fill") === "#fff" ? background : logo_color;
+ ctx.fillStyle = el.getAttribute("fill") === "#fff" ? background : logo_color;
ctx.fill();
}
}
@@ -244,10 +242,7 @@ export const DvdContent = () => {
let deltaLKlsl = deltaL / 1.0;
let deltaCkcsc = deltaC / sc;
let deltaHkhsh = deltaH / sh;
- let i =
- deltaLKlsl * deltaLKlsl +
- deltaCkcsc * deltaCkcsc +
- deltaHkhsh * deltaHkhsh;
+ let i = deltaLKlsl * deltaLKlsl + deltaCkcsc * deltaCkcsc + deltaHkhsh * deltaHkhsh;
return i < 0 ? 0 : Math.sqrt(i);
}
@@ -272,33 +267,17 @@ export const DvdContent = () => {
function hexToRgb(hex) {
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
- return result
- ? [
- parseInt(result[1], 16),
- parseInt(result[2], 16),
- parseInt(result[3], 16),
- ]
- : null;
+ return result ? [parseInt(result[1], 16), parseInt(result[2], 16), parseInt(result[3], 16)] : null;
}
}, [document.documentElement, isFullscreen]);
return (
<>
-
+
-
+
{
+export const CustomizationButton = props => {
return (
{
+ const [isBgTransparent, setIsBgTransparent] = useState(false);
+
+ const handleClick = () => {
+ onClick();
+ setIsBgTransparent(!isBgTransparent);
+ };
+
+ return (
+
+
+ Hide Content
+
+
+ );
+};
diff --git a/src/components/Crypto/Donation.tsx b/src/components/Crypto/Donation.tsx
index 36c12a0d..ec809118 100644
--- a/src/components/Crypto/Donation.tsx
+++ b/src/components/Crypto/Donation.tsx
@@ -1,6 +1,7 @@
import { CryptoModal } from "./Modal";
import { FaEthereum } from "react-icons/fa";
import { useState } from "react";
+import { Button } from "../Common/Button";
export const CryptoDonationButton = () => {
const [isCryptoModalOpen, setIsCryptoModalOpen] = useState(false);
@@ -8,20 +9,18 @@ export const CryptoDonationButton = () => {
return (
<>
- setIsCryptoModalOpen(false)}
- />
+ setIsCryptoModalOpen(false)} />
-
-
+ setIsCryptoModalOpen(true)}
+ variant="bottomButton"
>
Donate
-
+
>
);
diff --git a/src/components/Crypto/Error.tsx b/src/components/Crypto/Error.tsx
index e46c49c4..7c95d7a9 100644
--- a/src/components/Crypto/Error.tsx
+++ b/src/components/Crypto/Error.tsx
@@ -4,12 +4,7 @@ export default function ErrorMessage({ message }) {
return (
-
+
- {txs.map((item) => (
+ {txs.map(item => (
{
try {
//@ts-ignore
- if (!window.ethereum)
- throw new Error("No crypto wallet found. Please install it.");
+ if (!window.ethereum) throw new Error("No crypto wallet found. Please install it.");
//@ts-ignore
await window.ethereum.send("eth_requestAccounts");
@@ -52,8 +51,7 @@ export const CryptoModal = ({ isVisible = false, onClose }) => {
const connectMetaMaskConnected = async () => {
try {
//@ts-ignore
- if (!window.ethereum)
- throw new Error("No crypto wallet found. Please install it.");
+ if (!window.ethereum) throw new Error("No crypto wallet found. Please install it.");
//@ts-ignore
await window.ethereum.send("eth_requestAccounts");
@@ -67,7 +65,7 @@ export const CryptoModal = ({ isVisible = false, onClose }) => {
}
};
- const handleSubmit = async (e) => {
+ const handleSubmit = async e => {
e.preventDefault();
const address = "0x39CFE0572DE24a92df064C8Fdf4C23DE6a2d6628";
const data = new FormData(e.target);
@@ -89,7 +87,7 @@ export const CryptoModal = ({ isVisible = false, onClose }) => {
};
useEffect(() => {
- isMetaMaskConnected().then((connected) => {
+ isMetaMaskConnected().then(connected => {
if (connected) {
setMetaMaskConnected(true);
} else {
@@ -105,16 +103,10 @@ export const CryptoModal = ({ isVisible = false, onClose }) => {
return !isVisible ? null : (
-
e.stopPropagation()}
- >
+
e.stopPropagation()}>
@@ -143,7 +135,7 @@ export const CryptoModal = ({ isVisible = false, onClose }) => {
{!metaMaskConnected ? (
connectMetaMaskConnected()}
@@ -151,11 +143,7 @@ export const CryptoModal = ({ isVisible = false, onClose }) => {
Connect MetaMask wallet
) : (
-
+
Donate Now
)}
diff --git a/src/components/Dragggable/Draggable.tsx b/src/components/Dragggable/Draggable.tsx
index b3010954..61acdfc0 100644
--- a/src/components/Dragggable/Draggable.tsx
+++ b/src/components/Dragggable/Draggable.tsx
@@ -85,33 +85,14 @@ export const DWrapper = ({
handle={handle}
>
{isSticky ? (
- setZ(++int)}
- >
-
+
setZ(++int)}>
+
{children}
) : (
-
setZ(++int)}
- >
-
+
setZ(++int)}>
+
{children}
diff --git a/src/components/Nav/BackgroundDropdownItem.tsx b/src/components/Nav/BackgroundDropdownItem.tsx
index 0cc2a052..71a435eb 100644
--- a/src/components/Nav/BackgroundDropdownItem.tsx
+++ b/src/components/Nav/BackgroundDropdownItem.tsx
@@ -16,14 +16,12 @@ export const BackgroundDropdownItem = ({
return (
setIsBackground(background)}
>
-
- {title}
-
+
{title}
);
};
diff --git a/src/components/Nav/BackgroundNav.tsx b/src/components/Nav/BackgroundNav.tsx
index 7603f4b6..2fc28118 100644
--- a/src/components/Nav/BackgroundNav.tsx
+++ b/src/components/Nav/BackgroundNav.tsx
@@ -33,7 +33,7 @@ export const BackgroundNav = ({
diff --git a/src/components/Nav/BottomButtons.tsx b/src/components/Nav/BottomButtons.tsx
new file mode 100644
index 00000000..6c4ec4bc
--- /dev/null
+++ b/src/components/Nav/BottomButtons.tsx
@@ -0,0 +1,19 @@
+import { Button } from "../Common/Button";
+import { AiOutlineGithub } from "react-icons/ai";
+import { WithTooltip } from "../Tooltip";
+import { SiGithub } from "react-icons/si";
+
+function BottomButtons() {
+ return (
+
+
+
+ );
+}
+export default BottomButtons;
diff --git a/src/components/Nav/DraggableNavItem.tsx b/src/components/Nav/DraggableNavItem.tsx
index f9874817..aee26b91 100644
--- a/src/components/Nav/DraggableNavItem.tsx
+++ b/src/components/Nav/DraggableNavItem.tsx
@@ -3,30 +3,13 @@ import { useStickyNote } from "@Store";
import { toggledToastNotification } from "../../utils/toast";
import clsx from "clsx";
-export const DraggableNavItem = ({
- active,
- item,
-}: {
- active: boolean;
- item: any;
-}) => {
+export const DraggableNavItem = ({ active, item }: { active: boolean; item: any }) => {
const { stickyNotes } = useStickyNote();
return (
-
+
- toggledToastNotification(
- item.isToggled,
- item.setToggled,
- item.toggleString,
- 750,
- item.toggleIcon
- )
+ toggledToastNotification(item.isToggled, item.setToggled, item.toggleString, 750, item.toggleIcon)
}
toggled={item.isToggled}
shown={item.isShown}
diff --git a/src/components/Nav/NavItems.tsx b/src/components/Nav/NavItems.tsx
index 8bfbcf8d..1919f4e9 100644
--- a/src/components/Nav/NavItems.tsx
+++ b/src/components/Nav/NavItems.tsx
@@ -11,8 +11,9 @@ export const NavItem: FC<{
diff --git a/src/components/Nav/SideNav.tsx b/src/components/Nav/SideNav.tsx
index c022290c..fd230af0 100644
--- a/src/components/Nav/SideNav.tsx
+++ b/src/components/Nav/SideNav.tsx
@@ -2,18 +2,9 @@ import { NavItem } from "./NavItems";
import { IoMusicalNotesOutline } from "react-icons/io5";
import { IoMenu } from "react-icons/io5";
import { CgNotes } from "react-icons/cg";
-import {
- MdOutlineTimer,
- MdWbSunny,
- MdDarkMode,
- MdOutlineNoteAdd,
-} from "react-icons/md";
+import { MdOutlineTimer, MdWbSunny, MdDarkMode, MdOutlineNoteAdd } from "react-icons/md";
import { VscDebugRestartFrame } from "react-icons/vsc";
-import {
- BsArrowsFullscreen,
- BsFillChatLeftQuoteFill,
- BsTwitch,
-} from "react-icons/bs";
+import { BsArrowsFullscreen, BsFillChatLeftQuoteFill, BsTwitch } from "react-icons/bs";
import { FaSpotify } from "react-icons/fa";
import {
useToggleMusic,
@@ -67,10 +58,7 @@ export const SideNav = () => {
useEffect(() => {
document.addEventListener("fullscreenchange", fullscreenChanged);
document.addEventListener("keyup", function (e) {
- if (
- e.key === "F11" ||
- (e.key === "Escape" && document.fullscreenElement)
- ) {
+ if (e.key === "F11" || (e.key === "Escape" && document.fullscreenElement)) {
toggleFullScreen();
}
});
@@ -86,14 +74,10 @@ export const SideNav = () => {
}
function toggleNavBar() {
- setActive((oldDate) => !oldDate);
+ setActive(oldDate => !oldDate);
}
- let theme = isDark ? (
-
- ) : (
-
- );
+ let theme = isDark ? : ;
const sideNavItems = [
{
@@ -199,11 +183,7 @@ export const SideNav = () => {
];
// a little function to help us with reordering the result
- const reorder = (
- list: number[],
- startIndex: number,
- endIndex: number
- ): number[] => {
+ const reorder = (list: number[], startIndex: number, endIndex: number): number[] => {
const result = Array.from(list);
const [removed] = result.splice(startIndex, 1);
result.splice(endIndex, 0, removed);
@@ -216,14 +196,12 @@ export const SideNav = () => {
return;
}
- setSideNavOrder(
- reorder(sideNavOrder, result.source.index, result.destination.index)
- );
+ setSideNavOrder(reorder(sideNavOrder, result.source.index, result.destination.index));
}
return (
-
+
@@ -248,11 +226,7 @@ export const SideNav = () => {
disableInteractiveElementBlocking="true"
>
{(provided, snapshot) => (
-
+
)}
diff --git a/src/components/Nav/UnsplashFooter.tsx b/src/components/Nav/UnsplashFooter.tsx
index 2c1cdf56..698f1248 100644
--- a/src/components/Nav/UnsplashFooter.tsx
+++ b/src/components/Nav/UnsplashFooter.tsx
@@ -36,11 +36,7 @@ export const UnsplashFooter = () => {
return (
-
+
Image Source
{
- {playAudio ? (
-
- ) : (
-
- )}
+ {playAudio ? : }
{
+ onChange={value => {
onVolumeChange(value as number);
}}
railStyle={{
diff --git a/src/components/Player/Spotify/Player.tsx b/src/components/Player/Spotify/Player.tsx
index d9fd05de..f91f4f66 100644
--- a/src/components/Player/Spotify/Player.tsx
+++ b/src/components/Player/Spotify/Player.tsx
@@ -9,9 +9,7 @@ export const Spotify = () => {
const { isDark } = useDarkToggleStore();
const [text, setText] = useState("");
- const [playlist, setPlaylist] = useState(
- "https://open.spotify.com/embed/playlist/37i9dQZF1DWWQRwui0ExPn"
- );
+ const [playlist, setPlaylist] = useState("https://open.spotify.com/embed/playlist/37i9dQZF1DWWQRwui0ExPn");
function changePlaylist() {
if (!text.includes("https://open.spotify.com/playlist/")) {
@@ -37,7 +35,7 @@ export const Spotify = () => {
Spotify
setIsSpotifyToggled(false)}
/>
@@ -52,21 +50,18 @@ export const Spotify = () => {
allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture"
>
-
);
diff --git a/src/components/Player/StationSelector.tsx b/src/components/Player/StationSelector.tsx
index beeb309a..d2e33771 100644
--- a/src/components/Player/StationSelector.tsx
+++ b/src/components/Player/StationSelector.tsx
@@ -23,7 +23,7 @@ export const StationSelector = () => {
type="radio"
name="flexRadioDefault"
id="jfKfPfyJRdk"
- onClick={(e) => setSongId(e)}
+ onClick={e => setSongId(e)}
/>
Default Lofi Station
@@ -35,7 +35,7 @@ export const StationSelector = () => {
type="radio"
name="flexRadioDefault"
id="e3L1PIY1pN8"
- onClick={(e) => setSongId(e)}
+ onClick={e => setSongId(e)}
/>
Lofi Coffee Station
@@ -49,7 +49,7 @@ export const StationSelector = () => {
type="radio"
name="flexRadioDefault"
id="hi1cYzaLEig"
- onClick={(e) => setSongId(e)}
+ onClick={e => setSongId(e)}
/>
Lofi Hip Hop Station
@@ -61,7 +61,7 @@ export const StationSelector = () => {
type="radio"
name="flexRadioDefault"
id="6uddGul0oAc"
- onClick={(e) => setSongId(e)}
+ onClick={e => setSongId(e)}
/>
Tokyo Lofi Station
diff --git a/src/components/Quotes/Quotes.tsx b/src/components/Quotes/Quotes.tsx
index d5393f59..629e1a81 100644
--- a/src/components/Quotes/Quotes.tsx
+++ b/src/components/Quotes/Quotes.tsx
@@ -28,11 +28,7 @@ export const Quotes = () => {
-
- setQuoteNumber(Math.floor(Math.random() * quoteData.length))
- }
- />
+ setQuoteNumber(Math.floor(Math.random() * quoteData.length))} />
);
diff --git a/src/components/Settings/Modal.tsx b/src/components/Settings/Modal.tsx
index 4b6f0526..c8550b1e 100644
--- a/src/components/Settings/Modal.tsx
+++ b/src/components/Settings/Modal.tsx
@@ -19,7 +19,7 @@ export const SettingsModal = ({ isVisible = false, onClose }) => {
return !isVisible ? null : (
-
e.stopPropagation()}>
+
e.stopPropagation()}>
diff --git a/src/components/Sticky/Sticky.tsx b/src/components/Sticky/Sticky.tsx
index b239b5a9..c07b3ab2 100644
--- a/src/components/Sticky/Sticky.tsx
+++ b/src/components/Sticky/Sticky.tsx
@@ -1,17 +1,47 @@
-import { IoCloseSharp } from "react-icons/io5";
+import { IoCloseSharp, IoEllipsisHorizontalSharp } from "react-icons/io5";
+import { MouseEventHandler, useState } from "react";
import { useStickyNote } from "@Store";
+import { ColorOptions } from "@Root/src/interfaces";
import TextareaAutosize from "react-textarea-autosize";
-export const Sticky = ({ id, text }) => {
+export const Sticky = ({ id, text, color }) => {
const { removeNote, editNote } = useStickyNote();
+ const [showColorSelector, setShowColorSelector] = useState(false);
+
+ // Toggles the state of the color selector open/closed
+ const handleToggleSelector: MouseEventHandler
= event => {
+ event.stopPropagation();
+ setShowColorSelector(!showColorSelector);
+ };
+
+ // Sets the selected color and closes the color selector
+ const selectColor = selectedColor => {
+ editNote(id, "color", selectedColor);
+ setShowColorSelector(!showColorSelector);
+ };
+
+ // Renders a row of color elements
+ const displayColors = () => {
+ return (
+
+ {Object.values(ColorOptions).map(c => (
+
selectColor(c)}
+ />
+ ))}
+
+ );
+ };
return (
-
+
+ {showColorSelector && displayColors()}
- removeNote(id)}
- />
+
+ removeNote(id)} />
{
cols={18}
placeholder="Add a note"
value={text}
- onChange={(e) => {
- editNote(id, e.target.value);
+ onChange={e => {
+ editNote(id, "text", e.target.value);
}}
style={{
border: "none",
diff --git a/src/components/TaskTracker/AddTask.tsx b/src/components/TaskTracker/AddTask.tsx
index 18ad56c7..de990e27 100644
--- a/src/components/TaskTracker/AddTask.tsx
+++ b/src/components/TaskTracker/AddTask.tsx
@@ -11,7 +11,7 @@ export const AddTask = () => {
const { breakStarted } = useBreakStarted();
const setFormattedContent = useCallback(
- (text) => {
+ text => {
setCharCount(text.slice(0, limit));
},
[limit, setCharCount]
@@ -42,7 +42,7 @@ export const AddTask = () => {
}
return (
-