Skip to content

Instantly share code, notes, and snippets.

@witokondoria
Last active September 8, 2016 14:51
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save witokondoria/29b8cf4346acfaf6b8c70af639d76b58 to your computer and use it in GitHub Desktop.
Save witokondoria/29b8cf4346acfaf6b8c70af639d76b58 to your computer and use it in GitHub Desktop.
Awesome jenkins job dashing widget
class Dashing.Jenkinslist extends Dashing.Widget
ready: ->
if @get('unordered')
$(@node).find('ol').remove()
else
$(@node).find('ul').remove()
<h1 class="title" data-bind="title"></h1>
<ol>
<li data-foreach-item="items">
<span class="label" data-bind="item.label"></span>
<span class="value" data-bind="item.branch"></span>
<span class="value" data-bind="item.status"></span>
<span class="value" data-bind="item.value"></span>
</li>
</ol>
<ul class="list-nostyle">
<li data-foreach-item="items">
<span class="label" data-bind="item.label"></span>
<span class="value" data-bind="item.branch"></span>
<span class="value" data-bind="item.status"></span>
<span class="value" data-bind="item.value"></span>
</li>
</ul>
<span class="count" data-bind="count"></span>
// ----------------------------------------------------------------------------
// Sass declarations
// ----------------------------------------------------------------------------
$background-color: #12b0c5;
$value-color: #fff;
$title-color: rgba(255, 255, 255, 0.7);
$label-color: rgba(255, 255, 255, 0.7);
$moreinfo-color: rgba(255, 255, 255, 0.7);
// ----------------------------------------------------------------------------
// Widget-list styles
// ----------------------------------------------------------------------------
.widget-list {
background-color: $background-color;
vertical-align: top;
.title {
color: $title-color;
}
ol, ul {
margin: 0 15px;
text-align: left;
color: $label-color;
}
ol {
list-style-position: inside;
}
li {
margin-bottom: 5px;
}
.list-nostyle {
list-style: none;
}
.label {
color: $label-color;
}
.branch {
color: $label-color;
}
.status {
color: $label-color;
}
.value {
float: right;
margin-left: 12px;
font-weight: 600;
color: $value-color;
}
.updated-at {
color: rgba(0, 0, 0, 0.3);
}
.more-info {
color: $moreinfo-color;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment