Apache
/
lucene
mirror of https://github.com/apache/lucene.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

SOLR-3915: Color Legend for Cloud UI 

git-svn-id: https://svn.apache.org/repos/asf/lucene/dev/trunk@1437791 13f79535-47bb-0310-9956-ffa450edef68
This commit is contained in:
Stefan Matheis 2013-01-23 23:06:47 +00:00
parent 15bc6148ae
commit 3801883396
3 changed files with 65 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
solr/CHANGES.txt
View File

@ -83,6 +83,8 @@ Optimizations
* SOLR-4341: Admin UI - Plugins/Stats Page contains loooong * SOLR-4341: Admin UI - Plugins/Stats Page contains loooong
Values which result in horizontal Scrollbar (steffkes) Values which result in horizontal Scrollbar (steffkes)
* SOLR-3915: Color Legend for Cloud UI (steffkes)
Other Changes Other Changes
---------------------- ----------------------

52
solr/webapp/web/css/styles/cloud.css
View File

@ -231,11 +231,39 @@
color: #00f; color: #00f;
} }
#content #cloud #legend
{
border: 1px solid #f0f0f0;
padding: 10px;
position: absolute;
right: 0;
bottom: 0;
}
#content #cloud #legend li
{
padding-left: 15px;
position: relative;
}
#content #cloud #legend li svg
{
position: absolute;
left: 0;
top: 2px;
}
#content #graph-content
{
min-height: 400px;
}
#content #graph-content .node #content #graph-content .node
{ {
fill: #333; fill: #333;
} }
#content #cloud #legend circle,
#content #graph-content .node circle #content #graph-content .node circle
{ {
fill: #fff; fill: #fff;
@ -265,6 +293,7 @@
stroke-width: 1.5px; stroke-width: 1.5px;
} }
#content #cloud #legend .gone circle,
#content #graph-content .node.gone circle, #content #graph-content .node.gone circle,
#content #graph-content .link.gone #content #graph-content .link.gone
{ {
@ -276,8 +305,16 @@
fill: #f0f0f0; fill: #f0f0f0;
} }
#content #cloud #legend ul .gone
{
color: #e0e0e0;
}
#content #cloud #legend .recovery_failed,
#content #cloud #legend .recovery_failed circle,
#content #graph-content .node.recovery_failed circle #content #graph-content .node.recovery_failed circle
{ {
color: #C43C35;
stroke: #C43C35; stroke: #C43C35;
} }
@ -286,8 +323,11 @@
fill: #C43C35; fill: #C43C35;
} }
#content #cloud #legend .down,
#content #cloud #legend .down circle,
#content #graph-content .node.down circle #content #graph-content .node.down circle
{ {
color: #c48f00;
stroke: #c48f00; stroke: #c48f00;
} }
@ -296,8 +336,11 @@
fill: #c48f00; fill: #c48f00;
} }
#content #cloud #legend .recovering,
#content #cloud #legend .recovering circle,
#content #graph-content .node.recovering circle #content #graph-content .node.recovering circle
{ {
color: #d5dd00;
stroke: #d5dd00; stroke: #d5dd00;
} }
@ -306,8 +349,11 @@
fill: #d5dd00; fill: #d5dd00;
} }
#content #cloud #legend .active,
#content #cloud #legend .active circle,
#content #graph-content .node.active circle #content #graph-content .node.active circle
{ {
color: #57A957;
stroke: #57A957; stroke: #57A957;
} }
@ -316,11 +362,17 @@
fill: #57A957; fill: #57A957;
} }
#content #cloud #legend .leader circle,
#content #graph-content .node.leader circle #content #graph-content .node.leader circle
{ {
fill: #000; fill: #000;
} }
#content #cloud #legend .leader circle
{
stroke: #fff;
}
#content #graph-content .link.lvl-2, #content #graph-content .link.lvl-2,
#content #graph-content .link.leader #content #graph-content .link.leader
{ {

11
solr/webapp/web/tpl/cloud.html
View File

@ -39,6 +39,17 @@ limitations under the License.
<div id="canvas"></div> <div id="canvas"></div>
<div id="legend">
<ul>
<li class="leader"><svg width="15" height="15"><g transform="translate(5,2)"><g transform="translate(0,5)"><circle r="4.5"></circle></g></g></svg> Leader</li>
<li class="active"><svg width="15" height="15"><g transform="translate(5,2)"><g transform="translate(0,5)"><circle r="4.5"></circle></g></g></svg> Active</li>
<li class="recovering"><svg width="15" height="15"><g transform="translate(5,2)"><g transform="translate(0,5)"><circle r="4.5"></circle></g></g></svg> Recovering</li>
<li class="down"><svg width="15" height="15"><g transform="translate(5,2)"><g transform="translate(0,5)"><circle r="4.5"></circle></g></g></svg> Down</li>
<li class="recovery_failed"><svg width="15" height="15"><g transform="translate(5,2)"><g transform="translate(0,5)"><circle r="4.5"></circle></g></g></svg> Recovery Failed</li>
<li class="gone"><svg width="15" height="15"><g transform="translate(5,2)"><g transform="translate(0,5)"><circle r="4.5"></circle></g></g></svg> Gone</li>
</ul>
</div>
</div> </div>
</div> </div>