Skip to content
This repository was archived by the owner on Sep 5, 2024. It is now read-only.

Commit 14a58a7

Browse files
committed
fix(input-container): align indentation with spec
Fixes #10105. Closes #11421.
1 parent 3d5ff5d commit 14a58a7

File tree

3 files changed

+22
-9
lines changed

3 files changed

+22
-9
lines changed

src/components/input/_input-variables.scss

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ $input-label-default-offset: 24px !default;
44
$input-label-default-scale: 1.0 !default;
55
$input-label-float-offset: 6px !default;
66
$input-label-float-scale: 0.75 !default;
7-
$input-label-float-width: $input-container-padding + 16px !default;
87

98
$input-placeholder-offset: $input-label-default-offset !default;
109

src/components/input/input.scss

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -91,8 +91,8 @@ md-input-container {
9191
order: 1;
9292
pointer-events: none;
9393
-webkit-font-smoothing: antialiased;
94-
@include rtl(padding-left, $input-container-padding + 1px, 0);
95-
@include rtl(padding-right, 0, $input-container-padding + 1px);
94+
@include rtl(padding-left, $input-container-padding, 0);
95+
@include rtl(padding-right, 0, $input-container-padding);
9696
z-index: 1;
9797
transform: translate3d(0, $input-label-default-offset + 4, 0) scale($input-label-default-scale);
9898
transition: transform $swift-ease-out-duration $swift-ease-out-timing-function;
@@ -103,6 +103,13 @@ md-input-container {
103103

104104
@include rtl(transform-origin, left top, right top);
105105
}
106+
&.md-input-has-value {
107+
label:not(.md-no-float):not(.md-container-ignore),
108+
.md-placeholder {
109+
@include rtl(padding-left, $input-container-padding + 1px, 0);
110+
@include rtl(padding-right, 0, $input-container-padding + 1px);
111+
}
112+
}
106113
.md-placeholder {
107114
position: absolute;
108115
top: 0;
@@ -147,8 +154,8 @@ md-input-container {
147154
background: none;
148155
padding-top: $input-padding-top;
149156
padding-bottom: $input-border-width-focused - $input-border-width-default;
150-
padding-left: 2px;
151-
padding-right: 2px;
157+
@include rtl(padding-left, 0, $input-container-padding);
158+
@include rtl(padding-right, $input-container-padding, 0);
152159
border-width: 0 0 $input-border-width-default 0;
153160
line-height: $input-line-height;
154161
height: $input-line-height + ($input-padding-top * 2);
@@ -303,7 +310,8 @@ md-input-container {
303310
> label {
304311
&:not(.md-no-float):not(.md-container-ignore),
305312
.md-placeholder {
306-
width: calc(100% - #{$icon-offset} - #{$input-label-float-width});
313+
width: calc(100% - #{$icon-offset});
314+
padding: 0;
307315
}
308316
}
309317
}

src/components/select/select.scss

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -175,15 +175,22 @@ md-input-container md-select {
175175
}
176176
.md-select-value {
177177
min-height: ($input-line-height + $input-padding-top * 2) - $input-border-width-focused - $input-border-width-default * 2;
178-
padding-bottom: $input-border-width-focused - $input-border-width-default;
179178
border-bottom-width: $input-border-width-default;
179+
padding-bottom: $input-border-width-focused - $input-border-width-default;
180+
&.md-select-placeholder {
181+
@include rtl(padding-left, 0, $input-container-padding);
182+
@include rtl(padding-right, $input-container-padding, 0);
183+
}
180184
}
181185
}
182186

183187
.md-select-value {
184188
display: flex;
185189
align-items: center;
186-
padding: 2px 2px 1px;
190+
padding-top: 2px;
191+
padding-bottom: 1px;
192+
@include rtl(padding-left, 0, $input-container-padding);
193+
@include rtl(padding-right, $input-container-padding, 0);
187194
border-bottom-width: $select-border-width-default;
188195
border-bottom-style: solid;
189196
background-color: rgba(0,0,0,0);
@@ -230,7 +237,6 @@ md-input-container md-select {
230237
order: 1;
231238
pointer-events: none;
232239
-webkit-font-smoothing: antialiased;
233-
padding-left: 2px;
234240
z-index: 1;
235241
}
236242
}

0 commit comments

Comments
 (0)