fix: Update audio player input styles (#11106)

# Pull Request Template

## Description

This PR fixes styling inconsistencies by excluding specific more input
types (range, color, image, hidden) from receiving the default text
input styles.

## Type of change

- [x] Bug fix (non-breaking change which fixes an issue)

## How Has This Been Tested?

### Screenshots

**Before**
<img width="464" alt="image"
src="https://github.com/user-attachments/assets/6c629600-67d4-41cd-a244-bb45d222d0ca"
/>
<img width="943" alt="image"
src="https://github.com/user-attachments/assets/9037cf52-1791-4680-9b9e-8647c14e2800"
/>



After
<img width="464" alt="image"
src="https://github.com/user-attachments/assets/bf745e33-c58a-4584-8283-855c5ea8fd4e"
/>
<img width="943" alt="image"
src="https://github.com/user-attachments/assets/200e36ee-ab26-48a8-bda4-b69d9ed143f8"
/>




## Checklist:

- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my code
- [ ] I have commented on my code, particularly in hard-to-understand
areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [ ] Any dependent changes have been merged and published in downstream
modules
This commit is contained in:
Sivin Varghese
2025-03-19 08:46:37 +05:30
committed by GitHub
parent e2e4da8b1e
commit 064ab0a7a2
2 changed files with 2 additions and 2 deletions

View File

@@ -72,7 +72,7 @@ textarea {
}
}
$form-input-selector: "input[type]:not([type='file']):not([type='checkbox']):not([type='radio']):not([type='button']):not([type='submit']):not([type='reset']):not(.reset-base):not(.multiselect__input):not(.no-margin)";
$form-input-selector: "input[type]:not([type='file']):not([type='checkbox']):not([type='radio']):not([type='range']):not([type='button']):not([type='submit']):not([type='reset']):not([type='color']):not([type='image']):not([type='hidden']):not(.reset-base):not(.multiselect__input):not(.no-margin)";
#{$form-input-selector} {
@apply field-base h-10;

View File

@@ -70,7 +70,7 @@ onUnmounted(() => {
<input
ref="searchInput"
type="search"
class="w-full m-0 bg-transparent border-transparent shadow-none text-n-slate-12 dark:text-n-slate-12 active:border-transparent active:shadow-none hover:border-transparent hover:shadow-none focus:border-transparent focus:shadow-none"
class="reset-base outline-none w-full m-0 bg-transparent border-transparent shadow-none text-n-slate-12 dark:text-n-slate-12 active:border-transparent active:shadow-none hover:border-transparent hover:shadow-none focus:border-transparent focus:shadow-none"
:placeholder="$t('SEARCH.INPUT_PLACEHOLDER')"
:value="searchQuery"
@focus="onFocus"