further restructuring

src/components/bookmarks/item.jsx

@@ -20,7 +20,7 @@ export default function Item({ bookmark }) {
           </div>
           <div className="flex-1 flex items-center justify-between rounded-r-md ">
             <div className="flex-1 grow pl-3 py-2 text-xs">{bookmark.name}</div>
-            <div className="px-2 py-2 truncate text-theme-500 dark:text-theme-400 text-xs">{hostname}</div>
+            <div className="px-2 py-2 truncate text-theme-500 dark:text-theme-300 text-xs">{hostname}</div>
           </div>
         </div>
       </a>

src/components/services/item.jsx

@@ -74,14 +74,14 @@ export default function Item({ service }) {
             >
               <div className="flex-1 px-2 py-2 text-sm text-left">
                 {service.name}
-                <p className="text-theme-500 dark:text-theme-400 text-xs font-light">{service.description}</p>
+                <p className="text-theme-500 dark:text-theme-300 text-xs font-light">{service.description}</p>
               </div>
             </a>
           ) : (
             <div className="flex-1 flex items-center justify-between rounded-r-md ">
               <div className="flex-1 px-2 py-2 text-sm text-left">
                 {service.name}
-                <p className="text-theme-500 dark:text-theme-400 text-xs font-light">{service.description}</p>
+                <p className="text-theme-500 dark:text-theme-300 text-xs font-light">{service.description}</p>
               </div>
             </div>
           )}

src/components/services/widget/container.jsx

@@ -1,4 +1,4 @@
-export default function Widget({ error = false, children }) {
+export default function Container({ error = false, children }) {
   if (error) {
     return (
       <div className="bg-theme-200/50 dark:bg-theme-900/20 rounded m-1 flex-1 flex flex-col items-center justify-center p-1">

src/components/version.jsx

@@ -26,7 +26,7 @@ export default function Version() {
 
   return (
     <div className="flex flex-row items-center">
-      <span className="text-xs text-theme-500">
+      <span className="text-xs text-theme-500 dark:text-theme-400">
         {version} ({revision.substring(0, 7)}, {formatDate(buildTime)})
       </span>
       {version === "main" || version === "dev" || version === "nightly"
@@ -37,7 +37,7 @@ export default function Version() {
               href={latestRelease.html_url}
               target="_blank"
               rel="noopener noreferrer"
-              className="ml-2 text-xs text-theme-500 flex flex-row items-center"
+              className="ml-2 text-xs text-theme-500 dark:text-theme-400 flex flex-row items-center"
             >
               <MdNewReleases className="mr-1" /> {t("Update Available")}
             </a>