cd2_catton_cms 1.1.10

data/app/assets/stylesheets/c/application/partials/_categories_sidebars/_2.sass

@@ -0,0 +1,77 @@
+.categories-menu
+  padding-top: 1px
+  margin-bottom: 16px
+  @media (min-width: $l)
+    margin-bottom: 0
+
+.categories-menu__section
+  border-top: 1px solid #e5e5e5
+  border-left: 1px solid #e5e5e5
+  border-right: 1px solid #e5e5e5
+  position: relative
+  line-height: 1.5rem
+  background-color: #f5f5f5
+  &:last-of-type
+    border-bottom: 1px solid #e5e5e5
+
+  input[type="checkbox"]
+    display: none
+  label:after
+    content: "-"
+    display: block
+    cursor: pointer
+    font-size: 1.2rem
+  input[type="checkbox"]:checked ~ label:after
+    content: "+"
+  input[type="checkbox"]:checked ~ .categories-menu__list
+    display: none
+  input[type="checkbox"]:hover ~ h2
+    background-color: #e5e5e5
+
+  h2
+    font-weight: lighter
+    margin: 0
+    padding: 8px 8px 8px 16px
+    text-transform: uppercase
+    font-size: 1.1rem
+    transition: 0.2s
+    &:hover
+      background-color: #e5e5e5
+
+.categories-menu__expand
+  position: absolute
+  top: 8px
+  right: 16px
+  color: lighten($primary_text_color, 10%)
+
+.categories-menu__list
+  ul
+    list-style: none
+    padding: 0
+    margin: 0
+  li
+    font-size: 0.85rem
+    text-transform: uppercase
+    a
+      transition: 0.2s
+      text-decoration: none
+      color: $accent_color
+      display: inline-block
+      padding: 8px 8px 8px 24px
+      width: 100%
+      font-size: 0.8rem
+      &:hover
+        background-color: #e5e5e5
+        cursor: pointer
+
+  img
+    width: 100%
+    margin: 0
+    display: block
+
+  &--sub
+    li
+      font-size: 0.85rem
+    a
+      display: block
+      padding: 8px 8px 8px 40px !important

data/app/assets/stylesheets/c/application/partials/_footer.sass

@@ -0,0 +1,43 @@
+#footer
+  color: white
+  a
+    color: inherit
+  .footer__inner
+    background-color: $accent_color
+    margin: 0 auto
+    max-width: $site_width
+    padding: 40px
+
+  .footer__links
+    display: inline-block
+    width: 16%
+    min-width: 200px
+    vertical-align: top
+    ul
+      margin: 0
+      padding: 0
+    li
+      list-style: none
+      margin-bottom: 10px
+    h4
+      margin: 0 0 12px
+      font-size: 0.75rem
+      text-transform: uppercase
+      opacity: 0.6
+    i
+      font-size: 1.5rem
+    @media (max-width: 900px)
+      display: block
+      width: 100%
+      text-align: center
+      + .footer__links
+        margin-top: 30px
+
+  .footer__copyright_bar
+    background-color: $primary_color
+    margin: 0 auto
+    max-width: $site_width
+    padding: 20px
+    text-align: center
+    span
+      color: rgba(white, 0.75)

data/app/assets/stylesheets/c/application/partials/_header.sass

@@ -0,0 +1,317 @@
+.header
+
+  &__text
+    color: white
+    a
+      color: white
+  &__wrap
+    position: relative
+    background: $header_background
+    padding: 10px 10px 10px 0
+    @media (min-width: $m)
+      padding: 20px 20px 20px 0
+    &--narrow
+      padding: 5px
+
+  &__logo
+    height: $logo_height
+
+  &__toggle
+    i
+      font-size: 1.5rem
+    @media (min-width: $m)
+      display: none
+
+  &__search
+    input[type="search"]
+      background: #e5e5e5
+      border: 0
+      padding: 0 12px
+      height: 36px
+      width: 100%
+      max-width: 460px
+    &--bordered
+      input[type="search"]
+        border: 1px solid #929292
+
+  &__menu
+    display: none
+    ul
+      margin: 0
+      padding: 0
+    li
+      list-style: none
+      display: inline-block
+      margin-right: 15px
+    &--uppercase
+      li
+        text-transform: uppercase
+    &--colored
+      li
+        color: $primary_color
+    @media (min-width: $m)
+      display: block
+
+  &__basket
+    padding: 20px 30px
+    text-align: center
+    background-color: $primary_color
+    transition: 0.2s
+    a
+      color: white
+    b
+      display: block
+      font-size: 1.15rem
+    // &:hover
+    //   background-color: $light_primary_color
+    &--rounded
+      border-radius: 4px
+    &--full-height
+      height: 100%
+
+.main-menu
+  position: relative
+  padding: 0 16px
+  display: none
+  a
+    color: white
+    text-transform: uppercase
+  &--centered
+    text-align: center
+  .show-menu &
+    display: block
+  @media (min-width: $m)
+    display: block
+
+.main-menu__item--root
+  display: inline-block
+  margin-right: 16px
+  list-style: none
+  padding: 16px 0
+  width: 100%
+  @media (min-width: $m)
+    width: initial
+
+.main-menu__item--child
+  display: none
+  margin: 16px 0 0 0
+  padding: 0
+  list-style: none
+  padding: 0 16px 16px 16px
+  ul
+    list-style: none
+    margin: 0
+    padding: 0
+  li
+    padding-top: 16px
+    display: inline-block
+    width: 100%
+  @media (min-width: $m)
+    column-count: 3
+  @media (max-width: $m + 1px )
+    text-align: center
+
+.main-menu__item--root:hover .main-menu__item--child
+  display: block
+  width: 100%
+  background-color: #2b2b2b
+  left: 0
+  z-index: 2
+  @media (min-width: $m)
+    position: absolute
+
+//-- OLD HEADER STYLES NEED TO BE BEM'D --//
+#header
+  color: white
+  position: relative
+
+
+  .header__top_bar, .header__inner, .header__trailing_inner, .category_menu__wrapper
+    margin: 0 auto
+    max-width: $site_width
+
+  .header__top_bar
+    +flexbox
+    +justify-content(space-between)
+    padding: 10px 20px
+    background-color: #1b1b1b
+    a
+      color: white
+
+    .shop__info
+      @media (max-width: 500px)
+        display: none
+
+    .separator
+      margin: 0 5px
+
+    .account_link__wrapper
+      .mobile__basket_link
+        display: inline-block
+        @media (min-width: 899px)
+          display: none
+
+  .header__menu
+    position: absolute
+    left: 200px
+    ul
+      display: inline-block
+      margin: 0
+      padding: 0
+      list-style: none
+      li
+        display: inline-block
+        margin: 0 6px
+    @media (max-width: 520px)
+      display: none
+
+  .header__inner
+    position: relative
+    width: 100%
+    padding: 20px
+    background-color: white
+    @media (min-width: 521px)
+      height: 105px
+
+  .logo
+    background-image: image_url('c/main_application/logo.png')
+    background-size: cover
+    background-repeat: no-repeat
+    padding: 50px 75px
+    position: absolute
+    left: 20px
+    top: 20px
+    @media (max-width: 520px)
+      position: static
+    @media (max-width: 380px)
+      background-size: 85%
+
+  .search__wrapper
+    position: absolute
+    left: 200px
+    bottom: 20px
+    color: $primary_color
+    input:nth-child(2)
+      appearance: none
+      -moz-appearance: none
+      -webkit-appearance: none
+      border: none
+      padding: 10px
+      width: 300px
+      outline: none
+      background-color: #ddd
+      @media (max-width: 750px)
+        width: 250px
+      @media (max-width: 620px)
+        width: 150px
+      @media (max-width: 520px)
+        width: 100%
+    @media (max-width: 520px)
+      display: block
+      position: static
+      margin-top: 10px
+    @media (max-width: 380px)
+      margin-top: 0
+
+  .mobile__menu_toggle
+    position: absolute
+    right: 50px
+    top: 50px
+    z-index: 100
+    i
+      font-size: 2rem
+    @media (min-width: 521px)
+      display: none
+    @media (max-width: 380px)
+      right: 30px
+
+  .basket_link__wrapper
+    position: absolute
+    right: 20px
+    top: 20px
+    height: 65px
+    display: inline-block
+    text-align: center
+    padding: 10px 30px
+    background-color: #dd3531
+    transition: 0.2s
+    a
+      color: white
+    &:hover
+      background-color: lighten(#dd3531, 10%)
+      cursor: pointer
+    p
+      margin: 10px 0 0
+      text-transform: uppercase
+      font-size: 0.9rem
+    i, span
+      font-size: 0.7rem
+
+    @media (max-width: 900px)
+      display: none
+
+
+  .category_menu__wrapper
+    .category_menu
+      background-color: $primary_color
+      text-align: center
+      position: relative
+      @media (min-width: 521px)
+        padding: 0 10px
+      li
+        list-style: none
+        @media (min-width: 521px)
+          display: inline-block
+      a
+        display: inline-block
+        padding: 14px 20px
+        text-transform: uppercase
+        font-weight: 400
+        font-size: 0.9rem
+        color: white
+
+      .dropdown_top
+        display: inline-block
+        width: 100%
+
+      .hover_menu
+        padding: 10px
+        display: none
+        @media (min-width: 521px)
+          font-size: 0
+          position: absolute
+          z-index: 5
+          column-count: 3
+
+        ul
+          margin: 0
+          padding: 0
+        li
+          width: 100%
+          @media (min-width: 521px)
+            margin: 10px
+            text-align: left
+          @media (max-width: 520px)
+            + li
+              margin-top: 15px
+        a
+          color: white
+          font-size: 0.75rem
+          padding: 0
+        .show_sub_menu &
+          display: block
+
+      .dropdown_top:hover .hover_menu
+        display: block
+        background-color: #2b2b2b
+        left: 0
+        font-size: 1rem
+        color: #1a1c25
+
+      @media (max-width: 520px)
+        display: none
+        .show_menu &
+          display: block
+      .mobile__menu_toggle
+        padding-top: 15px
+        position: static

data/app/assets/stylesheets/c/engine/_draggable_trees.sass

@@ -0,0 +1,68 @@
+.draggable_tree_list_container
+  position: relative
+.draggable_tree_container
+  margin-bottom: 5px
+  background-color: #ffffff
+  border: 1px solid rgba(170, 180, 200, 0.5)
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05)
+  border-radius: 3px
+  padding: 0 5px 0 0
+  +user-select(none)
+  position: relative
+
+  &.floating
+    position: absolute
+    z-index: 999
+    width: 100%
+    box-sizing: border-box
+
+  input[type=checkbox].hide_children:checked
+
+    + .draggable_tree_row
+      label i:before
+        transform: rotate(-90deg)
+    ~ .draggable_tree_children
+      height: 0
+
+  .draggable_tree_move_handle
+    display: inline-block
+    opacity: 1
+    transition: 0.4s
+    width: 10px
+    background-image: image_url('c/drag_handle.gif')
+    height: 16px
+    background-repeat: no-repeat
+    vertical-align: middle
+    cursor: move
+
+  .draggable_tree_collapse_handle
+    display: inline-block
+    vertical-align: middle
+    margin: 0 12px 0 5px
+    cursor: pointer
+    i:before
+      display: block
+      transition: 0.3s
+      line-height: 10px
+      opacity: 0.7
+
+  .draggable_tree_link
+    display: inline-block
+    vertical-align: middle
+
+  .draggable_tree_row
+    padding: 14px
+
+  .draggable_tree_children
+    margin-left: 30px
+    overflow: hidden
+    transition: 0.3s
+    position: relative
+
+.draggable_tree_row:hover .draggable_tree_move_handle
+  opacity: 1
+
+[data-ghost]
+  box-shadow: 0 0 4px rgba(0,0,0,0.1)
+  background: rgba(black, 0.1)
+  margin: 5px

data/app/assets/stylesheets/c/engine/_form_pages.sass

@@ -0,0 +1,153 @@
+.form-page
+  &--narrow
+    padding: 40px
+    background: white
+
+  &--wide
+    background-color: white
+
+  &__intro
+    padding: 40px
+    background-color: #fbfbfb
+    position: relative
+    z-index: 1
+    border-bottom: 1px solid #eee
+    h1, h2, h3, a
+      display: inline-block
+      margin: 0
+      vertical-align: middle
+    h1
+      margin-right: 10px
+      font-size: 1.4rem
+      margin-bottom: 0
+    p
+      margin-bottom: 0
+    a
+      margin-left: 5px
+    p, li
+      opacity: 0.6
+      max-width: 800px
+    ul
+      padding-left: 20px
+  &__actions
+    padding: 10px 20px
+    background: white
+    border-bottom: 1px solid #ddd
+    border-top: 1px solid #eee
+    input
+      margin-bottom: 0
+
+  &__right-actions
+    float: right
+
+.fixed-form-panel
+  +flex(0 0 350px)
+  padding: 15px 10px 0
+  background: white
+  position: relative
+  z-index: 2
+  border-radius: 3px
+  @media (max-width: $xxl)
+    box-shadow: none
+    border-right: 1px solid #e5e5e5
+  @media (min-width: $xxl)
+    margin-right: 10px
+    left: 10px
+    top: -10px
+  &--wide
+    +flex(0 0 300px)
+    @media (min-width: $xxl)
+      +flex(0 0 400px)
+
+fieldset
+  margin-bottom: 10px
+  padding: 6px 4px
+  border-radius: 3px
+  background-color: #fcfcfc
+  border: 1px solid #e5e5e5
+  .btn
+    margin-bottom: 0
+
+.fieldset-title
+  font-size: 11px
+  color: #666
+  display: block
+  margin-bottom: 6px
+
+label.ebay_channel
+  background-image: image_url('c/ebay.png')
+  background-size: contain
+  background-repeat: no-repeat
+  background-position: 50% 27px
+  color: rgba(0,0,0,0)!important
+  .ebay_push_issue &
+    background-color: rgba(red, 0.15)
+
+label.amazon_channel
+  background-image: image_url('c/amazon.png')
+  background-size: contain
+  background-repeat: no-repeat
+  background-position: 50% 31px
+  color: transparent !important
+
+label.web_channel
+  background-image: image_url('c/logo--dark.svg')
+  background-size: contain
+  background-repeat: no-repeat
+  background-position: 50% 24px
+  color: transparent !important
+
+.tight-tabs
+  .tab_heads_container
+    padding: 0
+  .tab_heads_container label
+    padding: 28px 0 16px
+    margin: 0 9px
+    font-size: 13px
+    font-weight: 600
+
+.sub_tabs_container .tab_heads_container
+  background-color: $primary_color
+  label
+    padding: 10px 0!important
+
+.tabs_container
+  input[type='radio'].tab_controller
+    @for $i from 1 through 10
+      &:nth-child(#{$i}):checked ~
+        .tab_heads_container
+          label:nth-child(#{$i})
+            border-bottom: 2px solid $primary_color!important
+
+.channel_toggle_check_box
+  padding: 10px 20px
+  background-color: $dark_primary_color
+  margin-bottom: 0
+  label
+    color: white
+
+.dropzone
+  height: 100px
+  background: #f1f1f1
+  border: 2px dashed #ddd
+  border-radius: 4px
+  cursor: pointer
+  label
+    pointer-events: none
+    text-align: center
+    padding: 40px
+
+.split_selector a
+  color: white
+
+ul.quick_actions
+  position: absolute
+  background: $primary_color
+  right: 20px
+  border-radius: 4px
+  list-style: none
+  padding: 12px
+  text-align: right
+  input
+    background-color: transparent
+    border: none

data/app/assets/stylesheets/c/engine/_header_bar.sass

@@ -0,0 +1,29 @@
+.header-bar
+  background-color: #1b1b1b
+  width: 100%
+  z-index: 99
+  box-shadow: 0 0 3px rgba(0,0,0,.2)
+  position: relative
+  height: 55px
+  line-height: 55px
+  color: white
+
+  &__toggle
+    width: 52px
+    padding: 0 25px
+    cursor: pointer
+    color: white
+    opacity: 0.5
+
+  &__logo
+    padding: 10px
+
+  &__version-info
+    color: #71a230
+
+  &__user
+    text-align: right
+    color: rgba(white, 0.8)
+    padding-right: 40px
+    a
+      color: white

data/app/assets/stylesheets/c/engine/_index_header.sass

@@ -0,0 +1,17 @@
+.index-header
+  background-color: white
+  box-shadow: inset 0 -1px 0 0 rgba(0,0,0,.12)
+  padding: 40px 40px 25px
+  h1, h2, h3, a
+    display: inline-block
+    margin: 0
+    vertical-align: middle
+  h1
+    margin-right: 10px
+  a
+    margin-left: 5px
+  p, li
+    opacity: 0.6
+    max-width: 800px
+  ul
+    padding-left: 20px

data/app/assets/stylesheets/c/engine/_layout.sass

@@ -0,0 +1,15 @@
+@import login
+@import sidebar
+@import navbar
+@import index_header
+@import settings
+@import form_pages
+@import header_bar
+@import flash_messages
+@import tables
+@import draggable_trees
+@import pagination
+
+.main-app
+  background-color: #f5f5f5
+