UI details for code editor

nighca · Jan 7, 2025 · e52c0aa · e52c0aa
1 parent 6ed40a6
commit e52c0aa
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 4 deletions.
diff --git a/spx-gui/src/components/editor/code-editor/ui/completion/CompletionItem.vue b/spx-gui/src/components/editor/code-editor/ui/completion/CompletionItem.vue
@@ -54,9 +54,11 @@ watchEffect(() => {
   min-width: 8em;
   display: flex;
   align-items: center;
-  padding: 8px;
+  padding: 7px;
   border-radius: var(--ui-border-radius-1);
   cursor: pointer;
+  font-size: 12px;
+  color: var(--ui-color-grey-1000);
   &:hover {
     background: var(--ui-color-grey-300);
   }
@@ -66,7 +68,7 @@ watchEffect(() => {
 }
 
 .icon {
-  margin-right: 4px;
+  margin-right: 8px;
 }
 
 .code {

diff --git a/spx-gui/src/components/editor/code-editor/ui/hover/index.ts b/spx-gui/src/components/editor/code-editor/ui/hover/index.ts
@@ -96,7 +96,6 @@ export class HoverController extends Emitter<{
         range: diagnostic.range,
         actions: [
           {
-            title: 'Fix',
             command: builtInCommandCopilotFixProblem,
             arguments: [
               {

diff --git a/spx-gui/src/components/editor/code-editor/ui/markdown/DiagnosticItem.vue b/spx-gui/src/components/editor/code-editor/ui/markdown/DiagnosticItem.vue
@@ -10,7 +10,9 @@ defineProps<{
 <template>
   <div class="diagnostic-item">
     <UIIcon class="icon" :type="severity" />
-    <slot></slot>
+    <div class="body">
+      <slot></slot>
+    </div>
   </div>
 </template>
 
@@ -25,4 +27,9 @@ defineProps<{
 .icon {
   margin-top: 1px;
 }
+
+.body {
+  flex: 1;
+  color: var(--ui-color-grey-1000);
+}
 </style>