glyphdiff.com/frontend-svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add tailwind responsive classes

Browse Source
This commit is contained in:
Ilia Mashkov
2026-02-06 14:48:44 +03:00
parent a26bcbecff
commit fedf3f88e7
14 changed files with 106 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/shared/ui/SearchBar/SearchBar.svelte
View File

@@ -41,8 +41,8 @@ function handleKeyDown(event: KeyboardEvent) {
</script>
<div class="relative w-full">
<div class="absolute left-5 top-1/2 -translate-y-1/2 pointer-events-none z-10">
<AsteriskIcon class="size-4 stroke-gray-400 stroke-[1.5]" />
<div class="absolute left-4 sm:left-5 top-1/2 -translate-y-1/2 pointer-events-none z-10">
<AsteriskIcon class="size-3 sm:size-4 stroke-gray-400 stroke-[1.5]" />
</div>
<Input
id={id}
@@ -50,7 +50,7 @@ function handleKeyDown(event: KeyboardEvent) {
bind:value={value}
onkeydown={handleKeyDown}
class="
h-16 w-full text-base
h-12 sm:h-14 md:h-16 w-full text-sm sm:text-base
backdrop-blur-md bg-white/80
border border-gray-300/50
shadow-[0_1px_3px_rgba(0,0,0,0.04)]
@@ -64,9 +64,9 @@ function handleKeyDown(event: KeyboardEvent) {
text-gray-900
placeholder:text-gray-400
placeholder:font-mono
placeholder:text-sm
placeholder:text-xs sm:placeholder:text-sm
placeholder:tracking-wide
pl-14 pr-6
pl-11 sm:pl-14 pr-4 sm:pr-6
rounded-xl
transition-all duration-200
font-medium