upd: desktop component

Update the desktop component, write TODO List.

TODO

@@ -0,0 +1,9 @@
+- [x] Home page
+- [x] Download page
+    - [ ] Porting (will be outdated by site release)
+- [x] News page
+    - [ ] Porting
+- [ ] *New* developers page, about why RL is great for development
+- [ ] Unicorn Page redesign.
+- [ ] Mission statement
+- [ ] Links

src/components/home/desktop.jsx

@@ -2,20 +2,15 @@ import React from "react";
 
 const data = [
     {
-        title: "Title 1",
-        description: "Description 1",
+        title: "Adaptive, to any workflow.",
+        description: "Whether you prefer the traditional floating windows, or are a fanatic of tiling window managers, Unicorn is perfect for you. With optional auto-tiling you can easily toggle between floating and tiling at the press of a button.",
         image: "../img/home/unicorn/tiling.webp"
     },
     {
-        title: "Title 2",
-        description: "Description 2",
+        title: "A brand new dashboard.",
+        description: "You can switch between virtual desktops with ease. We have loaded in Xfdashboard, with many minor tweaks and improvements. Xfdashboard brings a gnome-shell like virtual desktop and èxpose built right into XFCE.",
         image: "../img/home/unicorn/xfdashboard.webp"
     },
-    {
-        title: "Title 3",
-        description: "Description 3",
-        image: "../img/home/unicorn/appgrid.webp"
-    }
 
 ]
 
@@ -24,11 +19,11 @@ function Desktop() {
       <div className="w-full bg-site-300 lg:p-8 p-4">
         <h1 className="text-white text-5xl text-center">Enjoy an adaptive desktop.</h1>
         <p className="lg:w-[70%] m-auto text-white text-xl pb-4 text-center pt-4">Rhino Linux comes preinstalled with its own in-house desktop experience, Unicorn, a custom built XFCE desktop experience combining the best of the traditional and modern takes on the Desktop.</p>
-        <div className="lg:w-[75%] m-auto w-[95%] lg:grid lg:grid-cols-3 gap-8">
+        <div className="lg:w-[75%] m-auto w-[95%] lg:grid lg:grid-cols-2 gap-8">
           {data.map((item, index) => (
             <div key={index} className="">
-              <img src={item.image ? item.image : "https://via.placeholder.com/150.png"} alt={item.title} className="w-full h-48 object-cover rounded-lg" />
-              <h1 className="text-white text-xl font-bold mt-4">{item.title}</h1>
+              <img src={item.image ? item.image : "https://via.placeholder.com/150.png"} alt={item.title} className="w-full h-auto object-cover rounded-lg" />
+              <h1 className="text-white text-2xl mt-4">{item.title}</h1>
               <p className="text-white mt-2">{item.description}</p>
             </div>
           ))}