fix(studio): filter ui pills text clipping (#44896)

## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

## What kind of change does this PR introduce?

Text was clipping on our filter pills around text input area. 


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Style**
* Improved responsive font sizing in filter bar inputs for better visual
presentation across different screen sizes.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
kemal.earth authored and GitHub committed 2026-04-15 13:22:22 +01:00
1 parent 0939174a92
commit e53b0ff97e
2 files changed
+3 -3

No files matched your search

@@ -340,7 +340,7 @@ export function FilterCondition({
}}
onBlur={handleOperatorBlur}
onKeyDown={handleOperatorKeyDown}
className="h-full border-none bg-transparent py-0 px-1 text-center text-xs focus:outline-none focus:ring-0 focus:shadow-none focus-visible:ring-0 focus-visible:ring-offset-0 text-foreground w-full absolute left-0 top-0"
className="h-full border-none bg-transparent py-0 px-1 text-center text-xs md:text-xs focus:outline-none focus:ring-0 focus:shadow-none focus-visible:ring-0 focus-visible:ring-offset-0 text-foreground w-full absolute left-0 top-0"
disabled={isLoading}
aria-label={`Operator for ${property.label}`}
data-testid={`filter-operator-${property.name}`}
@@ -388,7 +388,7 @@ export function FilterCondition({
onFocus={() => handleInputFocus(path)}
onBlur={handleValueBlur}
onKeyDown={handleValueKeyDown}
className="h-full border-none bg-transparent py-0 px-1 text-xs focus:outline-none focus:ring-0 focus:shadow-none focus-visible:ring-0 focus-visible:ring-offset-0 w-full absolute left-0 top-0"
className="h-full border-none bg-transparent py-0 px-1 text-xs md:text-xs focus:outline-none focus:ring-0 focus:shadow-none focus-visible:ring-0 focus-visible:ring-offset-0 w-full absolute left-0 top-0"
disabled={isLoading}
aria-label={`Value for ${property.label}`}
data-testid={`filter-value-${property.name}`}
@@ -216,7 +216,7 @@ export function FilterGroup({ group, path }: FilterGroupProps) {
onFocus={() => handleGroupFreeformFocus(path)}
onBlur={handleFreeformBlur}
onKeyDown={handleFreeformKeyDown}
className="h-full border-none bg-transparent py-0 text-xs focus:outline-none focus:ring-0 focus:shadow-none focus-visible:ring-0 focus-visible:ring-offset-0 w-full absolute left-0 top-0 px-2"
className="h-full border-none bg-transparent py-0 text-xs md:text-xs focus:outline-none focus:ring-0 focus:shadow-none focus-visible:ring-0 focus-visible:ring-offset-0 w-full absolute left-0 top-0 px-2"
placeholder="+ Add filter"
disabled={isLoading}
autoComplete="off"