docker
/
docs
mirror of https://github.com/docker/docs.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fixed some style.

This commit is contained in:
Sean Li 2015-01-30 17:42:50 -08:00
parent 011d6241cf
commit c693f61e1a
3 changed files with 30 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/ContainerDetails.react.js
View File

@ -504,7 +504,7 @@ var ContainerDetails = React.createClass({
return ( return (
<div className="details"> <div className="details">
<div className="details-header"> <div className="details-header">
<h1>{this.props.container.Name}</h1><h2 className="image">{this.props.container.Config.Image}</h2> <h1>{this.props.container.Name}</h1>{state}
<div className="details-header-actions"> <div className="details-header-actions">
<span className="icon icon-preview-2 action-icon view-icon" onClick={this.handleView}></span> <span className="icon icon-preview-2 action-icon view-icon" onClick={this.handleView}></span>
<span className="icon icon-refresh action-icon" onClick={this.handleRestart}></span> <span className="icon icon-refresh action-icon" onClick={this.handleRestart}></span>
@ -512,7 +512,7 @@ var ContainerDetails = React.createClass({
</div> </div>
</div> </div>
<div className="details-subheader"> <div className="details-subheader">
{state} <span className="image">{this.props.container.Config.Image}</span>
<div className="details-subheader-tabs"> <div className="details-subheader-tabs">
<span className={tabLogsClasses} onClick={this.showLogs}>Logs</span> <span className={tabLogsClasses} onClick={this.showLogs}>Logs</span>
<span className={tabPortsClasses} onClick={this.showPorts}>Ports</span> <span className={tabPortsClasses} onClick={this.showPorts}>Ports</span>

50
app/styles/containers.less
View File

@ -84,7 +84,7 @@
.sidebar-containers { .sidebar-containers {
position: relative; position: relative;
flex: 1 auto; flex: 1 auto;
overflow-y: scroll; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
box-sizing: border-box; box-sizing: border-box;
max-width: 260px; max-width: 260px;
@ -310,23 +310,19 @@
border-bottom: 1px solid @gray-lightest; border-bottom: 1px solid @gray-lightest;
background-color: white; background-color: white;
height: 32px; height: 32px;
padding: 8px 10px 10px 24px; padding: 7px 10px 10px 24px;
font-size: 12px; font-size: 13px;
color: @gray-normal; color: @gray-normal;
.status {
font-weight: 500; .image {
position: relative; flex: 1 auto;
top: -2px; //margin: 7px 0px 0px 16px;
&.running { margin-top: 1px;
color: @brand-positive; font-size: 13px;
} color: @gray-normal;
&.paused { //font-weight: 300;
color: @gray-lighter;
}
&.stopped {
color: @gray-lighter;
}
} }
.details-subheader-tabs { .details-subheader-tabs {
flex: 1 auto; flex: 1 auto;
text-align: right; text-align: right;
@ -335,6 +331,7 @@
margin-left: 20px; margin-left: 20px;
padding: 3px 10px; padding: 3px 10px;
transition: all 0.25s; transition: all 0.25s;
font-weight: 500;
&:hover { &:hover {
color: @brand-action; color: @brand-action;
} }
@ -363,21 +360,20 @@
margin: 0; margin: 0;
color: @gray-darkest; color: @gray-darkest;
} }
h2 { .status {
&.status {
margin: 9px 0px 0px 12px;
font-weight: bold;
font-size: 10px; font-size: 10px;
font-weight: 500;
position: relative;
top: 8px;
left: 14px;
&.running { &.running {
color: @brand-positive; color: @brand-positive;
} }
&.paused {
color: @gray-lighter;
} }
&.image { &.stopped {
flex: 1 auto; color: @gray-lighter;
margin: 7px 0px 0px 16px;
font-size: 12px;
color: @gray-normal;
font-weight: 300;
} }
} }
@ -440,7 +436,7 @@
-webkit-user-select: text; -webkit-user-select: text;
font-family: Menlo; font-family: Menlo;
font-size: 12px; font-size: 12px;
padding: 20px 20px; padding: 20px 18px;
color: lighten(@gray-normal, 6%); color: lighten(@gray-normal, 6%);
white-space: pre-wrap; white-space: pre-wrap;
p { p {

2
app/styles/theme.less
View File

@ -13,7 +13,7 @@ h3 {
h4 { h4 {
font-size: 13px; font-size: 13px;
color: @gray-darker; color: @gray-darker;
font-weight: 400; font-weight: 500;
} }
.popover-content { .popover-content {