Browse Source

Adjust input flexbox

pull/2053/head
jlukic 9 years ago
parent
commit
2362bf47af
1 changed files with 5 additions and 23 deletions
  1. 28
      src/definitions/elements/input.less

28
src/definitions/elements/input.less

@ -35,7 +35,7 @@
} }
.ui.input input { .ui.input input {
margin: 0em; margin: 0em;
flex-grow: 1;
flex: 1 0 auto;
outline: none; outline: none;
-webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
text-align: @textAlign; text-align: @textAlign;
@ -276,24 +276,16 @@
---------------------*/ ---------------------*/
/* Adjacent Label */ /* Adjacent Label */
.ui.labeled.input {
display: inline-flex;
}
.ui.labeled.input > .label { .ui.labeled.input > .label {
flex-grow: 0;
flex: 0 0 auto;
margin: 0; margin: 0;
font-size: 1em;
font-size: @medium;
} }
.ui.labeled.input > .label:not(.corner) { .ui.labeled.input > .label:not(.corner) {
padding-top: @verticalPadding; padding-top: @verticalPadding;
padding-bottom: @verticalPadding; padding-bottom: @verticalPadding;
} }
/* Fluid Labeled */
.ui.fluid.labeled.input {
display: flex;
}
/* Label on Left */ /* Label on Left */
.ui.labeled.input:not([class*="corner labeled"]):not([class*="right labeled"]) > input { .ui.labeled.input:not([class*="corner labeled"]):not([class*="right labeled"]) > input {
border-left: none; border-left: none;
@ -340,15 +332,11 @@
Action Action
---------------------*/ ---------------------*/
.ui.action.input {
display: inline-flex;
}
.ui.action.input > .button, .ui.action.input > .button,
.ui.action.input > .buttons { .ui.action.input > .buttons {
display: flex; display: flex;
align-items: center; align-items: center;
flex-grow: 0;
flex: 0 0 auto;
} }
.ui.action.input > .button, .ui.action.input > .button,
.ui.action.input > .buttons > .button { .ui.action.input > .buttons > .button {
@ -357,11 +345,6 @@
margin: 0; margin: 0;
} }
/* Fluid */
.ui.fluid.action.input {
display: flex;
}
/* Button on Right */ /* Button on Right */
.ui.action.input:not([class*="left action"]) > input { .ui.action.input:not([class*="left action"]) > input {
border-right: none; border-right: none;
@ -395,13 +378,12 @@
border: none; border: none;
} }
/*-------------------- /*--------------------
Fluid Fluid
---------------------*/ ---------------------*/
.ui.fluid.input { .ui.fluid.input {
display: block;
display: flex;
} }
/*-------------------- /*--------------------

Loading…
Cancel
Save