Make text entry styling more like other places in Fontra

googlefonts · Sep 14, 2023 · f6fd2b1 · f6fd2b1
1 parent 352c98b
commit f6fd2b1
Showing 1 changed file with 9 additions and 5 deletions.
diff --git a/src/fontra/client/web-components/ui-form.js b/src/fontra/client/web-components/ui-form.js
@@ -18,7 +18,7 @@ export class Form extends SimpleElement {
 
     .ui-form {
       display: grid;
-      grid-template-columns: 30% auto;
+      grid-template-columns: 32% auto;
       box-sizing: border-box;
       gap: 0.35rem 0.35rem;
       overflow-x: hidden;
@@ -52,17 +52,21 @@ export class Form extends SimpleElement {
 
     input {
       box-sizing: border-box;
+      background-color: red;
+      background-color: var(--text-input-background-color);
+      color: var(--text-input-foreground-color);
+      border-radius: 0.25em;
+      border: none;
+      outline: none;
+      padding: 0.1em 0.3em;
+      font-family: "fontra-ui-regular";
     }
 
     .ui-form-value {
       box-sizing: border-box;
     }
 
     .ui-form-value input {
-      font-family: "fontra-ui-regular";
-      border: solid 1px var(--ui-form-input-border-color);
-      background-color: var(--ui-form-input-background-color);
-      color: var(--ui-form-input-foreground-color);
       width: min(100%, 9.5em);
     }