1
0
Fork 0

some ui improvements

This commit is contained in:
Claudius Weinberger 2014-02-01 17:26:13 +01:00
parent fadb568728
commit 7d29bfcf6a
10 changed files with 79 additions and 54 deletions

View File

@ -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,

View File

@ -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;
} }

View File

@ -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;
} }

View File

@ -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 {

View File

@ -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;

View File

@ -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;

View File

@ -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;
} }

View File

@ -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;

View File

@ -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">

View File

@ -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) {