First pass of new node-info style

This commit is contained in:
Nick O'Leary
2017-04-05 16:19:23 +01:00
parent 28ea22f0e1
commit 262db23f7d
5 changed files with 202 additions and 91 deletions

View File

@@ -22,64 +22,134 @@ table.node-info {
margin: 0px;
width: 97%;
}
table.node-info tr {
table.node-info tr:not(.blank) {
border: 1px solid #ddd;
}
table.node-info tr.blank {
border: none;
th {
text-align: left;
font-weight: bold;
color: #444;
}
>* {
padding-top: 8px;
border: none;
padding-left: 0px;
}
a {
display: block;
color: #444;
&:hover,&:focus {
color: #444;
text-decoration: none;
}
i {
width: 10px;
text-align: center;
transition: transform 0.2s ease-in-out;
}
&.expanded i {
transform: rotate(90deg);
}
}
&.node-info-info-row > td {
padding-left: 5px;
}
}
table.node-info tr.blank td {
padding-top: 8px;
border: none;
font-weight: bold;
padding-left: 0px;
}
table.node-info td:first-child{
table.node-info tr:not(.blank) td:first-child{
color: #666;
vertical-align: top;
width: 90px;
padding: 3px;
border-right: 1px solid #ddd;
}
table.node-info td:last-child{
table.node-info tr:not(.blank) td:last-child{
padding-left: 5px;
color: #666;
}
div.node-info {
margin: 5px;
}
.node-info-property-header {
color: #666;
}
.node-info-property-header:hover,
.node-info-property-header:focus {
color: #666;
text-decoration: none;
}
.node-help {
font-size: 14px;
line-height: 1.5em;
h1 {
font-weight: normal;
font-weight: 500;
font-size: 23px;
line-height: 1.3em;
margin: 8px auto;
}
h2 {
font-weight: normal;
font-weight: 500;
font-size: 18px;
margin: 8px auto;
line-height: 1.3em;
}
h3 {
font-weight: normal;
font-weight: 500;
font-size: 16px;
margin: 8px auto;
margin: 7px auto 5px;
line-height: 1.3em;
}
h4,
h5 {
font-weight: normal;
font-weight: 500;
font-size: 14px;
margin: 8px auto;
line-height: 1.3em;
margin: 8px auto 5px;
}
& > span > p:first-child {
}
dl.message-properties {
border: 1px solid #eee;
border-radius: 2px;
margin: 5px auto 10px;
&>dt {
padding: 0px 3px 2px 3px;
font-family: monospace;
font-weight: normal;
margin: 5px 3px 1px;
color: #AD1625;
white-space: nowrap;
background-color: #f7f7f9;
border: 1px solid #e1e1e8;
border-radius: 2px;
&.optional {
font-style: italic;
}
.property-type {
font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
color: #666;
font-style: italic;
font-size: 11px;
float: right;
}
&:after {
content: "";
display: table;
clear: both;
}
}
&>dd {
margin: 1px 8px 10px 10px;
}
}
ol.node-ports {
margin: 0;
li {
border: 1px solid #eee;
border-radius: 2px;
list-style-position: inside;
padding: 3px;
margin-bottom: 5px;
}
}
}
.node-info-tip {
position: absolute;