зеркало из https://github.com/docker/kitematic.git
Added tooltips.
This commit is contained in:
Родитель
155cbd3e23
Коммит
5530cc53c6
|
@ -5,6 +5,8 @@ var Router = require('react-router');
|
||||||
var Modal = require('react-bootstrap/Modal');
|
var Modal = require('react-bootstrap/Modal');
|
||||||
var RetinaImage = require('react-retina-image');
|
var RetinaImage = require('react-retina-image');
|
||||||
var ContainerStore = require('./ContainerStore');
|
var ContainerStore = require('./ContainerStore');
|
||||||
|
var OverlayTrigger = require('react-bootstrap/OverlayTrigger');
|
||||||
|
var Popover = require('react-bootstrap/Popover');
|
||||||
|
|
||||||
var Navigation = Router.Navigation;
|
var Navigation = Router.Navigation;
|
||||||
|
|
||||||
|
@ -109,7 +111,9 @@ var ContainerModal = React.createClass({
|
||||||
<input type="search" ref="searchInput" className="form-control" placeholder="Find an existing image" onChange={this.handleChange}/>
|
<input type="search" ref="searchInput" className="form-control" placeholder="Find an existing image" onChange={this.handleChange}/>
|
||||||
<div className="icon icon-magnifier search-icon"></div>
|
<div className="icon icon-magnifier search-icon"></div>
|
||||||
<div className="question">
|
<div className="question">
|
||||||
<a href="#"><span>What's an image?</span></a>
|
<OverlayTrigger trigger="hover" placement="bottom" overlay={<Popover>An image is a template which a container can be created from.</Popover>}>
|
||||||
|
<a><span>What's an image?</span></a>
|
||||||
|
</OverlayTrigger>
|
||||||
</div>
|
</div>
|
||||||
<div className="results">
|
<div className="results">
|
||||||
{title}
|
{title}
|
||||||
|
|
|
@ -77,9 +77,12 @@ html, body {
|
||||||
|
|
||||||
.question {
|
.question {
|
||||||
a {
|
a {
|
||||||
|
transition: all 0.3s ease 0s;
|
||||||
|
cursor: default;
|
||||||
color: @gray-lightest;
|
color: @gray-lightest;
|
||||||
&:hover {
|
&:hover {
|
||||||
color: darken(@gray-lightest, 10%);
|
color: darken(@gray-lightest, 10%);
|
||||||
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
|
|
|
@ -12,6 +12,11 @@ h4 {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.popover-content {
|
||||||
|
color: @gray-normal;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
//
|
//
|
||||||
// Buttons
|
// Buttons
|
||||||
// --------------------------------------------------
|
// --------------------------------------------------
|
||||||
|
|
Загрузка…
Ссылка в новой задаче