Max - add styling to tooltip [skip ci]
This commit is contained in:
parent
af29c62d82
commit
59bfdf1128
|
@ -173,7 +173,10 @@ let DemoPage = React.createClass({
|
||||||
{
|
{
|
||||||
title: 'InfoTooltip',
|
title: 'InfoTooltip',
|
||||||
render: (
|
render: (
|
||||||
<InfoTooltip type="warning" text="Some helping text" />
|
<div>
|
||||||
|
<InfoTooltip text="You should read the manual" />
|
||||||
|
<InfoTooltip type="warning" text="No staff member is assigned to this department." />
|
||||||
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
|
|
|
@ -31,8 +31,12 @@ class InfoTooltip extends React.Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
renderText() {
|
renderText() {
|
||||||
|
let message = (this.props.type === 'default') ? 'Information' : 'Warning';
|
||||||
return (
|
return (
|
||||||
<div className="info-tooltip__text">
|
<div className="info-tooltip__text">
|
||||||
|
<div className="info-tooltip__text__title">
|
||||||
|
{message}
|
||||||
|
</div>
|
||||||
{this.props.text}
|
{this.props.text}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
|
@ -2,7 +2,10 @@
|
||||||
|
|
||||||
.info-tooltip {
|
.info-tooltip {
|
||||||
&__text {
|
&__text {
|
||||||
|
&__title {
|
||||||
|
color: $secondary-blue;
|
||||||
|
font-size: $font-size--md;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&__icon {
|
&__icon {
|
||||||
|
@ -13,5 +16,11 @@
|
||||||
.info-tooltip__icon {
|
.info-tooltip__icon {
|
||||||
color: $primary-red;
|
color: $primary-red;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.info-tooltip__text {
|
||||||
|
&__title {
|
||||||
|
color: $primary-red;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue