tyler.durden/opensupports
1
0
Fork 0
mirror of https://github.com/opensupports/opensupports.git synced 2025-08-19 08:48:37 +02:00
Code Issues Packages Projects Releases Wiki Activity

Guillermo - Tooltip-ticket-number [skip ci]

Browse Source
This commit is contained in:
AntonyAntonio 2016-09-30 00:13:47 -03:00
parent 4006eb4799
commit 73dd6b0adf
3 changed files with 17 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
client/src/core-components/__tests__/tooltip-test.js Normal file
View File

@ -0,0 +1,9 @@
const Tooltip = require('core-components/tooltip');
describe('Tooltip component', function () {
it('should open and close with click', function () {
let tooltip = TestUtils.renderIntoDocument(
<Tooltip content="hola"><span className="clickeable">text to click</span></Tooltip>
);
});
});

10
client/src/core-components/tooltip.js
View File

@ -13,7 +13,7 @@ class Tooltip extends React.Component {
show : false
};
render (){
render() {
return (
<div {...this.getProps()}>
{(this.state.show) ? this.renderAnimatedMessage() : null}
@ -24,7 +24,7 @@ class Tooltip extends React.Component {
);
}
renderAnimatedMessage(){
renderAnimatedMessage() {
return (
<Motion defaultStyle={{opacity:spring(0)}} style={{opacity:spring(1)}}>
{this.renderMessage.bind(this)}
@ -32,7 +32,7 @@ class Tooltip extends React.Component {
)
}
renderMessage(animation){
renderMessage(animation) {
return (
<div style={animation}>
<div className="tooltip__message">
@ -43,7 +43,7 @@ class Tooltip extends React.Component {
)
}
getProps(){
getProps() {
let props = {};
props.className = 'tooltip';
@ -78,7 +78,7 @@ class Tooltip extends React.Component {
});
}
onClick(){
onClick() {
if (this.state.show) {
this.setState({show: false});
} else {

7
client/src/core-components/tooltip.scss
View File

@ -2,11 +2,11 @@
position: relative;
display: inline-block;
&__children{
&__children {
cursor: default;
}
&__message{
&__message {
position: absolute;
bottom: 100%;
left: -25%;
@ -19,8 +19,7 @@
padding: 10px;
}
&__pointer{
&__pointer {
border: solid transparent;
position: absolute;
border-top-color: #8D8D8D;