From 3fedaf7d5f10013460034fa8dff9977578ee357d Mon Sep 17 00:00:00 2001
From: Elio Struyf <elio@struyfconsulting.be>
Date: Wed, 24 Apr 2024 15:38:25 +0200
Subject: [PATCH] Update snippets list

---
 src/dashboardWebView/components/Layout/SponsorMsg.tsx     | 2 +-
 src/dashboardWebView/components/SnippetsView/Snippets.tsx | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/dashboardWebView/components/Layout/SponsorMsg.tsx b/src/dashboardWebView/components/Layout/SponsorMsg.tsx
index 6e592c88..b5c7616e 100644
--- a/src/dashboardWebView/components/Layout/SponsorMsg.tsx
+++ b/src/dashboardWebView/components/Layout/SponsorMsg.tsx
@@ -36,7 +36,7 @@ export const SponsorMsg: React.FunctionComponent<ISponsorMsgProps> = ({
   return (
     <footer
       className={`w-full px-4 py-2 text-center space-x-8 flex items-center border-t ${isBacker ? 'justify-center' : 'justify-between'
-        } bg-[var(--vscode-editor-background)] text-[var(--vscode-editor-foreground)] border-[var(--frontmatter-border)]`}
+        } bg-[var(--vscode-editor-background)] text-[var(--frontmatter-secondary-text)] border-[var(--frontmatter-border)]`}
     >
       {isBacker ? (
         <span>
diff --git a/src/dashboardWebView/components/SnippetsView/Snippets.tsx b/src/dashboardWebView/components/SnippetsView/Snippets.tsx
index a545dd82..2e2070a0 100644
--- a/src/dashboardWebView/components/SnippetsView/Snippets.tsx
+++ b/src/dashboardWebView/components/SnippetsView/Snippets.tsx
@@ -17,6 +17,7 @@ import { Item } from './Item';
 import { NewForm } from './NewForm';
 import * as l10n from '@vscode/l10n';
 import { LocalizationKey } from '../../../localization';
+import { List } from '../Media/List';
 
 export interface ISnippetsProps { }
 
@@ -128,14 +129,13 @@ export const Snippets: React.FunctionComponent<ISnippetsProps> = (
         )}
 
         {(snippetKeys && snippetKeys.length > 0) ? (
-          <ul
-            role="list"
-            className={`grid grid-cols-2 gap-x-4 gap-y-8 sm:grid-cols-3 sm:gap-x-6 lg:grid-cols-4 xl:gap-x-8`}
+          <List
+            gap={4}
           >
             {snippetKeys.map((snippetKey: any, index: number) => (
               <Item key={index} snippetKey={snippetKey} snippet={snippets[snippetKey]} />
             ))}
-          </ul>
+          </List>
         ) : (
           <div className="w-full h-full flex items-center justify-center text-white">
             <div className={`flex flex-col items-center text-[var(--frontmatter-text)]`}>