Shinnex
/
shx-product-pipeline-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

better title

main
alex 2024-05-30 14:03:19 +02:00
parent 209711cc9f
commit 04f7fdc236
2 changed files with 114 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/App.css
View File

@ -9,6 +9,7 @@
.container { .container {
width: 100%; width: 100%;
max-width: 1100px; max-width: 1100px;
padding: 12px;
} }
.subtitle { .subtitle {
@ -33,7 +34,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 12px; gap: 12px;
padding: 20px; padding-top: 20px;
width: 100%; width: 100%;
max-width: 800px; max-width: 800px;
} }
@ -42,6 +43,7 @@
background-color: #fff; background-color: #fff;
padding: 16px 20px; padding: 16px 20px;
border-radius: 40px; border-radius: 40px;
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
} }
.card span { .card span {

44
src/App.js
View File

@ -181,7 +181,7 @@ function App() {
setInterval(() => fetchProducts(), 5000); setInterval(() => fetchProducts(), 5000);
}, []); }, []);
// function to send the height to the iframe // send the height to the iframe
function sendPageHeightToIframe() { function sendPageHeightToIframe() {
const height = document.body.scrollHeight; const height = document.body.scrollHeight;
@ -193,11 +193,11 @@ function App() {
return ( return (
<div className="app"> <div className="app">
<div className="container" style={{ paddingTop: 20 }}> <div className="container">
<span className="subtitle">Immer auf dem aktuellen Stand sein</span> <span className="subtitle">Auf dem Laufenden bleiben</span>
<h1 className="header">Neue Produkte</h1> <h1 className="header">Unsere neuesten Produkte</h1>
<div className="cards-container" style={{ paddingBottom: 20 }}> <div className="cards-container" style={{ paddingBottom: 40 }}>
<div className="cards"> <div className="cards">
{products.NewProducts.length > 0 ? ( {products.NewProducts.length > 0 ? (
<> <>
@ -235,10 +235,10 @@ function App() {
</div> </div>
</div> </div>
<span className="subtitle">Was als nächstes kommt</span> <span className="subtitle">Bald bei uns erhältlich</span>
<h1 className="header">Aktuell in Arbeit</h1> <h1 className="header">Aktuell in Arbeit</h1>
<div className="cards-container" style={{ paddingBottom: 20 }}> <div className="cards-container" style={{ paddingBottom: 40 }}>
<div className="cards"> <div className="cards">
{products.InWorkProducts.length > 0 ? ( {products.InWorkProducts.length > 0 ? (
<> <>
@ -272,19 +272,21 @@ function App() {
</div> </div>
</div> </div>
<span className="subtitle">Jede Stimme zählt</span> <span className="subtitle">Jetzt abstimmen</span>
<h1 className="header">Zukünftige Produkte</h1> <h1 className="header">Zukünftige Produkte</h1>
<Flex justify="center" style={{ marginTop: 4 }}>
<span style={{ color: "#474747", maxWidth: 800 }}>
Gestalte unser Sortiment mit! Hier hast du die Möglichkeit, für das
nächste Produkt abzustimmen und die Reihenfolge zukünftiger Produkte
mit deiner Stimme zu beeinflussen. Deine Meinung zählt!
</span>
</Flex>
<div className="cards-container"> <div className="cards-container">
<div className="cards"> <div className="cards" style={{ paddingBottom: 20 }}>
{products.FutureProducts.length > 0 ? ( {products.FutureProducts.length > 0 ? (
<> <>
{products.FutureProducts {products.FutureProducts.sort((a, b) => b.Votes - a.Votes).map(
/*.sort((a, b) =>
a.Name.localeCompare(b.Name)
)*/
.sort((a, b) => b.Votes - a.Votes)
.map(
(product, index) => (product, index) =>
(showMore.futureProducts || index < 5) && ( (showMore.futureProducts || index < 5) && (
<motion.div <motion.div
@ -307,8 +309,7 @@ function App() {
color: color:
votes.findIndex( votes.findIndex(
(vote) => (vote) =>
vote.n === product.Name && vote.n === product.Name && vote.t === 0
vote.t === 0
) > -1 ) > -1
? "red" ? "red"
: "#000", : "#000",
@ -317,8 +318,7 @@ function App() {
if ( if (
votes.findIndex( votes.findIndex(
(vote) => (vote) =>
vote.n === product.Name && vote.n === product.Name && vote.t === 0
vote.t === 0
) === -1 ) === -1
) { ) {
VoteRequest(product.Name, false); VoteRequest(product.Name, false);
@ -347,8 +347,7 @@ function App() {
color: color:
votes.findIndex( votes.findIndex(
(vote) => (vote) =>
vote.n === product.Name && vote.n === product.Name && vote.t === 1
vote.t === 1
) > -1 ) > -1
? "green" ? "green"
: "#000", : "#000",
@ -357,8 +356,7 @@ function App() {
if ( if (
votes.findIndex( votes.findIndex(
(vote) => (vote) =>
vote.n === product.Name && vote.n === product.Name && vote.t === 1
vote.t === 1
) === -1 ) === -1
) { ) {
VoteRequest(product.Name, true); VoteRequest(product.Name, true);