Skip to content

fix: dark input focus rings #114

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
barvian merged 1 commit into from
Aug 31, 2026
Merged

fix: dark input focus rings #114

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions app/internal-explorer/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,7 @@ function SearchBar({ chain, onError }: { chain: ExplorerChain; onError: (error:
spellCheck={false}
autoComplete="off"
className={cn(
'w-full rounded-full border border-bds-gray-10 bg-bds-gray-0 py-3 pl-9 text-sm text-foreground outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:text-white dark:focus:border-bds-blue-40',
'w-full rounded-full border border-bds-gray-10 bg-bds-gray-0 py-3 pl-9 text-sm text-foreground outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:text-white dark:focus:border-white/40',
searchHash.trim() ? 'pr-24' : 'pr-3.5',
)}
/>
Expand Down Expand Up @@ -499,7 +499,7 @@ function RejectedTransactionsTab({ chain }: { chain: ExplorerChain }) {
});

const inputClass =
'rounded-lg border border-bds-gray-10 bg-bds-gray-0 px-3 py-1.5 text-sm text-foreground outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:text-white dark:focus:border-bds-blue-40';
'rounded-lg border border-bds-gray-10 bg-bds-gray-0 px-3 py-1.5 text-sm text-foreground outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:text-white dark:focus:border-white/40';

return (
<section className="flex flex-col gap-4">
Expand Down
2 changes: 1 addition & 1 deletion app/upgrades/changelog/ChangelogClient.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -190,7 +190,7 @@ export function ChangelogClient() {
onChange={handleQueryChange}
placeholder="Search by title, EIP, or summary keyword"
aria-label="Search changes"
className="h-[34px] min-w-[min(100%,14rem)] flex-1 rounded-full border border-bds-gray-10 bg-background px-4 text-[14px] text-foreground outline-none placeholder:text-bds-gray-50"
className="h-[34px] min-w-[min(100%,14rem)] flex-1 rounded-full border border-bds-gray-10 bg-background px-4 text-[14px] text-foreground outline-none transition-colors placeholder:text-bds-gray-50 focus:border-foreground dark:border-white/10 dark:focus:border-white/40"
/>
</div>

Expand Down
2 changes: 1 addition & 1 deletion app/vibenet/components/ExplorerSearch.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,7 @@ export function ExplorerSearch() {
spellCheck={false}
autoComplete="off"
className={cn(
'w-full rounded-full border border-bds-gray-10 bg-bds-gray-0 py-3 pl-9 text-sm text-foreground outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:text-white dark:focus:border-bds-blue-40',
'w-full rounded-full border border-bds-gray-10 bg-bds-gray-0 py-3 pl-9 text-sm text-foreground outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:text-white dark:focus:border-white/40',
hasQuery ? 'pr-20' : 'pr-3.5',
)}
/>
Expand Down
2 changes: 1 addition & 1 deletion app/vibenet/demos/account/components/CreateAccountModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -251,7 +251,7 @@ export function CreateAccountModal({ open, onClose }: CreateAccountModalProps) {
submit();
}
}}
className="w-full rounded-lg border border-bds-gray-10 bg-bds-gray-0 px-3.5 py-2.5 text-[14px] font-normal outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:focus:border-bds-blue-40"
className="w-full rounded-lg border border-bds-gray-10 bg-bds-gray-0 px-3.5 py-2.5 text-[14px] font-normal outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:focus:border-white/40"
/>
</label>

Expand Down
2 changes: 1 addition & 1 deletion app/vibenet/demos/account/components/SessionKeyEditor.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ import { useAccountEngine } from '../useAccountEngine';

const ADDR_RE = /^0x[0-9a-fA-F]{40}$/;
const INPUT_CLS =
'w-full rounded-lg border border-bds-gray-10 bg-bds-gray-0 px-3 py-2 text-[13px] outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:focus:border-bds-blue-40';
'w-full rounded-lg border border-bds-gray-10 bg-bds-gray-0 px-3 py-2 text-[13px] outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:focus:border-white/40';
const CHIP_CLS =
'rounded-full border border-bds-gray-10 px-2.5 py-1 text-[12px] text-bds-gray-60 transition-colors hover:border-bds-gray-15 dark:border-white/10 dark:text-bds-gray-40';
const CHIP_ON = 'border-base-blue bg-bds-blue-0 text-base-blue';
Expand Down
4 changes: 2 additions & 2 deletions app/vibenet/demos/account/components/TransactionModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ import { formatTokenAmount, KIND_LABEL, short, type WalletSigner } from '../shar
import { conciseError, EstimateRevertedError, isSeqMismatch, TxPendingError, useAccountEngine } from '../useAccountEngine';

const INPUT_CLS =
'w-full rounded-lg border border-bds-gray-10 bg-bds-gray-0 px-3 py-2 text-[13px] outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:focus:border-bds-blue-40';
'w-full rounded-lg border border-bds-gray-10 bg-bds-gray-0 px-3 py-2 text-[13px] outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:focus:border-white/40';

export type TransactPreset = { calls: CallRow[]; gasMode?: 'eth' | 'free' | 'usdv'; metadata?: string };
/** Apply the staged owner change, or a specific session key's change. */
Expand Down Expand Up @@ -812,7 +812,7 @@ export function TransactionModal({ onClose, preset, applyTarget }: TransactionMo
spellCheck={false}
placeholder="Optional note / app data — e.g. invoice #4242"
onChange={(e) => setMetaField(e.target.value)}
className="w-full rounded-lg border border-bds-gray-10 bg-bds-gray-0 px-3.5 py-2.5 text-[14px] outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:focus:border-bds-blue-40"
className="w-full rounded-lg border border-bds-gray-10 bg-bds-gray-0 px-3.5 py-2.5 text-[14px] outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:focus:border-white/40"
/>
{metadataHex ? (
<p className="text-[12px] text-bds-gray-60 dark:text-bds-gray-40">
Expand Down
2 changes: 1 addition & 1 deletion app/vibenet/explorer/address/[addr]/OwnedAccountView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ import { ActivityTable } from './ActivityTable';
import { AssetsCard } from './AssetsCard';

const INPUT_CLS =
'w-full rounded-lg border border-bds-gray-10 bg-background px-3.5 py-2.5 text-[14px] outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:focus:border-bds-blue-40';
'w-full rounded-lg border border-bds-gray-10 bg-background px-3.5 py-2.5 text-[14px] outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:focus:border-white/40';

const SECTIONS: ShellSection[] = [
{ id: 'overview', label: 'Overview' },
Expand Down
2 changes: 1 addition & 1 deletion app/vibenet/faucet/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -235,7 +235,7 @@ export default function FaucetPage() {
placeholder="0x…"
spellCheck={false}
autoComplete="off"
className="w-full rounded-lg border border-bds-gray-10 bg-bds-gray-0 px-3.5 py-2.5 text-[14px] font-normal text-foreground outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:text-white dark:focus:border-bds-blue-40"
className="w-full rounded-lg border border-bds-gray-10 bg-bds-gray-0 px-3.5 py-2.5 text-[14px] font-normal text-foreground outline-none transition-colors placeholder:text-bds-gray-40 focus:border-foreground dark:border-white/10 dark:bg-white/5 dark:text-white dark:focus:border-white/40"
/>
</label>
<div className="flex flex-wrap gap-3">
Expand Down
Loading