From 59e8f6b8883d4255bd01a7bb3e2ad6b62fdd332b Mon Sep 17 00:00:00 2001
From: Filipe Moreira <xfilipepenna2@gmail.com>
Date: Wed, 21 Oct 2026 14:54:57 -0300
Subject: [PATCH] feat(newtab): send arrow instead of OK on the search box

The new tab's search button now shows the send arrow browsers use at the
end of their search box, as a square accent button. The label moves to
aria-label (a11y.search), so screen readers still read "Pesquisar".

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 app/src/assets/home.css    | 9 ++++++---
 app/src/assets/newtab.html | 2 +-
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/app/src/assets/home.css b/app/src/assets/home.css
index 54990f5..1ab9b0b 100644
--- a/app/src/assets/home.css
+++ b/app/src/assets/home.css
@@ -43,16 +43,19 @@ main {
   font-size: var(--text-lg);
 }
 .search input:focus { border-color: var(--accent); box-shadow: 0 0 0 var(--focus-ring) color-mix(in srgb, var(--accent) 45%, transparent); outline: none; }
+/* The send arrow browsers put at the end of their search box. */
 .search .go {
+  display: grid;
+  place-items: center;
+  width: calc(64 * var(--u));
   height: calc(64 * var(--u));
-  padding: 0 var(--space-5);
+  padding: 0;
   border: 0;
   border-radius: var(--radius);
   background: var(--accent);
   color: var(--accent-text);
-  font-size: var(--text-base);
-  font-weight: 700;
 }
+.search .go svg { width: calc(28 * var(--u)); height: calc(28 * var(--u)); fill: currentColor; }
 
 .engine { color: var(--faint); font-size: var(--text-sm); margin: 0; }
 
diff --git a/app/src/assets/newtab.html b/app/src/assets/newtab.html
index 5ffb14f..5db6ce1 100644
--- a/app/src/assets/newtab.html
+++ b/app/src/assets/newtab.html
@@ -14,7 +14,7 @@
     <div class="logo"><img src="logo.png" alt=""><span>Joy<b>Chromium</b></span></div>
     <form id="search" class="search" role="search" data-i18n-aria-label="a11y.search" aria-label="Pesquisar">
       <input id="q" autofocus autocomplete="off" spellcheck="false" data-i18n-placeholder="home.search" data-i18n-aria-label="a11y.search" aria-label="Pesquisar" placeholder="Pesquisar ou digitar um endereço">
-      <button class="go" type="submit" data-i18n="input.ok">OK</button>
+      <button class="go" type="submit" data-i18n-aria-label="a11y.search" aria-label="Pesquisar"><svg viewBox="0 0 24 24" aria-hidden="true"><path d="M3.4 20.4 21.85 12.5a.55.55 0 0 0 0-1L3.4 3.6a.55.55 0 0 0-.76.62L4.6 11 13 12l-8.4 1-1.96 6.78a.55.55 0 0 0 .76.62Z"/></svg></button>
     </form>
     <p class="engine" id="engine"></p>
   </section>