Update project's name on the UI

This commit is contained in:
Chigozirim Igweamaka 2024-08-04 23:12:53 +01:00
parent 80ed9038e9
commit f0b798871b
3 changed files with 33 additions and 2 deletions

View file

@ -24,7 +24,7 @@
work correctly both with client-side routing and a non-root public URL. work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`. Learn how to configure a non-root public URL by running `npm run build`.
--> -->
<title>React App</title> <title>SeekTune</title>
</head> </head>
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>

View file

@ -244,7 +244,7 @@ function App() {
return ( return (
<div className="App"> <div className="App">
<div className="TopHeader"> <div className="TopHeader">
<h1 style={{ color: "#374151" }}>!Shazam</h1> <h2 style={{ color: "#374151" }}>SeekTune</h2>
<h4 style={{ display: "flex", justifyContent: "flex-end" }}> <h4 style={{ display: "flex", justifyContent: "flex-end" }}>
<AnimatedNumber includeComma={true} animateToNumber={totalSongs} /> <AnimatedNumber includeComma={true} animateToNumber={totalSongs} />
&nbsp;Songs &nbsp;Songs

View file

@ -0,0 +1,31 @@
import React, { useState } from "react";
import AnimatedNumber from "./AnimatedNumber";
import { Bounce } from "react-toastify";
const TestComponent = (props) => {
const [number, setNumber] = useState(18);
const increment = () => setNumber((prev) => prev + 1);
const decrement = () => setNumber((prev) => prev - 1);
return (
<div>
<h1>Animated Number</h1>
<AnimatedNumber
animateToNumber={number}
fontStyle={{ fontSize: "2rem", color: "black" }}
// transitions={(index) => ({
// duration: 10,
// delay: index * 10,
// })}
includeComma={true}
/>
<div>
<button onClick={increment}>Increment</button>
<button onClick={decrement}>Decrement</button>
</div>
</div>
);
};
export default TestComponent;