mirror of https://gitee.com/bigwinds/arangodb
some ui improvements
This commit is contained in:
parent
fadb568728
commit
7d29bfcf6a
|
@ -40,21 +40,25 @@ ul.headerButtonList > li {
|
||||||
|
|
||||||
a.headerButton {
|
a.headerButton {
|
||||||
float: left;
|
float: left;
|
||||||
margin-top: 0px;
|
margin-top: 2px;
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
margin-right: 5px;
|
margin-right: 3px;
|
||||||
min-height: 19px;
|
min-height: 15px;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
position: relative;
|
position: relative;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
background: #8AA051 !important;
|
background: #ddd;
|
||||||
/*
|
color: #555;
|
||||||
background: #8f8d8c !important;
|
height: 17px;
|
||||||
*/
|
width: 9px;
|
||||||
color:#FFFFFF !important;
|
padding: 4px 9px 2px 9px;
|
||||||
height:20px;
|
border: 1px solid #222;
|
||||||
width:13px;
|
}
|
||||||
padding: 5px 11px 2px 9px;
|
|
||||||
|
a.headerButton:hover {
|
||||||
|
background: #fff;
|
||||||
|
color: #000;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.paginationButton, ul.arangoPagination a {
|
a.paginationButton, ul.arangoPagination a {
|
||||||
|
@ -63,11 +67,16 @@ a.paginationButton, ul.arangoPagination a {
|
||||||
|
|
||||||
/* better look of some icons */
|
/* better look of some icons */
|
||||||
a.headerButton .icon_arangodb_filter {
|
a.headerButton .icon_arangodb_filter {
|
||||||
top: 1px !important;
|
top: 3px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.headerButton .icon_arangodb_import {
|
a.headerButton .icon_arangodb_import {
|
||||||
top: -1px !important;
|
top: 1px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
a.headerButton .icon_arangodb_checklist {
|
||||||
|
top: 3px !important;
|
||||||
|
right: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.headerButton .icon_arangodb_arrowleft,
|
a.headerButton .icon_arangodb_arrowleft,
|
||||||
|
|
|
@ -16,7 +16,8 @@
|
||||||
|
|
||||||
.span3 h5 {
|
.span3 h5 {
|
||||||
font-family: 'Open Sans', sans-serif !important;
|
font-family: 'Open Sans', sans-serif !important;
|
||||||
font-weight: 500;
|
font-weight: 300;
|
||||||
|
font-size: 12px;
|
||||||
white-space: nowrap !important;
|
white-space: nowrap !important;
|
||||||
overflow: hidden !important;
|
overflow: hidden !important;
|
||||||
text-overflow: ellipsis !important;
|
text-overflow: ellipsis !important;
|
||||||
|
@ -42,29 +43,27 @@
|
||||||
|
|
||||||
.span3 .ICON {
|
.span3 .ICON {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
right: 0px;
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-size: 25px;
|
font-size: 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.span3 .ICON:hover {
|
||||||
|
opacity: 1.0;
|
||||||
|
}
|
||||||
|
|
||||||
.span3 .glyphicon-edit {
|
.span3 .glyphicon-edit {
|
||||||
margin-top: 4px !important;
|
margin-top: 4px !important;
|
||||||
font-size: 19.5px;
|
font-size: 19.5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.span3 .ICON{
|
|
||||||
right: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.span3 .spanInfo {
|
.span3 .spanInfo {
|
||||||
right: 25px;
|
right: 25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.span3 .ICON:hover {
|
|
||||||
opacity: 1.0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.spanDisabled {
|
.spanDisabled {
|
||||||
right: 25px !important;
|
right: 25px !important;
|
||||||
opacity: 0.2 !important;
|
opacity: 0.2 !important;
|
||||||
|
@ -81,4 +80,5 @@
|
||||||
|
|
||||||
.badge, .label, .btn {
|
.badge, .label, .btn {
|
||||||
text-shadow: none !important;
|
text-shadow: none !important;
|
||||||
|
font-size: 11px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -9,7 +9,7 @@
|
||||||
#newCollection {
|
#newCollection {
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-left: 22px;
|
margin-left: 22px;
|
||||||
font-size: 28px;
|
font-size: 22px;
|
||||||
margin-top: -5px;
|
margin-top: -5px;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
|
@ -35,7 +35,8 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.thumbnails li {
|
.thumbnails li {
|
||||||
background-color: #f4f3f3;
|
background-color: rgba(0, 0, 0, 0.05);
|
||||||
|
/* #f4f3f3; */
|
||||||
}
|
}
|
||||||
|
|
||||||
.thumbnails a.add {
|
.thumbnails a.add {
|
||||||
|
@ -48,7 +49,7 @@
|
||||||
.thumbnails .icon {
|
.thumbnails .icon {
|
||||||
padding-right:5px;
|
padding-right:5px;
|
||||||
padding-left: 5px;
|
padding-left: 5px;
|
||||||
padding-top: 5px;
|
padding-top: 10px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -115,11 +115,11 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.nv-axislabel {
|
.nv-axislabel {
|
||||||
margin-left: 20px;
|
margin-left: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nv-axisMaxMin > text {
|
.nv-axisMaxMin > text {
|
||||||
font: 10px sans-serif;
|
/* font: 10px 'Open Sans', sans-serif; */
|
||||||
}
|
}
|
||||||
|
|
||||||
.svgCollections {
|
.svgCollections {
|
||||||
|
@ -128,7 +128,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.svgClass {
|
.svgClass {
|
||||||
height: 155px;
|
height: 142px;
|
||||||
width: 300px;
|
width: 300px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -166,7 +166,7 @@ li:hover h6, li.hover h6 {
|
||||||
}
|
}
|
||||||
|
|
||||||
.boxHeader h6 {
|
.boxHeader h6 {
|
||||||
opacity: 0.8;
|
/* opacity: 0.8; */
|
||||||
padding-top: 0 !important;
|
padding-top: 0 !important;
|
||||||
color: black;
|
color: black;
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
|
@ -525,6 +525,12 @@ li:hover h6, li.hover h6 {
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#dbThumbnailsIn .dashboardH6 {
|
||||||
|
opacity: 1.0 !important;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
@media screen and (-webkit-min-device-pixel-ratio:0) {
|
@media screen and (-webkit-min-device-pixel-ratio:0) {
|
||||||
.svgClass{margin-top: 10px !important;}
|
.svgClass{margin-top: 10px !important;}
|
||||||
.statSingleClient{margin-top: 10.5px !important;}
|
.statSingleClient{margin-top: 10.5px !important;}
|
||||||
|
@ -532,8 +538,10 @@ li:hover h6, li.hover h6 {
|
||||||
}
|
}
|
||||||
|
|
||||||
.nvd3 .nv-axis .nv-axisMaxMin text {
|
.nvd3 .nv-axis .nv-axisMaxMin text {
|
||||||
|
/*
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: 12px !important;
|
font-size: 12px !important;
|
||||||
|
*/
|
||||||
}
|
}
|
||||||
|
|
||||||
.nvd3 .nv-wrap .nv-axis:last-child {
|
.nvd3 .nv-wrap .nv-axis:last-child {
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
/* Sets the default values shared for content views*/
|
/* Sets the default values shared for content views*/
|
||||||
#content {
|
#content {
|
||||||
background-color: rgba(0, 0, 0, 0.15);
|
background-color: rgba(0, 0, 0, 0.0675);
|
||||||
margin-top: 25px;
|
margin-top: 25px;
|
||||||
margin-bottom: 33px;
|
margin-bottom: 33px;
|
||||||
min-height: 80px;
|
min-height: 80px;
|
||||||
|
|
|
@ -4,7 +4,7 @@ div.headerBar {
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
margin-bottom: 0px;
|
margin-bottom: 5px;
|
||||||
background-color: #686766;
|
background-color: #686766;
|
||||||
color: #FFFFFF;
|
color: #FFFFFF;
|
||||||
height: 36px;
|
height: 36px;
|
||||||
|
|
|
@ -259,9 +259,9 @@ button {
|
||||||
}
|
}
|
||||||
|
|
||||||
li a [class^="icon_arangodb"], li a [class*=" icon_arangodb"] {
|
li a [class^="icon_arangodb"], li a [class*=" icon_arangodb"] {
|
||||||
font-size: 22px;
|
font-size: 18px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 5px;
|
right: 4px;
|
||||||
top: 2px;
|
top: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -93,11 +93,15 @@ svg {
|
||||||
|
|
||||||
|
|
||||||
svg text {
|
svg text {
|
||||||
font: normal 12px Arial;
|
font-weight: 300;
|
||||||
|
font-size: 10px;
|
||||||
|
font-family: 'Open Sans', sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
svg .title {
|
svg .title {
|
||||||
font: bold 14px Arial;
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
font-family: 'Open Sans', sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nvd3 .nv-background {
|
.nvd3 .nv-background {
|
||||||
|
@ -170,7 +174,6 @@ svg .title {
|
||||||
}
|
}
|
||||||
|
|
||||||
.nvd3 .nv-axis .nv-axisMaxMin text {
|
.nvd3 .nv-axis .nv-axisMaxMin text {
|
||||||
font-weight: bold;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.nvd3 .x .nv-axis .nv-axisMaxMin text,
|
.nvd3 .x .nv-axis .nv-axisMaxMin text,
|
||||||
|
@ -179,8 +182,6 @@ svg .title {
|
||||||
text-anchor: middle
|
text-anchor: middle
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/**********
|
/**********
|
||||||
* Brush
|
* Brush
|
||||||
*/
|
*/
|
||||||
|
@ -278,7 +279,7 @@ svg .title {
|
||||||
}
|
}
|
||||||
|
|
||||||
.nvd3.nv-pie .hover path {
|
.nvd3.nv-pie .hover path {
|
||||||
fill-opacity: .7;
|
fill-opacity: .8;
|
||||||
/*
|
/*
|
||||||
stroke-width: 6px;
|
stroke-width: 6px;
|
||||||
stroke-opacity: 1;
|
stroke-opacity: 1;
|
||||||
|
@ -296,7 +297,7 @@ svg .title {
|
||||||
|
|
||||||
.nvd3 .nv-groups path.nv-line {
|
.nvd3 .nv-groups path.nv-line {
|
||||||
fill: none;
|
fill: none;
|
||||||
stroke-width: 2.5px;
|
stroke-width: 1.25px;
|
||||||
/*
|
/*
|
||||||
stroke-linecap: round;
|
stroke-linecap: round;
|
||||||
shape-rendering: geometricPrecision;
|
shape-rendering: geometricPrecision;
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="plain">
|
<div class="plain">
|
||||||
<img src="<%= attributes.picture %>" height="60" width="60" alt="" class="icon">
|
<img src="<%= attributes.picture %>" height="50" width="50" alt="" class="icon">
|
||||||
<span class="badge badge-success <%= attributes.status %>"><div class="cornered"><%= attributes.status %></div></span>
|
<span class="badge badge-success <%= attributes.status %>"><div class="cornered"><%= attributes.status %></div></span>
|
||||||
|
|
||||||
<h5 class="collectionName">
|
<h5 class="collectionName">
|
||||||
|
|
|
@ -509,8 +509,9 @@
|
||||||
.datum([{
|
.datum([{
|
||||||
values: self.seriesData[identifier].values,
|
values: self.seriesData[identifier].values,
|
||||||
key: identifier,
|
key: identifier,
|
||||||
color: "#8AA051"
|
color: "#8aa14c"
|
||||||
}])
|
}])
|
||||||
|
.attr("stroke-width", "0.5")
|
||||||
.transition().duration(500);
|
.transition().duration(500);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -520,17 +521,22 @@
|
||||||
.datum([ {
|
.datum([ {
|
||||||
values: self.seriesData[identifier].values,
|
values: self.seriesData[identifier].values,
|
||||||
key: identifier,
|
key: identifier,
|
||||||
color: "#8AA051" }
|
color: "#8aa14c" }
|
||||||
])
|
])
|
||||||
|
.attr("stroke-width", "0.5")
|
||||||
.transition().duration(500);
|
.transition().duration(500);
|
||||||
|
|
||||||
|
// Claudius: hide y-axis labels for small charts
|
||||||
|
$('#' + identifier + ' .nv-y.nv-axis text').attr('display', 'none');
|
||||||
});
|
});
|
||||||
|
|
||||||
this.loadGraphState();
|
this.loadGraphState();
|
||||||
|
// #8AA051
|
||||||
//fix position for last x-value label in detailgraph
|
//fix position for last x-value label in detailgraph
|
||||||
$('.nv-x.nv-axis .nvd3.nv-wrap.nv-axis:last-child text').attr('x','-5');
|
$('.nv-x.nv-axis .nvd3.nv-wrap.nv-axis:last-child text').attr('x','-5');
|
||||||
//fix position of small graphs
|
//fix position of small graphs
|
||||||
$('.svgClass .nv-lineChart').attr('transform','translate(5,5)');
|
$('.svgClass .nv-lineChart').attr('transform','translate(5,5)');
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
calculateSeries: function (flush) {
|
calculateSeries: function (flush) {
|
||||||
|
|
Loading…
Reference in New Issue