feat: gradient

packages/website/src/pages/[...locale]/api/_index.tsx

@@ -1,6 +1,7 @@
 import { OpenInNewWindowIcon } from '@radix-ui/react-icons';
-import { Code, IconButton, Link, Table } from '@radix-ui/themes';
+import { Box, Code, IconButton, Link, Table } from '@radix-ui/themes';
 import { useState } from 'react';
+import { Var } from '../../../core/radix/var';
 import type { APIPath } from './index.astro';
 
 interface SlugsTableProps {
@@ -71,6 +72,19 @@ export function SlugsTable({ slugs, path }: SlugsTableProps) {
         })}
 
         <Table.Row style={{ position: 'relative' }}>
+          {!expanded && (
+            <Box
+              width="100%"
+              height="100%"
+              position="absolute"
+              top="0"
+              style={{
+                transform: 'translate(0, -100%)',
+                background: `linear-gradient(${Var('black-a1')}, ${Var('black-a5')})`,
+              }}
+            />
+          )}
+
           <Table.Cell />
 
           <Link

packages/website/src/pages/[...locale]/api/index.astro

@@ -126,7 +126,7 @@ apis.sort((a, b) => a.path.localeCompare(b.path));
 ---
 
 <ToolLayout tool={apiTool}>
-  <PageWrapper py="9" color="iris">
+  <PageWrapper py="9" color="indigo">
     <Flex direction="column" gap="6">
       {
         apis.map((api, index) => (

packages/website/src/pages/[...locale]/index.astro

@@ -10,6 +10,7 @@ import HomeHero from '../../components/HomeHero.astro';
 import { Plugs } from '../../components/Plugs';
 import ToolCard from '../../components/ToolCard.astro';
 import {
+  apiTool,
   compareTool,
   discordTool,
   embedTool,
@@ -102,10 +103,11 @@ export const getStaticPaths = (() => {
 
       <Flex gap="4" direction={{ initial: 'column', sm: 'row' }}>
         <ToolCard tool={embedTool} />
-        <ToolCard tool={moreTool} />
+        <ToolCard tool={apiTool} />
       </Flex>
 
       <Flex gap="4" direction={{ initial: 'column', sm: 'row' }}>
+        <ToolCard tool={moreTool} />
         <Box flexGrow="1" />
       </Flex>