pure-admin-rails 2.0.0

data/app/assets/stylesheets/pure_admin/forms.css.scss

@@ -0,0 +1,129 @@
+.pure-form {
+  font-size: 14px;
+
+  label {
+    font-size: 14px;
+  }
+
+  input[type="text"],
+  input[type="password"],
+  input[type="email"],
+  input[type="url"],
+  input[type="date"],
+  input[type="month"],
+  input[type="time"],
+  input[type="datetime"],
+  input[type="datetime-local"],
+  input[type="week"],
+  input[type="number"],
+  input[type="search"],
+  input[type="tel"],
+  input[type="color"],
+  input[type="file"],
+  textarea,
+  select {
+    margin-bottom: 0;
+  }
+
+  .hint, .error {
+    word-wrap: break-word;
+  }
+}
+
+.pure-form-aligned {
+  label {
+    font-size: 14px;
+    text-transform: uppercase;
+  }
+
+  .pure-control-group {
+    @media (min-width: 35.5em) {
+      .input-wrapper {
+        margin-left: $base-font-size * 12;
+      }
+    }
+
+    label:not(.addon-label) {
+      line-height: 2.4em;
+      margin-bottom: 0;
+
+      @media (min-width: 35.5em) {
+        width: $base-font-size * 11;
+      }
+
+      &.checkbox,
+      &.radio {
+        margin: 0 1em 0 0;
+        min-width: $base-font-size;
+        width: auto;
+
+        input {
+          margin: -0.2em 0.5em 0 0;
+          width: auto;
+        }
+      }
+    }
+
+    .checkbox,
+    .radio {
+      label {
+        line-height: 2.4em;
+        padding-left: 1.5em;
+        text-align: left;
+        width: $base-font-size * 11;
+
+        input {
+          margin: -0.2em 0.5em 0 -1.5em;
+          width: auto;
+        }
+      }
+    }
+
+    label.radio + .hint,
+    label.checkbox + .hint {
+      clear: both;
+    }
+  }
+
+  input.file {
+    padding: 0.55em;
+  }
+
+  @mixin pure-form-indented {
+    @media (min-width: 35.5em) {
+      padding-left: $base-font-size * 12;
+    }
+  }
+
+  .pure-controls {
+    padding-top: $base-font-size;
+    padding-bottom: $base-font-size;
+    border-top: 2px solid #e8e8e8;
+
+    @include pure-form-indented;
+
+    .pure-button {
+      margin-right: $base-font-size * 0.25;
+    }
+  }
+
+  .pure-form-indented {
+    @include pure-form-indented;
+  }
+
+  .details-panel-item label {
+    float: none;
+    color: inherit;
+  }
+}
+
+.editor-field {
+  min-height: 400px;
+  font-family: monospace !important;
+  line-height: 1.3em;
+  width: 100%;
+
+  @media (min-width: 80em) {
+    width: 64em;
+  }
+}

data/app/assets/stylesheets/pure_admin/inputs/select.css.scss

@@ -0,0 +1,99 @@
+.select2-container--pure-admin {
+  display: table !important;
+  table-layout: fixed;
+
+  &.select2-container--disabled {
+    background: $grey-light;
+
+    .select2-selection--single {
+      cursor: not-allowed;
+    }
+  }
+
+  .select2-selection {
+    color: inherit;
+    border: 1px solid $input-border;
+    box-shadow: none;
+    border-radius: 0;
+    height: 2.5em !important;
+
+    &:focus {
+      outline: 0;
+      border-color: $input-active;
+    }
+
+    .select2-selection__arrow {
+      height: 2.3em;
+      position: absolute;
+      right: 1px;
+      top: 1px;
+      width: 20px;
+
+      b {
+        border-color: $text-color transparent transparent transparent;
+        border-style: solid;
+        border-width: 5px 4px 0 4px;
+        height: 0;
+        left: 50%;
+        margin-left: -4px;
+        margin-top: -2px;
+        position: absolute;
+        top: 50%;
+        width: 0;
+      }
+    }
+  }
+
+  .select2-selection__rendered {
+    line-height: 2.3em;
+    padding-left: 0.6em;
+  }
+
+  .select2-dropdown {
+    color: inherit;
+    font-size: 14px;
+    border: 1px solid $input-border;
+    border-top: 0;
+    border-radius: 0;
+
+    box-shadow: 0 1px 5px 0 $input-border;
+
+    .select2-search__field {
+      padding: 0.5em 0.6em;
+      &:focus {
+        outline: 0;
+        border: 1px solid $input-active;
+      }
+    }
+
+    .select2-results {
+      .select2-results__options {
+        overflow-y: auto;
+        max-height: 200px;
+      }
+
+      .select2-results__option {
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+
+        &.select2-results__option--highlighted {
+          color: $white;
+          background-color: $input-active;
+        }
+      }
+    }
+  }
+
+  &.select2-container--open {
+    .select2-selection--single {
+      .select2-selection__arrow {
+        height: 2.2em;
+        b {
+          border-color: transparent transparent #555 transparent;
+          border-width: 0 4px 5px 4px;
+        }
+      }
+    }
+  }
+}

data/app/assets/stylesheets/pure_admin/jquery.tagsinput.css.scss

@@ -0,0 +1,67 @@
+div.tagsinput {
+  width: 100%;
+  height: 100px;
+  overflow-y: auto;
+  overflow-x: hidden;
+}
+
+div.tagsinput div {
+display: block;
+float: left;
+width: 100%;
+}
+
+div.tagsinput span.tag {
+  border: 1px solid darken($link-color, 5%);
+  display: block;
+  float: left;
+  padding: 0em 0.5em;
+  text-decoration: none;
+  background: lighten($link-color, 10%);
+  color: $link-color;
+  margin-right: 5px;
+  margin-bottom: 5px;
+  font-family: helvetica;
+  font-size: 13px;
+}
+
+div.tagsinput span.tag a {
+  font-weight: bold;
+  text-decoration: none;
+  font-size: 14px;
+  position: relative;
+  top: 0px;
+}
+
+div.tagsinput input {
+  width: 100% !important;
+  margin: 0px;
+  font-family: helvetica;
+  font-size: 13px;
+  border: 1px solid #cccccc !important;
+  border-radius: 0 !important;
+  box-shadow: none !important;
+  padding: 0.7em !important;
+  background: transparent;
+  color: #000;
+  outline: 0px;
+  margin-right: 5px;
+  margin-bottom: 5px;
+  display: block;
+}
+
+div.tagsinput div {
+  display:block;
+  float: left;
+}
+
+.tags_clear {
+  clear: both;
+  width: 100%;
+  height: 0px;
+}
+
+.not_valid {
+  background: #FBD8DB !important;
+  color: #90111A !important;
+}

data/app/assets/stylesheets/pure_admin/main_menu.css.scss

@@ -0,0 +1,146 @@
+#main-menu, #sub-menu {
+  width: 100%;
+  padding: 0;
+  overflow: hidden;
+  font-size: 14px;
+  position: relative;
+
+  nav {
+    padding: 0;
+    height: 100px;
+  }
+
+  ul.pure-menu-list {
+    max-height: 40px;
+
+    @media (min-width: 48em) {
+      max-height: 32px;
+    }
+  }
+
+  .pure-menu-link {
+    color: #ffffff;
+    padding: 0.85em 1em;
+    cursor: pointer;
+
+    @media (min-width: 48em) {
+      padding: 0.55em 1em;
+    }
+
+    .fa {
+      margin-right: 0.2em;
+    }
+  }
+
+  .fade-left, .fade-right {
+    position: absolute;
+    top: 0;
+    width: 64px;
+    height: 40px;
+    color: #ffffff;
+    font-size: 1.5em;
+    line-height: 1.9em;
+    pointer-events: none;
+    display: none;
+
+    @media (min-width: 35.5em) {
+      pointer-events: auto;
+    }
+
+    @media (min-width: 48em) {
+      height: 32px;
+      line-height: 1.5em;
+    }
+
+    .fa {
+      cursor: pointer;
+      padding: 0.25em;
+    }
+  }
+
+  .fade-left {
+    left: 0;
+    text-align: left;
+    background: image-url('menu-fade-left.png');
+
+    .fa {
+      padding-left: 0.5em;
+    }
+  }
+
+  .fade-right {
+    right: 0;
+    text-align: right;
+    background: image-url('menu-fade-right.png');
+
+    .fa {
+      padding-right: 0.5em;
+    }
+  }
+}
+
+#main-menu {
+  border-top: 2px solid darken($menu-color, 20%);
+  background: $menu-color;
+  max-height: 42px;
+
+  @media (min-width: 48em) {
+    max-height: 34px;
+  }
+
+  .sub-menu {
+    display: none !important;
+  }
+
+  li.pure-menu-item {
+    &.current, &.menu-active {
+      .pure-menu-link {
+        background: darken($menu-color, 7.5%);
+      }
+    }
+  }
+
+  .pure-menu-link {
+    &:active, &:focus, &:hover {
+      background: darken($menu-color, 7.5%);
+    }
+  }
+
+  &.navigating {
+    li.pure-menu-item {
+      &.current:not(.menu-active) {
+        .pure-menu-link:not(:hover) {
+          background: none;
+        }
+      }
+    }
+  }
+}
+
+#sub-menu {
+  background: darken($menu-color, 7.5%);
+  border-top: 1px solid darken($menu-color, 12.5%);
+  max-height: 41px;
+
+  @media (min-width: 48em) {
+    max-height: 33px;
+  }
+
+  li.pure-menu-item {
+    &.current {
+      .pure-menu-link {
+        background: darken($menu-color, 12.5%);
+      }
+    }
+  }
+
+  .pure-menu-link {
+    &:active, &:focus, &:hover {
+      background: darken($menu-color, 12.5%);
+    }
+  }
+}
+
+#main-menu-container:hover #sub-menu {
+  display: block;
+}

data/app/assets/stylesheets/pure_admin/modals.css.scss

@@ -0,0 +1,122 @@
+body {
+  &.no-scroll {
+    overflow: hidden;
+  }
+}
+
+.modal-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 1000;
+  width: 100%;
+  height: 100%;
+}
+
+.modal-background {
+  position: absolute;
+  top: 0;
+  left: 0;
+  background: rgba(0, 0, 0, 0.5);
+  width: 100%;
+  height: 100%;
+}
+
+.modal-loading {
+  background: image-url('pending.gif');
+  background-size: 96px 48px;
+  background-position: 50% 50%;
+  background-repeat: no-repeat;
+  top: 146px;
+  width: 100%;
+  height: 48px;
+  position: absolute;
+  top: 130px;
+  opacity: 0;
+  -webkit-transition: all 0.2s linear;
+     -moz-transition: all 0.2s linear;
+      -ms-transition: all 0.2s linear;
+       -o-transition: all 0.2s linear;
+          transition: all 0.2s linear;
+}
+
+.modal {
+  background: #ffffff;
+  border: 4px solid #cccccc;
+  width: 90%;
+  max-width: 480px;
+  max-height: 94%;
+  margin: 0 auto;
+  position: relative;
+  top: 16px;
+  overflow: hidden;
+  -webkit-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.3);
+     -moz-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.3);
+          box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.3);
+
+  @media (min-width: 35.5em) {
+    top: 75px;
+    width: 480px;
+    max-width: none;
+  }
+
+  > span.fa-question-circle,
+  > span.fa-info-circle,
+  > span.fa-exclamation-circle {
+    color: #f4f4f4;
+    position: absolute;
+    bottom: -0.2em;
+    left: -0.2em;
+    font-size: 12em;
+  }
+}
+
+.modal-body {
+  z-index: 1001;
+  position: relative;
+  margin: 0 1em;
+}
+
+.modal-controls {
+  padding: 1em;
+  padding-top: 0;
+  z-index: 1001;
+  position: relative;
+  text-align: right;
+
+  .pure-button {
+    margin-left: 0.5em;
+    min-width: 70px;
+  }
+}
+
+.modal.confirm, .modal.alert {
+  top: 130px;
+
+  @media (min-width: 48em) {
+    width: 480px;
+  }
+
+  .modal-body {
+    margin: 1.5em 1em;
+  }
+}
+
+.modal.ajax, .modal.html {
+  @media (min-width: 48em) {
+    top: 130px;
+    width: 35.5em;
+  }
+
+  @media (min-width: 64em) {
+    width: 48em;
+  }
+
+  @media (min-width: 80em) {
+    min-width: 64em;
+  }
+}
+
+.modal.ajax {
+  display: none;
+}