Fixed: tag input alignment and height
This commit is contained in:
parent
dc8f81b536
commit
30b5a35db2
|
@ -8,13 +8,13 @@
|
||||||
&.isFocused {
|
&.isFocused {
|
||||||
outline: 0;
|
outline: 0;
|
||||||
border-color: $inputFocusBorderColor;
|
border-color: $inputFocusBorderColor;
|
||||||
box-shadow: inset 0 1px 1px $inputBoxShadowColor, 0 0 8px $inputFocusBoxShadowColor;
|
box-shadow: inset 0 1px 1px $inputBoxShadowColor,
|
||||||
|
0 0 8px $inputFocusBoxShadowColor;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.internalInput {
|
.internalInput {
|
||||||
flex: 1 1 0%;
|
flex: 1 1 0%;
|
||||||
margin-top: -6px;
|
|
||||||
margin-left: 3px;
|
margin-left: 3px;
|
||||||
min-width: 20%;
|
min-width: 20%;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
|
|
|
@ -4,8 +4,9 @@
|
||||||
bottom: -1px;
|
bottom: -1px;
|
||||||
left: -1px;
|
left: -1px;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
align-items: start;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
padding: 6px 16px;
|
padding: 1px 16px;
|
||||||
height: 33px;
|
min-height: 33px;
|
||||||
cursor: default;
|
cursor: default;
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,5 @@
|
||||||
|
.tag {
|
||||||
|
composes: link from "~Components/Link/Link.css";
|
||||||
|
|
||||||
|
height: 31px;
|
||||||
|
}
|
|
@ -4,6 +4,7 @@ import { kinds } from 'Helpers/Props';
|
||||||
import tagShape from 'Helpers/Props/Shapes/tagShape';
|
import tagShape from 'Helpers/Props/Shapes/tagShape';
|
||||||
import Label from 'Components/Label';
|
import Label from 'Components/Label';
|
||||||
import Link from 'Components/Link/Link';
|
import Link from 'Components/Link/Link';
|
||||||
|
import styles from './TagInputTag.css';
|
||||||
|
|
||||||
class TagInputTag extends Component {
|
class TagInputTag extends Component {
|
||||||
|
|
||||||
|
@ -31,9 +32,9 @@ class TagInputTag extends Component {
|
||||||
tag,
|
tag,
|
||||||
kind
|
kind
|
||||||
} = this.props;
|
} = this.props;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Link
|
<Link
|
||||||
|
className={styles.tag}
|
||||||
tabIndex={-1}
|
tabIndex={-1}
|
||||||
onPress={this.onDelete}
|
onPress={this.onDelete}
|
||||||
>
|
>
|
||||||
|
|
Loading…
Reference in New Issue