refactor: light mode for Services page

containers · Jun 20, 2024 · f6b1528 · f6b1528
1 parent d06e021
commit f6b1528
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 17 deletions.
diff --git a/packages/frontend/src/lib/table/service/ServiceColumnModelName.svelte b/packages/frontend/src/lib/table/service/ServiceColumnModelName.svelte
@@ -4,13 +4,13 @@ export let object: InferenceServer;
 </script>
 
 {#if object.models.length === 1}
-  <span class="text-sm text-gray-700">
+  <span class="text-sm text-[var(--pd-table-body-text)]">
     {object.models[0].name}
   </span>
 {:else}
   <ul>
     {#each object.models as model}
-      <li class="text-sm text-gray-700">{model.name}</li>
+      <li class="text-sm text-[var(--pd-table-body-text)]">{model.name}</li>
     {/each}
   </ul>
 {/if}
diff --git a/packages/frontend/src/lib/table/service/ServiceColumnName.svelte b/packages/frontend/src/lib/table/service/ServiceColumnName.svelte
@@ -10,7 +10,7 @@ function openDetails() {
 
 <button
   title="Open service details"
-  class="text-sm text-gray-700 w-full text-ellipsis overflow-hidden"
+  class="text-sm text-[var(--pd-table-body-text-highlight)] w-full text-ellipsis overflow-hidden"
   on:click="{() => openDetails()}">
   {object.container.containerId}
 </button>
diff --git a/packages/frontend/src/pages/InferenceServers.svelte b/packages/frontend/src/pages/InferenceServers.svelte
@@ -65,21 +65,23 @@ function createNewService() {
               row="{row}"
               bind:selectedItemsNumber="{selectedItemsNumber}" />
           {:else}
-            <div role="status">
-              There is no model service. You can <a
-                href="{'javascript:void(0);'}"
-                class="underline"
-                role="button"
-                title="Create a new Model Service"
-                on:click="{createNewService}">create one now</a
-              >.
+            <div class="text-[var(--pd-details-body-text)]">
+              <div role="status">
+                There is no model service. You can <a
+                  href="{'javascript:void(0);'}"
+                  class="underline"
+                  role="button"
+                  title="Create a new Model Service"
+                  on:click="{createNewService}">create one now</a
+                >.
+              </div>
+              <p>
+                A model service offers a configurable endpoint via an OpenAI-compatible web server, facilitating a
+                seamless integration of AI capabilities into existing applications. Upon initialization, effortlessly
+                access detailed service information and generate code snippets in multiple programming languages to ease
+                application integration.
+              </p>
             </div>
-            <p>
-              A model service offers a configurable endpoint via an OpenAI-compatible web server, facilitating a
-              seamless integration of AI capabilities into existing applications. Upon initialization, effortlessly
-              access detailed service information and generate code snippets in multiple programming languages to ease
-              application integration.
-            </p>
           {/if}
         </div>
       </div>