summaryrefslogtreecommitdiff
path: root/templates/project/widgets/list
diff options
context:
space:
mode:
Diffstat (limited to 'templates/project/widgets/list')
-rw-r--r--templates/project/widgets/list/list.coffee15
-rw-r--r--templates/project/widgets/list/list.html15
-rw-r--r--templates/project/widgets/list/list.scss50
3 files changed, 80 insertions, 0 deletions
diff --git a/templates/project/widgets/list/list.coffee b/templates/project/widgets/list/list.coffee
new file mode 100644
index 0000000..6b1cc50
--- /dev/null
+++ b/templates/project/widgets/list/list.coffee
@@ -0,0 +1,15 @@
+class AllTheThings.List extends AllTheThings.Widget
+ source: 'list'
+
+ @accessor 'current', Batman.Property.EasingSetter
+
+ @accessor 'arrow', ->
+ if @get('last')
+ if parseInt(@get('current')) > parseInt(@get('last')) then 'arrow-up' else 'arrow-down'
+
+ ready: ->
+ Batman.setImmediate =>
+ if @get('unordered')
+ $(@node).find('ol').remove()
+ else
+ $(@node).find('ul').remove() \ No newline at end of file
diff --git a/templates/project/widgets/list/list.html b/templates/project/widgets/list/list.html
new file mode 100644
index 0000000..cc90d42
--- /dev/null
+++ b/templates/project/widgets/list/list.html
@@ -0,0 +1,15 @@
+<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.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.value"></span>
+ </li>
+</ul> \ No newline at end of file
diff --git a/templates/project/widgets/list/list.scss b/templates/project/widgets/list/list.scss
new file mode 100644
index 0000000..248cef8
--- /dev/null
+++ b/templates/project/widgets/list/list.scss
@@ -0,0 +1,50 @@
+// ----------------------------------------------------------------------------
+// Sass declarations
+// ----------------------------------------------------------------------------
+$widget-list_background-color: #12b0c5;
+$widget-list_value-color: #fff;
+
+$widget-list_title-color: lighten($widget-list_background-color, 45%);
+$widget-list_label-color: lighten($widget-list_background-color, 45%);
+
+// ----------------------------------------------------------------------------
+// Widget-list styles
+// ----------------------------------------------------------------------------
+.widget-list {
+
+ background-color: $widget-list_background-color;
+
+ .title {
+ color: $widget-list_title-color;
+ }
+
+ ol, ul {
+ margin: 0 15px;
+ text-align: left;
+ color: $widget-list_label-color;
+ }
+
+ ol {
+ list-style-position: inside;
+ }
+
+ li {
+ margin-bottom: 5px;
+ }
+
+ .list-nostyle {
+ list-style: none;
+ }
+
+ .label {
+ color: $widget-list_label-color;
+ }
+
+ .value {
+ float: right;
+ margin-left: 12px;
+ font-weight: 600;
+ color: $widget-list_value-color;
+ }
+
+} \ No newline at end of file