Skip to content

Commit f6e0416

Browse files
authored
fix(input): change focus token used on ionic theme (#30053)
Issue number: internal --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? - Changed input focus token. - Replaced some hard values with equivalent token. - Updated snapshots. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change: 1. Describe the impact and migration path for existing applications below. 2. Update the BREAKING.md file with the breaking change. 3. Add "BREAKING CHANGE: [...]" to the commit description when merging. See https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#footer for more information. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> - [Input Ionic Theme](https://ionic-framework-dprip7ii9-ionic1.vercel.app/src/components/input/test/basic?ionic:theme=ionic)
1 parent 4782a1a commit f6e0416

10 files changed

+7
-7
lines changed

core/src/components/input/input.ionic.scss

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -23,15 +23,15 @@
2323
// --------------------------------------------------
2424

2525
:host(.input-size-medium) .native-wrapper {
26-
min-height: 40px;
26+
min-height: globals.$ion-scale-1000;
2727
}
2828

2929
:host(.input-size-large) .native-wrapper {
30-
min-height: 48px;
30+
min-height: globals.$ion-scale-1200;
3131
}
3232

3333
:host(.input-size-xlarge) .native-wrapper {
34-
min-height: 56px;
34+
min-height: globals.$ion-scale-1400;
3535
}
3636

3737
// Ionic Input Password Toggle Sizes
@@ -57,7 +57,7 @@
5757
position: absolute;
5858

5959
height: 100%;
60-
min-height: 48px;
60+
min-height: globals.$ion-scale-1200;
6161

6262
transform: translateY(-50%);
6363

@@ -85,8 +85,8 @@
8585
// ----------------------------------------------------------------
8686

8787
.input-clear-icon {
88-
width: 16px;
89-
height: 16px;
88+
width: globals.$ion-scale-400;
89+
height: globals.$ion-scale-400;
9090

9191
color: globals.$ion-primitives-neutral-500;
9292
}
@@ -236,7 +236,7 @@
236236
// ----------------------------------------------------------------
237237

238238
:host(.has-focus) {
239-
--border-color: #{globals.$ion-semantics-primary-base};
239+
--border-color: #{globals.$ion-border-focus-default};
240240
}
241241

242242
:host(.has-focus) .input-highlight {
-161 Bytes
Loading
-41 Bytes
Loading
-170 Bytes
Loading
-166 Bytes
Loading
-55 Bytes
Loading
-181 Bytes
Loading
-276 Bytes
Loading
-264 Bytes
Loading
-321 Bytes
Loading

0 commit comments

Comments
 (0)