spina-template 0.2.4

data/app/assets/stylesheets/spina/_modal.css.sass

@@ -0,0 +1,158 @@
+#overlay
+  display: none
+  height: 100%
+  left: 0
+  position: fixed
+  top: 0
+  width: 100%
+  z-index: 999
+  @include background-image(radial-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .6)))
+
+.modal
+  background: #fff
+  border-radius: 3px
+  display: none
+  margin: 0 auto
+  max-width: 480px
+  min-height: 100px
+  position: relative
+  @include animation-duration(.4s)
+
+  @media screen and (max-width: 480px)
+    margin: 0 10px
+
+  &.modal-small
+    width: 320px
+
+  &.modal-medium
+    max-width: 640px
+
+  &.modal-large
+    max-width: none
+    width: 80%
+
+    footer a
+      padding: 18px 0
+
+  header h3
+    border-radius: 2px 2px 0 0
+    color: #232323
+    font-size: 16px
+    font-weight: 400
+    margin: 0
+    padding: 20px
+
+  header.big-header h2
+    color: #333
+    font-size: 36px
+    font-weight: 400
+    margin: 0
+    padding-top: 48px
+    text-align: center
+
+  header.big-header h3
+    line-height: 24px
+    padding: 46px
+    text-align: center
+
+    @media screen and (max-width: 480px)
+      padding: 30px 20px
+
+  header.big-header p
+    color: #333
+    font-size: 18px
+    font-weight: 400
+    margin: 0
+    margin-top: 9px
+    padding-bottom: 48px
+    text-align: center
+
+    strong
+      font-weight: 600
+
+  header h3 strong
+    color: #000
+    font-weight: 600
+
+  header a[data-dismiss="modal"]
+    color: #d6d6d6
+    float: right
+    font-size: 12px
+    padding: 5px 6px
+    text-decoration: none
+    @include transition(color .2s ease-out)
+
+  header a[data-dismiss="modal"]:hover
+    color: #999
+
+  section
+    overflow: scroll
+    padding: 20px
+    background: white
+
+    .col
+      float: left
+      width: 33%
+      padding: 10px
+
+      h3
+        font-size: 16px
+        font-weight: bold
+        line-height: 26px
+
+      p
+        line-height: 22px
+
+      pre
+        font-size: 12px
+        background: #ddd
+        border: 1px solid #bbb
+        padding: 10px
+        border-radius: 5px
+        margin-bottom: 20px
+        color: #444
+        line-height: 20px
+        font-family: Consolas, Courier, monospace
+
+    &.section-divided
+      border-top: 1px solid #eee
+
+    footer
+      clear: both
+      margin: -20px
+
+    table
+      color: #333
+      font-size: 15px
+      line-height: 24px
+
+      th
+        font-weight: 600
+        padding-right: 24px
+        text-align: left
+
+      td
+        font-weight: 400
+
+    table.table-centered
+      margin: 0 auto
+
+  footer
+    border-top: 1px solid #eee
+
+  footer a, footer button
+    background: none
+    color: #999
+    display: inline-block
+    font-size: 13px
+    font-weight: 600
+    padding: 12px 0
+    text-align: center
+    width: 49%
+    @include transition(color .2s ease-out)
+
+  footer a.primary, footer a:hover, footer button.primary, footer button:hover
+    color: #000
+
+  footer a.primary:hover, footer button.primary:hover
+    color: $primary-color

data/app/assets/stylesheets/spina/_sortable_lists.css.sass

@@ -0,0 +1,161 @@
+// Sortable lists
+
+.dd
+  margin: 0 -40px
+  overflow: hidden
+  position: relative
+
+  & > .dd-list > .dd-item:first-child
+    border-top: none
+
+.dd-item-inner.dd-handle
+  cursor: move
+
+.dd-item-inner .sortable-link
+  @include transform(translateX(-26px))
+  @include transition(all .2s ease)
+
+.dd-item-inner.dd-handle .sortable-link
+  @include transform(translateX(0))
+
+.dd-item-inner:before
+  color: #ccc
+  content: "7"
+  display: inline-block
+  font-family: $icon-font
+  height: 18px
+  opacity: 0
+  vertical-align: middle
+  width: 26px
+  @include transform(translateX(-26px))
+  @include transition(all .2s ease)
+
+.dd-item-inner.dd-handle:before
+  opacity: 1
+  @include transform(translateX(0))
+
+.dd-list
+  list-style: none
+  margin: 0
+  padding: 0
+  position: relative
+
+  .dd-placeholder
+    position: relative
+
+    &:after
+      border: 1px dashed #ddd
+      content: " "
+      display: block
+      height: 100%
+      margin-left: 0px
+      top: 0px
+      width: 100%
+      @include box-sizing(border-box)
+
+  .dd-list
+    background: #f9f9f9
+    border-top: 1px solid #ddd
+
+    .dd-placeholder
+      background: #f9f9f9
+
+      &:after
+        margin-left: 60px
+
+    .dd-item:last-child
+      border-bottom: none
+    
+    .dd-item
+      padding-left: 30px
+
+    .dd-list
+      background: #f1f1f1
+      margin-left: -30px
+
+      .dd-item
+        padding-left: 60px
+
+      .dd-placeholder
+        background: #f1f1f1
+
+        &:after
+          margin-left: 90px
+
+.dd-collapsed .dd-list
+  display: none
+
+.dd-item
+  border-bottom: 1px solid #ddd
+
+.dd-item, .dd-empty, .dd-placeholder
+  margin: 0
+  padding: 0
+  position: relative
+
+.dd-placeholder, .dd-empty
+  background: #fcfcfc
+  margin: 0
+  padding: 0
+  @include box-sizing(border-box)
+
+.dd-empty
+  background: blue
+  min-height: 100px
+
+.dd-item-inner
+  padding: 10px 40px
+  text-decoration: none
+
+  a
+    margin: 0
+
+  a.sortable-link, a.sortable-link:hover
+    color: $primary-color
+    font-size: 13px
+    font-weight: 600
+    padding-left: 0
+
+    small
+      font-size: 13px
+      font-weight: 400
+      margin-left: 13px
+
+.dd-dragel
+  pointer-events: none
+  position: absolute
+  z-index: 9999
+
+  & > .dd-item .dd-handle
+    margin-top: 0
+
+.dd-item > button
+  background: transparent
+  border: 0
+  cursor: pointer
+  display: block
+  float: left
+  font-size: 9px
+  height: 52px
+  line-height: 20px
+  overflow: hidden
+  margin-left: 10px
+  padding: 0
+  position: relative
+  text-align: center
+  text-indent: 100%
+  white-space: nowrap
+  width: 30px
+
+  &:before
+    color: $primary-color
+    content: "t"
+    display: block
+    font-family: $icon-font
+    position: absolute
+    text-align: center
+    text-indent: 0
+    width: 100%
+
+  &[data-action="collapse"]:before
+    content: "X"

data/app/assets/stylesheets/spina/_tables.css.sass

@@ -0,0 +1,144 @@
+// Tables
+
+.table-container
+  margin: 0 -40px
+
+  table.table tr td:first-child, table.table tr th:first-child
+    padding-left: 40px
+
+  table.table tr td:last-child, table.table tr th:last-child
+    padding-right: 40px
+
+.modal .table-container
+  margin: 0 -20px
+
+  table.table tr td:first-child, table.table tr th:first-child
+    padding-left: 20px
+
+  table.table tr td:last-child, table.table tr th:last-child
+    padding-right: 20px
+
+table.table
+  color: #333
+  font-size: 13px
+  line-height: 18px
+  margin: 20px 0
+  width: 100%
+
+  thead tr, tbody tr
+    border-bottom: 1px solid #ddd
+
+  tbody tr:last-child
+    border: none
+
+  thead th
+    outline: none
+    padding: 6px 12px
+    text-align: left
+
+  tbody td, tbody th
+    padding: 10px 12px
+    text-align: left
+
+  th.nowrap, td.nowrap
+    white-space: nowrap
+
+  small
+    color: #666
+    display: block
+    font-size: 13px
+    font-weight: normal
+
+  td .button
+    margin-bottom: 0
+
+  td.align-center
+    text-align: center
+
+  td.align-left
+    text-align: left
+
+  td.align-right
+    text-align: right
+
+// Table form
+
+table.table.table-form
+  tr td:first-child
+    min-width: 200px
+    width: 30%
+
+  td .image
+    border-radius: 3px
+    display: inline-block
+    height: 85px
+    overflow: hidden
+    width: 152px
+
+    img
+      display: block
+      height: 100%
+      width: 100%
+
+  td .attachment
+    display: inline-block
+    margin: 10px 25px 10px 0
+
+    &:before
+      content: "S"
+      font-family: $icon-font
+      font-size: 28px
+      margin-right: 10px
+      vertical-align: middle
+
+// Clickable tables
+
+.table-clickable
+  tbody tr:hover
+    background: #f9f9f9
+
+  tbody tr
+    cursor: pointer
+
+// Datatables
+
+.dataTables_filter
+  display: none
+
+.table-container > .search-input
+  margin-right: 40px
+
+.dataTables_info
+  color: #666
+  display: inline-block
+  font-size: 12px
+  margin-left: 40px
+
+.dataTable
+  th.sorting_desc
+    &:after
+      content: "0"
+      font-family: $icon-font
+      float: right
+
+  th.sorting_asc
+    &:after
+      content: "1"
+      font-family: $icon-font
+      float: right
+
+.dataTables_paginate
+  float: right
+  margin-right: 40px
+
+  a
+    color: #333
+    cursor: pointer
+    display: inline-block
+    font-size: 13px
+    font-weight: bold
+    line-height: 24px
+    padding: 0 13px
+
+  a.paginate_disabled_previous, a.paginate_disabled_next
+    display: none

data/app/assets/stylesheets/spina/_wysihtml5.css.sass

@@ -0,0 +1,73 @@
+textarea.wysihtml5
+  font-size: 14px
+  height: 225px
+  padding-top: 50px
+  padding-right: 125px
+  resize: none
+
+  &:focus
+    border: 1px solid $primary-color
+
+.wysihtml5-container
+  overflow: hidden
+  position: relative
+
+  .toolbar
+    border-bottom: 1px solid #e9e9e9
+    top: 1px
+    left: 1px
+    line-height: 40px
+    position: absolute
+    width: 100%
+
+    a.command
+      border-right: 1px solid #e9e9e9
+      color: #999
+      display: block
+      float: left
+      height: 40px
+      text-align: center
+      width: 40px
+
+    a.wysihtml5-command-active, a.command:hover
+      color: #333
+
+    .command-bold, .command-italic, .command-insert-unordered-list, .command-link, .action-change-view
+      font-size: 12px
+      line-height: 43px
+
+    .command.action-change-view
+      border: none
+      float: right
+
+    .choose-text-type
+      border-left: 1px solid #e9e9e9
+      display: none
+      height: 183px
+      padding-top: 6px
+      position: absolute
+      right: 0
+      top: 40px
+      width: 115px
+
+      a
+        color: #999
+        display: block
+        line-height: 40px
+        padding: 0 16px
+
+      a:hover
+        color: #333
+
+      ul li a
+        color: #999
+        line-height: 30px
+        text-align: left
+
+        &.wysihtml5-command-active
+          color: $primary-color
+
+        &.wysihtml5-command-active:hover
+          background: none
+          color: $primary-color
+          cursor: default

data/app/assets/stylesheets/spina/wysihtml5_textarea.css.sass

@@ -0,0 +1,14 @@
+h1, h2, h3
+  font-weight: 600
+
+img
+  border-radius: 3px
+  display: block
+  height: auto
+  margin: 13px 0
+  max-height: 100px
+  max-width: 100px
+  width: auto
+
+img:first-child
+  margin-top: 0