search zoom hack

the-pudding · Nov 25, 2024 · b866e5e · b866e5e
1 parent b5030ee
commit b866e5e
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/src/components/Home.svelte b/src/components/Home.svelte
@@ -32,7 +32,7 @@
     <div class="search">
       <!-- <span>Search</span> -->
       <img class="icon" src="assets/stickers/[email protected]" aria-hidden="true" alt="" />
-      <input placeholder="Find a story" bind:value={searchValue} />
+      <input type="text" placeholder="Find a story" bind:value={searchValue} />
     </div>
     <div class="filters">
       <Filters {filters} bind:activeFilter></Filters>
@@ -61,15 +61,14 @@
   }
 
   input {
-    margin-left: 4px;
+    /* margin-left: 4px; */
     width: 10em;
     outline: 2px solid var(--color-fg);
     border-radius: 1px;
   }
 
   input::placeholder {
     font-family: var(--mono);
-    font-size: var(--12px);
   }
 
   .icon {
@@ -84,7 +83,7 @@
 
   @media only screen and (min-width: 400px) {
     input {
-      margin-left: 8px;
+      margin-left: -8px;
       width: 12em;
     }
   }

diff --git a/src/styles/app.css b/src/styles/app.css
@@ -165,4 +165,11 @@ svg {
 
 .inner strong, li strong {
 	font-family: var(--sans);
+}
+
+input[type="search"], 
+input[type="text"], 
+textarea {
+  font-size: 16px;
+	transform: scale(0.75);
 }