javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-07 15:07:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(input): match valid state to ionic design (#29277)

Browse Source 
Co-authored-by: Sean Perkins <13732623+sean-perkins@users.noreply.github.com>
Co-authored-by: ionitron <hi@ionicframework.com>
This commit is contained in:
Maria Hutt
2024-04-11 12:22:03 -07:00
committed by GitHub
parent c30d685c32
commit 67ec7455a8
33 changed files with 92 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
core/src/components/input/input.ionic.scss
View File

@ -9,6 +9,7 @@
:host {
--border-width: #{$ionic-border-size-small};
--border-color: #{$ionic-color-neutral-300};
--highlight-color-valid: #{$ionic-color-success-400};
--highlight-color-invalid: #{$ionic-color-error-400};
--text-color-invalid: #{$ionic-color-error-600};
}
@ -20,6 +21,16 @@
min-height: 48px;
}
// Input Bottom Content
// ----------------------------------------------------------------
.input-bottom {
@include padding-horizontal(0, 0);
// TODO(FW-6112): Update it to `$ionic-font-weight-medium` when it's available
font-weight: var(--ionic-font-weight-medium, 500);
}
// Input Hint Text
// ----------------------------------------------------------------
@ -27,6 +38,10 @@
color: tokens.$ionic-color-neutral-600;
}
:host(.has-focus.ion-valid) .helper-text {
color: #{tokens.$ionic-color-success-800};
}
:host(.ion-touched.ion-invalid) .error-text {
color: var(--text-color-invalid);
}