active_admin_face 0.0.9

data/app/assets/stylesheets/active_admin_face/components/_panels.scss

@@ -0,0 +1,89 @@
+// ----------------------------------- Helper class to apply to elements to make them sections
+.section, .panel {
+  @include section;
+}
+
+// ----------------------------------- Sidebar Sections
+
+.sidebar_section {
+  @include section;
+
+  form fieldset.inputs {
+    background-color: $main-background-color;
+    border: 1px solid $secondary-color;
+  }
+}
+
+.sidebar_section.panel {
+  background: #fff;
+  border: 1px solid #d3d8dc;
+
+  @include no-shadow;
+
+  @include rounded(0);
+
+  form .buttons {
+    background: #f1f5f6;
+    margin: 25px -15px -15px;
+    padding: 10px 15px;
+  }
+
+  form fieldset {
+    margin-bottom: 0;
+  }
+
+  & > h3 {
+    background: $panelHeaderBck;
+    color: $panelHeaderTextColor;
+    border: none;
+    margin: 0;
+    padding: 8px 15px;
+
+    @include no-shadow;
+
+    @include rounded(0);
+
+    text-shadow: none;
+    font-weight: bold;
+  }
+
+  .filter_form_field {
+    label {
+      color: #95a5a6;
+      font-weight: normal;
+      font-size: 13px;
+      text-transform: uppercase;
+      font-family: $skinFontFamily;
+      padding: 7px 0;
+    }
+  }
+}
+
+.panel {
+  // background: #fff;
+  border: 1px solid #d3d8dc;
+  position: relative;
+
+  @include no-shadow;
+
+  @include rounded(0);
+
+  > h3 {
+    background: #f0f4f5;
+    color: $panelHeaderBck;
+    padding: 8px 15px;
+
+    @include no-shadow;
+
+    @include rounded(0);
+
+    text-shadow: none;
+    font-weight: bold;
+    border-style: none none solid;
+  }
+}
+
+// Hide unworking  panel
+#status-poiska-_sidebar_section {
+  display: none;
+}

data/app/assets/stylesheets/active_admin_face/components/_popovers.scss

@@ -0,0 +1,124 @@
+.popover {
+  display: inline-block;
+  position: absolute;
+  background-color: white;
+  padding: 2px;
+  box-shadow: rgba(0, 0, 0, 0.4) 0 1px 3px, lighten($primary-color, 15%) 0px 1px 0px 0px inset;
+  background-color: $primary-color;
+
+  @include gradient(lighten($primary-color, 4%), darken($primary-color, 5%));
+
+  border: solid 1px darken($primary-color, 10%);
+  border-top-color: darken($primary-color, 4%);
+  border-bottom-color: darken($primary-color, 17%);
+  border-radius: 4px;
+
+  .popover_nipple {
+    // The nipple's border
+    content: "";
+    position: absolute;
+    top: -6px;
+    display: block;
+    width: 0;
+    height: 0;
+    border-width: 0 6px 6px;
+    border-style: solid;
+    border-color: darken($primary-color, 4%) transparent;
+    z-index: 100;
+
+    // The nipple's inner shadow
+
+    &:before {
+      content: ' ';
+      position: absolute;
+      width: 0;
+      height: 0;
+      border-width: 0 5px 5px;
+      border-style: solid;
+      border-color: lighten($primary-color, 15%) transparent;
+      left: -5px;
+      top: 1px;
+    }
+
+    // The nipple's background color
+
+    &:after {
+      content: ' ';
+      position: absolute;
+      width: 0;
+      height: 0;
+      border-width: 0 5px 5px;
+      border-style: solid;
+      border-color: lighten($primary-color, 4%) transparent;
+      left: -5px;
+      top: 2px;
+    }
+  }
+
+  .popover_contents {
+    display: block;
+    background-color: #FFF;
+    border: solid 1px darken($primary-color, 10%);
+    box-shadow: lighten($primary-color, 5%) 0px 1px 0px 0px;
+    border-radius: 3px;
+    margin: 0;
+    overflow: hidden;
+    padding: 8px;
+  }
+}
+
+//-------------------------------------- Popover with action list
+
+.popover {
+  ul.popover_contents {
+    list-style-type: none;
+    padding: 0;
+
+    li {
+      display: block;
+      border-bottom: solid 1px #ebebeb;
+      box-sizing: border-box;
+
+      a {
+        display: block;
+        box-sizing: padding-box;
+        font-size: 0.95em;
+        font-weight: bold;
+        padding: 7px 16px 5px;
+        text-decoration: none;
+        text-align: center;
+        -webkit-font-smoothing: antialiased;
+
+        &:hover {
+          @include highlight-gradient;
+
+          @include text-shadow(#5a83aa);
+
+          color: #FFF;
+        }
+
+        &:active {
+          @include reverse-highlight-gradient;
+
+          color: #FFF;
+        }
+      }
+
+      &:first-child {
+        a {
+          border-top-left-radius: 2px;
+          border-top-right-radius: 2px;
+        }
+      }
+
+      &:last-child {
+        a {
+          border-bottom-left-radius: 2px;
+          border-bottom-right-radius: 2px;
+        }
+
+        border: none;
+      }
+    }
+  }
+}

data/app/assets/stylesheets/active_admin_face/components/_scopes.scss

@@ -0,0 +1,10 @@
+.scopes {
+  li {
+    .count {
+      color: #8e979e;
+      font-weight: normal;
+      font-size: 0.9em;
+      line-height: 10px;
+    }
+  }
+}

data/app/assets/stylesheets/active_admin_face/components/_status_tags.scss

@@ -0,0 +1,28 @@
+.status_tag {
+  background: darken($secondary-color, 15%);
+  color: #fff;
+  text-transform: uppercase;
+  letter-spacing: 0.15em;
+  padding: 3px 5px 2px 5px;
+  font-size: 0.8em;
+
+  &.ok, &.published, &.complete, &.completed, &.green {
+    background: #8daa92;
+  }
+
+  &.warn, &.warning, &.orange {
+    background: #e29b20;
+  }
+
+  &.error, &.errored, &.red {
+    background: #d45f53;
+  }
+
+  &.yes {
+    background: #6090DB;
+  }
+
+  &.no {
+    background: grey;
+  }
+}

data/app/assets/stylesheets/active_admin_face/components/_table_tools.scss

@@ -0,0 +1,70 @@
+.table_tools {
+  @include clearfix;
+
+  margin-bottom: 16px;
+}
+
+.table_tools .dropdown_menu {
+  float: left;
+}
+
+a.table_tools_button, .table_tools .dropdown_menu_button {
+  @include light-button;
+
+  @include border-colors(#d9d9d9, #d0d0d0, #c5c5c5);
+
+  font-size: 0.9em;
+  padding: 4px 14px 4px;
+  margin: 0;
+
+  &:not(.disabled) {
+    &:hover {
+      background: #FFF;
+    }
+
+    &:active {
+      @include border-colors(#d7d7d7, #c8c8c8, #c3c3c3);
+
+      box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.17) inset;
+
+      // @include gradient(#FFFFFF, #E8E8E8);
+   
+    }
+  }
+}
+
+.table_tools_segmented_control {
+  list-style-type: none;
+  padding: 0;
+  margin: 0;
+
+  li {
+    float: left;
+
+    a {
+      border-width: 1px .5px 1px .5px;
+      border-radius: 0;
+    }
+
+    &:first-child a {
+      border-left-width: 1px;
+      border-radius: 12px 0 0 12px;
+    }
+
+    &:last-child a {
+      border-right-width: 1px;
+      border-radius: 0 12px 12px 0;
+    }
+
+    &.selected a {
+      @include gradient(#F0F0F0, #FDFDFD);
+
+      box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1) inset;
+      cursor: default;
+
+      &:hover {
+        @include gradient(#F0F0F0, #FDFDFD);
+      }
+    }
+  }
+}

data/app/assets/stylesheets/active_admin_face/components/_tables.scss

@@ -0,0 +1,305 @@
+// ----------------------------------- Tables
+
+table tr {
+  td {
+    vertical-align: top;
+  }
+}
+
+// --------- Index Tables
+
+table.index_table {
+  width: 100%;
+  margin-bottom: 10px;
+  border: 1px solid #d3d8dc;
+  border-spacing: 0;
+  background: #fff;
+
+  th {
+    @include section-header;
+
+    text-align: left;
+    background: #f1f5f6;
+    border: 1px #d3d8dc;
+    border-style: none solid solid none;
+    padding: 7px 10px;
+
+    @include no-shadow;
+
+    color: $skinTextColor;
+
+    a, a:link, a:visited {
+      color: $skinTextColor;
+      text-decoration: none;
+      display: block;
+      white-space: nowrap;
+      -webkit-font-smoothing: antialiased;
+    }
+
+    &.sortable a {
+      position: relative;
+      padding-left: 20px;
+
+      &:before {
+        color: lighten($skinActiveColor, 10%);
+
+        @extend .fa;
+
+        @extend .fa-sort;
+
+        background: none;
+        position: absolute;
+        left: 5px;
+        top: 5px;
+      }
+    }
+
+    &.sorted-asc a {
+      position: relative;
+      padding-left: 20px;
+
+      &:before {
+        font-size: 1.5em;
+        color: lighten($skinActiveColor, 10%);
+
+        @extend .fa;
+
+        @extend .fa-sort-amount-asc;
+
+        background: none;
+        position: absolute;
+        left: -5px;
+        top: -3px;
+      }
+    }
+
+    &.sorted-desc a {
+      position: relative;
+      padding-left: 20px;
+
+      &:before {
+        color: lighten($skinActiveColor, 10%);
+        font-size: 1.5em;
+
+        @extend .fa;
+
+        @extend .fa-sort-amount-desc;
+
+        background: none;
+        position: absolute;
+        left: -5px;
+        top: -3px;
+      }
+    }
+
+    &.sorted-asc, &.sorted-desc {
+      background: $title-bar-background;
+
+      // @include gradient(darken($secondary-gradient-start, 5%), darken($secondary-gradient-stop, 5%));
+   
+    }
+
+    &:last-child {
+      border-right: none;
+    }
+  }
+
+  tr.even td {
+    background: $table-stripe-color;
+  }
+
+  tr:hover td {
+    background-color: $table-selected-color;
+  }
+
+  tr.selected td {
+    background: $table-selected-color;
+  }
+
+  td {
+    padding: 10px $cell-horizontal-padding 8px $cell-horizontal-padding;
+    border-bottom: 1px solid #e8e8e8;
+    vertical-align: top;
+    color: $skinTextTable;
+
+    a, a:link, a:visited {
+      color: $skinTextTable;
+      display: inline-block;
+      padding: 2px 3px;
+      margin: (-2px) 0;
+      transition: $link_transition_dutarion;
+
+      &:hover {
+        color: #fff;
+        background: lighten($skinActiveColor, 10%);
+      }
+    }
+
+    a.delete_link {
+      &:hover {
+        background: darken($skinActiveColor, 10%);
+      }
+    }
+  }
+}
+
+// --------- Tables inside Panels
+
+.panel_contents table {
+  margin-top: 5px;
+
+  th {
+    padding-top: 10px;
+    background: none;
+    color: $primary-color;
+
+    @include no-shadow;
+
+    text-transform: uppercase;
+    border-bottom: 1px solid #ccc;
+  }
+
+  tr.odd td {
+    background: darken($table-stripe-color, 3%);
+  }
+
+  tr.even td {
+    background: $table-stripe-color;
+  }
+}
+
+// -------------------------------------- Resource Attributes Table
+.attributes_table {
+  overflow: hidden;
+}
+
+.attributes_table table {
+  col.even {
+    background: $table-stripe-color;
+  }
+
+  col.odd {
+    background: darken($table-stripe-color, 3%);
+  }
+
+  th, td {
+    padding: 8px $cell-horizontal-padding 6px $cell-horizontal-padding;
+    vertical-align: top;
+    border-bottom: 1px solid #e8e8e8;
+  }
+
+  th {
+    @include no-shadow;
+
+    @include no-gradient;
+
+    width: 150px;
+    font-weight: normal;
+    font-size: 1.2em;
+    padding: 10px 0 10px 10px;
+    font-family: $skinFontFamily;
+    text-transform: uppercase;
+    color: $primary-color;
+
+    @include text-shadow;
+  }
+
+  td {
+    padding: 10px 0 10px 10px;
+    font-family: $skinFontFamily;
+    color: $primary-color;
+
+    .empty {
+      color: #bbb;
+      font-size: 0.8em;
+      text-transform: uppercase;
+      letter-spacing: 0.2em;
+    }
+
+    &:first-child {
+      width: 25%;
+    }
+  }
+}
+
+.sidebar_section .attributes_table th {
+  width: 50px;
+}
+
+//-----------------------default table styling
+
+table {
+  width: 100%;
+  max-width: 100%;
+  margin-bottom: 20px;
+  border: 1px solid lighten($primary-color, 35%);
+
+  // Cells
+  > thead,
+  > tbody,
+  > tfoot {
+    > tr {
+      > th,
+      > td {
+        padding: 6px;
+        line-height: 1.5;
+        vertical-align: top;
+
+        //  border: 1px solid lighten( $primary-color, 35%);
+     
+      }
+    }
+  }
+
+  // Bottom align for column headings
+  > thead > tr {
+    > th {
+      vertical-align: bottom;
+      border-bottom: 2px solid lighten($primary-color, 35%);
+    }
+
+    > th,
+    > td {
+      border-bottom-width: 2px;
+    }
+  }
+
+  > tbody > tr:hover {
+    background-color: $table-selected-color;
+  }
+
+  // Remove top border from thead by default
+  > caption + thead,
+  > colgroup + thead,
+  > thead:first-child {
+    > tr:first-child {
+      > th,
+      > td {
+        border-top: 0;
+      }
+    }
+  }
+
+  // Account for multiple tbody instances
+  > tbody + tbody {
+    border-top: 2px solid lighten($primary-color, 35%);
+  }
+
+  // Nesting
+  .table {
+    background-color: $main-background-color;
+  }
+}
+
+.table_actions {
+  text-align: center;
+
+  a.member_link {
+    text-decoration: none;
+
+    &:before {
+      font-size: 1.5em;
+      padding: 5px;
+    }
+  }
+}