formadmin 0.1.3 → 0.1.4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: b3ef27da30f048eb8ec2b6f60deff3dc938e0911
-  data.tar.gz: 1be4fb5ed07d84e517fc615ba8873b0dce244c49
+  metadata.gz: 4ef95239b812b1131999e6e5e2b7079ab3ef71d1
+  data.tar.gz: cd52ebc83f4d8c20f984595df2dc6eb0cec06c3a
 SHA512:
-  metadata.gz: cacd1bc0cdd7bbbbdba30b5a57d10ba9f721f4199e9d1141d7a432d4c3f42f6b0081a132674e237525e2ee9f008d5b0c95c035adf172d67c02865663d515865b
-  data.tar.gz: 7622071f6f3a82cce8721bad56bd0d647ead9fa3efaaae6dfd721bf580dd0650b43f5f43a16ab04e7860901c21827f5891045032b69b347c1f6ee2b3e0cb136e
+  metadata.gz: 09e2c7d7eb8e99d1cce418f0ac8a34ef4e3bc6dea1c629869e3a7f55c8d64ea18a387bdb20b2afad0947ead392bdf6f2be35018370ae6d3e9374be5e2d16778d
+  data.tar.gz: 0cd568a59890ebfa169f680bdd8368f18feea9cc8161e0be03a9ba99244f403059f379c565d74b460c89fef274f63f236699fbf8ed9e94f37e01d82bcbda40ed

data/README.md

@@ -1,23 +1,20 @@
 # Formadmin
 
-Modern theme for Active Admin used by Formaweb.
+Modern and responsive theme for Active Admin used by Formaweb.
 
 ## Installation
 
 1. Please make sure that you are using Active Admin from their Github repo:
-
 ```
 gem 'activeadmin', github: 'activeadmin/activeadmin'
 ```
 
 2. Add this gem in your `Gemfile`:
-
 ```
 gem 'formadmin'
 ```
 
 3. So, bundle...
-
 ```
 $ bundle install
 ```

data/app/assets/stylesheets/formadmin/atoms/_header.scss

@@ -4,4 +4,8 @@
   box-shadow: inset 0 1px 0 $white;
   border-bottom: 1px solid $silver;
   padding: 12px 15px;
+
+  @media #{$phone-screen} {
+    text-align: center;
+  }
 }

data/app/assets/stylesheets/formadmin/atoms/_menu-button.scss

@@ -0,0 +1,57 @@
+.menu-button {
+  background: none !important;
+  border: 0 !important;
+  box-shadow: none !important;
+  color: $white;
+  cursor: pointer;
+  display: block;
+  outline: none;
+  padding: 0;
+
+  i {
+    display: inline-block;
+    width: 100%;
+
+    &,
+    &:before,
+    &:after {
+      background-color: currentColor;
+      border-radius: $circular-radius;
+      height: 4px;
+      left: 0;
+      position: relative;
+      transition: all 250ms;
+      width: 20px;
+    }
+
+    &:before,
+    &:after {
+      content: '';
+      position: absolute;
+    }
+
+    &:before {
+      top: -8px;
+    }
+
+    &:after {
+      bottom: -8px;
+    }
+  }
+
+  @at-root .opened-menu & {
+    i {
+      background-color: transparent;
+
+      &:before {
+        top: 0;
+        transform: rotateZ(45deg);
+      }
+
+      &:after {
+        bottom: 0;
+        transform: rotateZ(-45deg);
+      }
+    }
+  }
+}

data/app/assets/stylesheets/formadmin/components/_blank.scss

@@ -16,4 +16,12 @@
     display: block;
     line-height: 1.5;
   }
+
+  // Medias
+  @media #{$phone-screen} {
+    .blank_slate {
+      margin: 40px 0;
+      padding: 15px;
+    }
+  }
 }

data/app/assets/stylesheets/formadmin/components/_form.scss

@@ -204,6 +204,10 @@ form {
     }
   }
 
+  .hidden {
+    display: none;
+  }
+
   // Utils
   .inline-hints,
   .inline-errors {
@@ -242,6 +246,42 @@ form {
       }
     }
   }
+
+  // Medias
+  @media #{$phone-screen} {
+    ol > li label,
+    input[type='text'],
+    input[type='password'],
+    input[type='email'],
+    input[type='number'],
+    input[type='url'],
+    input[type='tel'],
+    input[type='date'],
+    textarea {
+      display: block;
+      float: none;
+      width: 100%;
+    }
+
+    ol > li label {
+      margin-bottom: 5px;
+    }
+
+    select,
+    input[type='file'],
+    .date_select fieldset ol,
+    .time_select fieldset ol,
+    .datetime_select fieldset ol,
+    .inline-hints,
+    .inline-errors {
+      margin-left: 0;
+      width: 100%;
+    }
+
+    .boolean label {
+      padding-left: 0;
+    }
+  }
 }
 
 // Sidebar
@@ -283,8 +323,13 @@ form.filter_form {
     &.select_and_search {
       select,
       input[type='text'] {
+        float: left;
         width: calc(50% - 5px);
       }
+
+      input[type='text'] {
+        float: right;
+      }
     }
 
     &.filter_date_range {

data/app/assets/stylesheets/formadmin/components/_pagination.scss

@@ -74,3 +74,16 @@
     color: $white;
   }
 }
+
+// Medias
+@media #{$largest-phone-screen} {
+  .pagination,
+  .pagination_information,
+  .pagination_per_page,
+  .download_links {
+    display: block;
+    float: none;
+    text-align: center;
+    width: 100%;
+  }
+}

data/app/assets/stylesheets/formadmin/components/_table.scss

@@ -130,17 +130,41 @@ table.index_table {
     background-image: asset-url('formadmin/view.svg');
   }
 
-  // .view_link {
-  //   background-position: -16px 0;
-  // }
-  //
-  // .edit_link {
-  //   background-position: -32px 0;
-  // }
-  //
-  // .delete_link {
-  //   background-position: -48px 0;
-  // }
+  // Medias
+  @media #{$phone-and-tablet-screen} {
+    overflow: hidden;
+
+    &,
+    tr,
+    th,
+    td,
+    thead,
+    tbody {
+      display: block;
+      text-align: left !important;
+      width: 100% !important;
+    }
+
+    tr {
+      padding: 20px;
+    }
+
+    th,
+    td {
+      background: transparent !important;
+      border: 0 !important;
+      border-radius: 0 !important;
+      padding: 5px 0 !important;
+
+      &:empty {
+        display: none;
+      }
+    }
+
+    tbody tr {
+      border-top: 1px solid $silver;
+    }
+  }
 }
 
 // Resource Attributes Table
@@ -173,8 +197,24 @@ table.index_table {
     opacity: 0.5;
     text-transform: uppercase;
   }
-}
 
-.attributes_table table {
+  // Medias
+  @media #{$phone-screen} {
+    th,
+    td {
+      display: block;
+      padding: 0 0 5px;
+      width: 100%;
+    }
+
+    tr + tr {
+      th {
+        padding: 20px 0 5px;
+      }
 
+      td {
+        border-top: 0;
+      }
+    }
+  }
 }

data/app/assets/stylesheets/formadmin/components/_tools.scss

@@ -65,4 +65,27 @@
       border-left: 1px solid $silver;
     }
   }
+
+  // Media
+  @media #{$phone-screen} {
+    margin-bottom: 20px;
+    text-align: center;
+
+    .batch_actions_selector,
+    .scopes {
+      float: none;
+      margin: 0 0 20px;
+    }
+
+    .scopes,
+    .scope {
+      float: none !important;
+      width: 100% !important;
+    }
+
+    .scope + .scope {
+      border-top: 1px solid $silver;
+      border-left: 0;
+    }
+  }
 }

data/app/assets/stylesheets/formadmin/layouts/_header.scss

@@ -1,7 +1,8 @@
-.header {
+#header.header {
+  align-items: center;
   background-color: rgba($primary-color, 0.95);
   backdrop-filter: blur(3px);
-  display: table;
+  display: flex;
   color: $white;
   height: 50px;
   position: fixed;
@@ -12,11 +13,9 @@
   z-index: 10;
 
   .site_title {
-    display: table-cell;
     font-weight: bold;
     margin: 0 20px 0 0;
     padding: 0 30px;
-    vertical-align: middle;
   }
 
   #site_title_image {
@@ -25,9 +24,6 @@
   }
 
   .header-item {
-    display: table-cell;
-    vertical-align: middle;
-
     &,
     ul {
       margin: 0;
@@ -145,12 +141,12 @@
 
   #utility_nav {
     color: $silver;
-    display: table-cell;
     margin: 0;
     padding: 0 20px 0 0;
     text-align: right;
     transition: color 250ms;
     white-space: nowrap;
+    width: 100%;
 
     a {
       text-decoration: none;
@@ -162,6 +158,103 @@
 
     li {
       display: inline;
+
+      &:not(#current_user) {
+        opacity: 0.75;
+        transition: opacity 250ms;
+
+        &:hover {
+          opacity: 1;
+        }
+      }
+    }
+  }
+
+  .menu-button {
+    display: none;
+  }
+
+  // Medias
+  @media #{$largest-phone-screen} {
+    #tabs,
+    #utility_nav {
+      left: 0;
+      opacity: 0;
+      position: fixed;
+      right: 0;
+      transform: translateY(calc(-100% - 90px));
+      transition: transform 250ms;
+    }
+
+    #utility_nav {
+      background-color: $primary-color;
+      height: 40px;
+      padding: 11px 0;
+      text-align: center;
+      top: 50px;
+    }
+
+    #tabs {
+      background-color: rgba($primary-color, 0.95);
+      top: 90px;
+
+      li {
+        display: block;
+        float: none;
+        margin: 0;
+        padding: 5px 15px;
+        width: 100%;
+
+        + li {
+          border-top: 1px solid rgba($white, 0.1);
+        }
+      }
+
+      a {
+        display: block;
+      }
+    }
+
+    .site_title {
+      padding: 0 15px;
+    }
+
+    .header-item ul {
+      background: transparent;
+      height: auto;
+      max-width: 100%;
+      opacity: 1;
+      margin-left: 5px;
+      position: static;
+      transform: scale(1);
+      width: 100%;
+
+      li {
+        border: 0 !important;
+        padding: 0 !important;
+
+        a:before {
+          display: inline;
+          content: '↳';
+          margin-right: 5px;
+        }
+      }
+    }
+
+    .menu-button {
+      display: block;
+      margin-left: auto;
+      margin-right: 15px;
+      margin-top: -5px;
+    }
+
+    @at-root .opened-menu & {
+      #tabs,
+      #utility_nav {
+        display: block;
+        opacity: 1;
+        transform: translateY(0);
+      }
     }
   }
 }

data/app/assets/stylesheets/formadmin/layouts/_main.scss

@@ -7,6 +7,8 @@
   #main_content_wrapper {
     float: left;
     width: 100%;
+
+    @include clearfix;
   }
 
   // Sidebar Stuffs
@@ -27,4 +29,24 @@
       }
     }
   }
+
+  // Medias
+  @media #{$largest-phone-screen} {
+    padding: 15px 15px 0;
+
+    &.with_sidebar #main_content {
+      margin-right: 0;
+    }
+
+    #main_content_wrapper {
+      float: none;
+    }
+
+    #sidebar {
+      float: none;
+      margin-left: 0;
+      margin-top: 40px;
+      width: 100%;
+    }
+  }
 }

data/app/assets/stylesheets/formadmin/layouts/_title-bar.scss

@@ -63,4 +63,25 @@
       opacity: 0.5;
     }
   }
+
+  // Medias
+  @media #{$phone-and-tablet-screen} {
+    #page_title {
+      word-break: keep-all;
+    }
+
+    #titlebar_left,
+    #titlebar_right {
+      display: block;
+      text-align: center;
+    }
+
+    #titlebar_right {
+      margin-top: 10px;
+    }
+
+    .action_item a {
+      margin: 2px 0;
+    }
+  }
 }

data/app/assets/stylesheets/formadmin/pages/_logged-out.scss

@@ -8,7 +8,8 @@ body.logged_out {
   #content_wrapper {
     margin: 70px auto;
     padding: 0;
-    width: 500px;
+    max-width: 500px;
+    width: 100%;
   }
 
   h2 {
@@ -42,4 +43,16 @@ body.logged_out {
     border-width: 1px;
     margin-bottom: 20px;
   }
+
+  // Medias
+  @media #{$largest-phone-screen} {
+    #wrapper {
+      padding: 15px;
+    }
+
+    #content_wrapper {
+      margin: 0 auto;
+      max-width: 450px;
+    }
+  }
 }

data/lib/formadmin/active_admin/application.rb

@@ -0,0 +1,6 @@
+module ActiveAdmin
+  responsive_viewport = { viewport: 'width=device-width, initial-scale=1' }
+
+  ActiveAdmin.application.meta_tags.merge! responsive_viewport
+  ActiveAdmin.application.meta_tags_for_logged_out_pages.merge! responsive_viewport
+end

data/lib/formadmin/active_admin/views/header.rb

@@ -0,0 +1,16 @@
+module ActiveAdmin
+  module Views
+    class Header < Component
+      alias_method :_build, :build
+
+      def build namespace, menu
+        _build namespace, menu
+        build_responsive_menu
+      end
+
+      def build_responsive_menu
+        button '<i></i>'.html_safe, type: 'button', class: 'menu-button', onclick: 'document.body.classList.toggle("opened-menu")'
+      end
+    end
+  end
+end

data/lib/formadmin/engine.rb

@@ -0,0 +1,6 @@
+module Formadmin
+  module Rails
+    class Engine < ::Rails::Engine
+    end
+  end
+end

data/lib/formadmin/version.rb

@@ -1,3 +1,3 @@
 module Formadmin
-  VERSION = '0.1.3'
+  VERSION = '0.1.4'
 end

data/lib/formadmin.rb

@@ -1,8 +1,4 @@
 require 'formadmin/version'
-
-module Formadmin
-  module Rails
-    class Engine < ::Rails::Engine
-    end
-  end
-end
+require 'formadmin/engine'
+require 'formadmin/active_admin/application'
+require 'formadmin/active_admin/views/header'

metadata

@@ -1,43 +1,29 @@
 --- !ruby/object:Gem::Specification
 name: formadmin
 version: !ruby/object:Gem::Version
-  version: 0.1.3
+  version: 0.1.4
 platform: ruby
 authors:
 - Caio Tarifa
 autorequire: 
-bindir: exe
+bindir: bin
 cert_chain: []
-date: 2016-09-27 00:00:00.000000000 Z
+date: 2016-10-18 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
-  name: bundler
+  name: activeadmin
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
       - !ruby/object:Gem::Version
-        version: '1.10'
-  type: :development
+        version: '0'
+  type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
       - !ruby/object:Gem::Version
-        version: '1.10'
-- !ruby/object:Gem::Dependency
-  name: rake
-  requirement: !ruby/object:Gem::Requirement
-    requirements:
-    - - "~>"
-      - !ruby/object:Gem::Version
-        version: '10.0'
-  type: :development
-  prerelease: false
-  version_requirements: !ruby/object:Gem::Requirement
-    requirements:
-    - - "~>"
-      - !ruby/object:Gem::Version
-        version: '10.0'
+        version: '0'
 description: Modern theme for Active Admin used by Formaweb.
 email:
 - caio@formaweb.com.br
@@ -45,9 +31,6 @@ executables: []
 extensions: []
 extra_rdoc_files: []
 files:
-- ".gitignore"
-- Gemfile
-- LICENSE.txt
 - README.md
 - Rakefile
 - app/assets/images/formadmin/edit.svg
@@ -59,6 +42,7 @@ files:
 - app/assets/stylesheets/formadmin/atoms/_drag.scss
 - app/assets/stylesheets/formadmin/atoms/_header.scss
 - app/assets/stylesheets/formadmin/atoms/_input.scss
+- app/assets/stylesheets/formadmin/atoms/_menu-button.scss
 - app/assets/stylesheets/formadmin/atoms/_turbolinks.scss
 - app/assets/stylesheets/formadmin/components/_blank.scss
 - app/assets/stylesheets/formadmin/components/_button.scss
@@ -87,10 +71,10 @@ files:
 - app/assets/stylesheets/formadmin/layouts/_main.scss
 - app/assets/stylesheets/formadmin/layouts/_title-bar.scss
 - app/assets/stylesheets/formadmin/pages/_logged-out.scss
-- bin/console
-- bin/setup
-- formadmin.gemspec
 - lib/formadmin.rb
+- lib/formadmin/active_admin/application.rb
+- lib/formadmin/active_admin/views/header.rb
+- lib/formadmin/engine.rb
 - lib/formadmin/version.rb
 homepage: http://github.com/formaweb/formadmin
 licenses:
@@ -112,7 +96,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubyforge_project: 
-rubygems_version: 2.5.1
+rubygems_version: 2.6.4
 signing_key: 
 specification_version: 4
 summary: Modern theme for Active Admin used by Formaweb.

data/.gitignore

@@ -1,45 +0,0 @@
-################
-#   Defaults   #
-################
-/.bundle/
-/.yardoc
-/Gemfile.lock
-/_yardoc/
-/coverage/
-/doc/
-/pkg/
-/spec/reports/
-/tmp/
-
-####################
-#   OS & Editors   #
-####################
-._*
-.cache
-.DS_Store
-.idea
-.project
-.settings
-.tmproj
-*.esproj
-*.sublime-project
-*.sublime-workspace
-nbproject
-Thumbs.db
-
-
-
-##############
-#   Others   #
-##############
-*.diff
-*.err
-*.log
-*.orig
-*.rej
-*.sass-cache
-*.swo
-*.swp
-*.vi
-*.zip
-*~

data/Gemfile

@@ -1,2 +0,0 @@
-source 'https://rubygems.org'
-gemspec

data/LICENSE.txt

@@ -1,21 +0,0 @@
-The MIT License (MIT)
-
-Copyright (c) 2016 Caio Tarifa
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in
-all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-THE SOFTWARE.

data/bin/console

@@ -1,14 +0,0 @@
-#!/usr/bin/env ruby
-
-require "bundler/setup"
-require "formadmin"
-
-# You can add fixtures and/or initialization code here to make experimenting
-# with your gem easier. You can also use a different console, if you like.
-
-# (If you use this, don't forget to add pry to your Gemfile!)
-# require "pry"
-# Pry.start
-
-require "irb"
-IRB.start

data/bin/setup

@@ -1,7 +0,0 @@
-#!/bin/bash
-set -euo pipefail
-IFS=$'\n\t'
-
-bundle install
-
-# Do any other automated setup that you need to do here

data/formadmin.gemspec

@@ -1,24 +0,0 @@
-# coding: utf-8
-lib = File.expand_path('../lib', __FILE__)
-$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
-require 'formadmin/version'
-
-Gem::Specification.new do |spec|
-  spec.name          = 'formadmin'
-  spec.version       = Formadmin::VERSION
-  spec.authors       = ['Caio Tarifa']
-  spec.email         = ['caio@formaweb.com.br']
-
-  spec.summary       = 'Modern theme for Active Admin used by Formaweb.'
-  spec.description   = 'Modern theme for Active Admin used by Formaweb.'
-  spec.homepage      = 'http://github.com/formaweb/formadmin'
-  spec.license       = 'MIT'
-
-  spec.files         = `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
-  spec.bindir        = "exe"
-  spec.executables   = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
-  spec.require_paths = ['lib']
-
-  spec.add_development_dependency "bundler", "~> 1.10"
-  spec.add_development_dependency "rake", "~> 10.0"
-end