Form input widths behave more consistently when resizing

Fixes #919 #920
This commit is contained in:
Nick O'Leary
2016-06-26 23:48:59 +01:00
parent 682345da22
commit c3b1cf7c35
17 changed files with 118 additions and 77 deletions

View File

@@ -147,8 +147,9 @@ input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
box-sizing: border-box;
display: inline-block;
height: 20px;
height: 34px;
padding: 6px 6px;
margin-bottom: 10px;
font-size: 14px;

View File

@@ -24,8 +24,17 @@
vertical-align: middle;
box-sizing: border-box;
overflow:hidden;
position: relative;
.red-ui-typedInput-input {
position: absolute;
left:0;
right:0;
top:0;
bottom:0;
outline: red;
}
input {
width: 100%;
padding: 0 0 0 1px;
margin:0;
height: 32px;
@@ -41,6 +50,7 @@
}
a {
box-sizing: border-box;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
padding: 0 1px 0 5px;
@@ -72,6 +82,10 @@
&:not(.disabled):hover {
text-decoration: none;
background: $typedInput-button-background-hover;
span {
background: $typedInput-button-background-hover;
}
}
&:focus {
text-decoration: none;
@@ -88,13 +102,22 @@
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
padding: 0 5px 0 0;
position:absolute;
left:0;
top:0;
bottom:0;
right:0;
i {
margin-right: 0;
margin-left: 4px;
position:absolute;
right: 4px;
top: 7px;
}
span {
background:#fff;
position:absolute;
left:0;
right:23px;
padding: 0 5px 0 5px;
}
}