update website

2025-01-15 16:18:49 -05:00
parent f0e229979a
commit 0a7d51d32a
21 changed files with 439 additions and 120 deletions
--- a/src/components/RadarChart.tsx
+++ b/src/components/RadarChart.tsx
@@ -0,0 +1,101 @@
+import React from 'react';
+import { Radar } from 'react-chartjs-2';
+import {
+  Chart as ChartJS,
+  RadialLinearScale,
+  PointElement,
+  LineElement,
+  Filler,
+  Tooltip,
+  Legend,
+} from 'chart.js';
+
+ChartJS.register(
+  RadialLinearScale,
+  PointElement,
+  LineElement,
+  Filler,
+  Tooltip,
+  Legend
+);
+
+interface Project {
+  name: string;
+  values: number[];
+}
+
+interface RadarChartProps {
+  projectData: Project[];
+}
+
+// Define a distinct color palette
+const colorPalette = [
+  { border: 'rgba(54, 162, 235, 1)', background: 'rgba(54, 162, 235, 0.2)' }, // Blue
+  { border: 'rgba(255, 99, 132, 1)', background: 'rgba(255, 99, 132, 0.2)' }, // Red
+  { border: 'rgba(75, 192, 192, 1)', background: 'rgba(75, 192, 192, 0.2)' }, // Teal
+  { border: 'rgba(255, 159, 64, 1)', background: 'rgba(255, 159, 64, 0.2)' }, // Orange
+  { border: 'rgba(153, 102, 255, 1)', background: 'rgba(153, 102, 255, 0.2)' }, // Purple
+  { border: 'rgba(255, 205, 86, 1)', background: 'rgba(255, 205, 86, 0.2)' }, // Yellow
+  { border: 'rgba(201, 203, 207, 1)', background: 'rgba(201, 203, 207, 0.2)' }, // Gray
+];
+
+const RadarChart: React.FC<RadarChartProps> = ({ projectData }) => {
+  const data = {
+    labels: ['Decentralization', 'Open Source', 'Tokens', 'API Driven', 'Geo Fencing', 'Capacity'],
+    datasets: projectData.map((project, index) => ({
+      label: project.name,
+      data: project.values,
+      backgroundColor: colorPalette[index % colorPalette.length].background, // Use distinct background color
+      borderColor: colorPalette[index % colorPalette.length].border, // Use distinct border color
+      borderWidth: 1,
+    })),
+  };
+
+  const options = {
+    scales: {
+      r: {
+        min: 0,
+        max: 100,
+        ticks: {
+          stepSize: 20,
+          color: '#fff', // White color for the numbers
+          backdropColor: 'transparent', // Remove the white background
+          showLabelBackdrop: false, // Hide the square around the numbers
+          font: {
+            size: 12, // Adjust the font size if needed
+          },
+        },
+        grid: {
+          color: 'rgba(255, 255, 255, 0.1)', // Light gray grid lines for contrast
+        },
+        angleLines: {
+          color: 'rgba(255, 255, 255, 0.1)', // Light gray angle lines for contrast
+        },
+        pointLabels: {
+          color: '#fff', // White color for point labels
+          font: {
+            size: 12, // Adjust the font size of point labels
+          },
+        },
+      },
+    },
+    plugins: {
+      legend: {
+        position: 'top',
+        labels: {
+          color: '#fff', // White color for legend labels
+        },
+      },
+    },
+  };
+
+  return (
+    <Radar
+      data={data}
+      options={options}
+      style={{ background: 'transparent' }} // Ensure the chart background is transparent
+    />
+  );
+};
+
+export default RadarChart;
--- a/src/pages/support.md
+++ b/src/pages/support.md
@@ -1,38 +0,0 @@
-# Support
-
-Our dedicated team is here to help you every step of the way. We're passionate about ensuring that you receive the best possible experience exploring the ThreeFold ecosystem.
-
-If you can't find the answer to your question, our dedicated ThreeFold support team is here to help.
-
-## Reach Support
-
-***To contact the ThreeFold support team, simply click on the chat button at the bottom right of the screen.***
-
-You can also visit the [ThreeFold Support Crisp website](https://threefoldfaq.crisp.help/en/).
-
-## Live Chat Availability
-
-Our support team is available from Monday to Friday, Central European Summer Time (CEST), between 8:00 AM and 12:00 AM (16 hours per day). During these hours, you can interact with us in real-time via live chat on the ThreeFold website.
-
-* **Monday to Friday**: Available from 8:00 AM to 12:00 AM CEST
-
-> Outside of these hours, you can still write to the support team and they will get back to you during working hours.
-
-## How We Can Help
-
-Our support team is here to assist you with any questions or concerns you may have about ThreeFold. Whether it's troubleshooting an issue, setting up a new feature, or simply answering a question, we're here to help.
-
-### Support Services
-* **Technical Support**: Assistance with technical issues related to ThreeFold.
-* **Feature Setup**: Guidance on how to set up and use various ThreeFold features, services and products.
-* **General Questions**: Answers to any questions you may have about ThreeFold.
-
-## Get In Touch
-
-Ready to reach out? Simply click on the chat button at the bottom right of the screen and initiate a chat with us during business hours. 
-
-*We're here to listen, assist, and provide support!*
-
---
-
-