From 1f83cc73a02e2a241a4a3f2b6c372917e7f55fb8 Mon Sep 17 00:00:00 2001 From: GalvinPython Date: Sat, 7 Feb 2026 21:28:35 +0000 Subject: [PATCH] feat(site): make diagonals look better colour-wise --- web/package.json | 48 +++++++++++------------ web/src/components/FAQ.tsx | 34 +++++++++++++--- web/src/components/FeaturesDiagonal.tsx | 8 ++-- web/src/components/FeaturesYouTube.tsx | 8 ++-- web/src/components/Navbar.tsx | 52 +++++++++++++++++++++---- web/src/components/TrustedBy.tsx | 2 +- web/src/pages/invite/[...slug].astro | 2 +- 7 files changed, 107 insertions(+), 47 deletions(-) diff --git a/web/package.json b/web/package.json index eec61ab..62389da 100644 --- a/web/package.json +++ b/web/package.json @@ -1,26 +1,26 @@ { - "name": "feedr-web", - "type": "module", - "scripts": { - "dev": "astro dev", - "start": "astro dev", - "build": "astro build", - "preview": "astro preview", - "astro": "astro" - }, - "dependencies": { - "@astrojs/tailwind": "^5.1.0", - "@fontsource/inter": "^5.0.18", - "@number-flow/react": "^0.5.9", - "@skyra/discord-components-react": "^3.6.1", - "astro": "^4.9.2", - "framer-motion": "^11.2.10", - "react-icons": "^5.5.0", - "tailwindcss": "^3.4.3" - }, - "devDependencies": { - "@astrojs/react": "^3.4.0", - "react": "^18.3.1", - "react-dom": "^18.3.1" - } + "name": "feedr-web", + "type": "module", + "scripts": { + "dev": "astro dev --host", + "start": "astro dev", + "build": "astro build", + "preview": "astro preview", + "astro": "astro" + }, + "dependencies": { + "@astrojs/tailwind": "^5.1.0", + "@fontsource/inter": "^5.0.18", + "@number-flow/react": "^0.5.9", + "@skyra/discord-components-react": "^3.6.1", + "astro": "^4.9.2", + "framer-motion": "^11.2.10", + "react-icons": "^5.5.0", + "tailwindcss": "^3.4.3" + }, + "devDependencies": { + "@astrojs/react": "^3.4.0", + "react": "^18.3.1", + "react-dom": "^18.3.1" + } } \ No newline at end of file diff --git a/web/src/components/FAQ.tsx b/web/src/components/FAQ.tsx index b101311..462c625 100644 --- a/web/src/components/FAQ.tsx +++ b/web/src/components/FAQ.tsx @@ -6,6 +6,30 @@ const FAQData = [ question: "How often does Feedr check for new posts?", answer: "YouTube: 3 seconds, Twitch: 2 seconds", }, + { + question: "Is Feedr free to use?", + answer: "Yes, Feedr is free to use, and will be free forever with YouTube and Twitch support as they have free API platforms. However, other social media platforms that we wish to support in the future may are not so kind and may require a subscription; however this is not planned at the moment due to legal reasons.", + }, + { + question: "Which platforms does Feedr support?", + answer: "Currently, Feedr supports YouTube and Twitch. We plan to add more platforms in the future based on user feedback.", + }, + { + question: "What platforms are planned for future support?", + answer: "We can't guarantee any specific platforms at the moment, and are pending developer agreements and costs. Bluesky is one platform we are looking into, but nothing is confirmed yet", + }, + { + question: "Can I self-host Feedr?", + answer: "Yes! Feedr is open-source and can be self-hosted. You can find the source code on our GitHub repository. Please note that self-hosting will require your own server and API keys.", + }, + { + question: "Where is Feedr hosted?", + answer: "Feedr is hosted on cloud infrastructure to ensure reliability and scalability. However, we are hosted in the EU and comply with GDPR regulations.", + }, + { + question: "How can I provide feedback or report issues?", + answer: "You can provide feedback or report issues by visiting our GitHub repository and opening an issue. Feedr's Discord support is handled through our sister project, socialstats.app. Email support is not available at this time.", + }, ]; export const FAQ = () => ( @@ -59,9 +83,8 @@ const FAQBox = ({ defaultOpen, title, content }) => { {title}

{content}

@@ -73,9 +96,8 @@ const FAQBox = ({ defaultOpen, title, content }) => { viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" - className={`transition-all duration-500 ${ - isOpen ? "rotate-[180deg]" : "rotate-[90deg]" - }`} + className={`transition-all duration-500 ${isOpen ? "rotate-[180deg]" : "rotate-[90deg]" + }`} > { return (
@@ -19,7 +19,7 @@ export const FeaturesDiagonal = () => { >
@@ -29,7 +29,7 @@ export const FeaturesDiagonal = () => { viewport={{ once: true }} transition={{ duration: 0.5, delay: 0.2 }} > -
+
Twitch

@@ -68,7 +68,7 @@ export const FeaturesDiagonal = () => { >

diff --git a/web/src/components/FeaturesYouTube.tsx b/web/src/components/FeaturesYouTube.tsx index c2149c7..c8a7179 100644 --- a/web/src/components/FeaturesYouTube.tsx +++ b/web/src/components/FeaturesYouTube.tsx @@ -6,7 +6,7 @@ import featYoutube from "../assets/images/feat_youtube.png"; export const FeaturesYouTube = () => { return (
@@ -19,7 +19,7 @@ export const FeaturesYouTube = () => { >
@@ -29,7 +29,7 @@ export const FeaturesYouTube = () => { viewport={{ once: true }} transition={{ duration: 0.5, delay: 0.2 }} > -
+
YouTube

@@ -69,7 +69,7 @@ export const FeaturesYouTube = () => { >

diff --git a/web/src/components/Navbar.tsx b/web/src/components/Navbar.tsx index f4d306a..4ca797e 100644 --- a/web/src/components/Navbar.tsx +++ b/web/src/components/Navbar.tsx @@ -1,6 +1,6 @@ import { useState } from "react"; import { motion, AnimatePresence } from "framer-motion"; -import { SiGithub } from "react-icons/si"; +import { SiDiscord, SiGithub } from "react-icons/si"; // @ts-ignore This is an image import import FeedrLogo from "../assets/images/feedr.png"; @@ -30,15 +30,15 @@ export const Navbar = () => { exit={{ opacity: 0 }} > -
-
+
+
Feedr Logo
-
+
Feedr
@@ -69,10 +69,10 @@ export const Navbar = () => { transition={{ duration: 0.3 }} exit={{ opacity: 0 }} > -
+ )} diff --git a/web/src/components/TrustedBy.tsx b/web/src/components/TrustedBy.tsx index 03babae..0fec455 100644 --- a/web/src/components/TrustedBy.tsx +++ b/web/src/components/TrustedBy.tsx @@ -14,7 +14,7 @@ export const TrustedBy = () => { transition={{ duration: 0.5, delay: 0.2 }} onViewportEnter={() => { setTimeout(() => { - setOdometerValue(213); + setOdometerValue(387); }, 500); }} > diff --git a/web/src/pages/invite/[...slug].astro b/web/src/pages/invite/[...slug].astro index b166f4f..ad9cca5 100644 --- a/web/src/pages/invite/[...slug].astro +++ b/web/src/pages/invite/[...slug].astro @@ -7,7 +7,7 @@ const { slug } = Astro.params; const redirects = { bot: "https://discord.com/", - server: "https://discord.gg/", + server: "https://discord.gg/3yCp4Ks8v5", }; const destination = redirects[slug];