vitalif
/
react-toolbox
1
0
Fork 0
Code Issues Pull Requests Releases 12 Wiki Activity

Add $input-icon-right-space var to add the correct spacing to the input based on Material Spec. (#1188) 

https://material.io/guidelines/components/text-fields.html#text-fields-s
ingle-line-text-field
old
Izak Filmalter 2017-01-29 04:35:55 -08:00 committed by Javi Velasco
parent 61b48452bf
commit 0360eb8d05
2 changed files with 3 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
components/input/config.css
View File

@ -17,6 +17,7 @@
--input-icon-font-size: calc(2.4 * var(--unit));
--input-icon-size: calc(2 * var(--input-icon-font-size));
--input-icon-offset: calc(1.6 * var(--unit));
--input-icon-right-space: calc(2 * var(--unit));
--input-chevron-offset: calc(0.8 * var(--unit));
--input-hint-opacity: 1;
}

4
components/input/theme.css
View File

@ -9,7 +9,7 @@
@apply --reset;
&.withIcon {
margin-left: var(--input-icon-size);
margin-left: calc(var(--input-icon-size) + var(--input-icon-right-space));
}
}
@ -18,7 +18,7 @@
display: block;
font-size: var(--input-icon-font-size) !important;
height: var(--input-icon-size);
left: calc(-1 * var(--input-icon-size));
left: calc(-1 * (var(--input-icon-size) + var(--input-icon-right-space)));
line-height: var(--input-icon-size) !important;
position: absolute;
text-align: center;