groundworkcss 0.4.4 → 2.0.0

data/app/assets/stylesheets/groundworkcss/nav/_navigation.scss

@@ -1,409 +0,0 @@
-// =============================================
-//                 Navigation
-//          Last Updated:2013-6-25
-// =============================================
-
-
-
-
-%menu-closed {
-  display:none;
-}
-%menu-open {
-  display:block;
-  @include filter-shadow(rgba(0,0,0,0.25), 5px, 0, 0);
-}
-
-%nav {
-  @extend %clear;
-  &:not(.inline):not(.pagination) {
-    > ul:not(.row) {
-      display:inline-block;
-    }
-  } 
-  ul {
-    display:block;
-    list-style:none;
-    margin:0;
-    padding:0;
-    li {
-      display:block;
-      position:relative;
-      a, a:visited {
-        display:block;
-        width:100%;
-        word-wrap:break-word;
-        padding:0.25em 1em;
-        background:$button-color;
-        border-top:1px solid $button-active;
-        color:$button-text;
-        font-weight:bold;
-        font-size:1em;
-        text-decoration:none;
-        cursor:pointer;
-        line-height:1.5;
-        @include transition(background-color 0.25s ease-out);
-        &:hover, &:focus {
-          background:$button-active;
-          color:$button-text;
-          text-decoration:none;
-        }
-        &.active {
-          &:hover, &:focus {
-            background:$button-active;
-          }
-        }
-        &.disabled {
-          @include state(disabled,normal,desaturate($button-color,20%));
-        }
-      }
-      &:first-child {
-        a {
-          border-top:none;
-        }
-      }
-      &.menu {
-        &.disabled {
-          > a, > a:visited {
-            @include state(disabled,normal,desaturate($button-color,20%));
-          }
-        }
-        > a {
-          &:after {
-            content:'\f0d7';
-            display:inline-block;
-            width:1.1em;
-            margin-left:0.25em;
-            @include icon-FontAwesome();
-            font-size:1.1em;
-            line-height:normal;
-            vertical-align:baseline;
-            background-image:none;
-            background-position:0% 0%;
-            background-repeat:repeat;
-            margin-top:0;
-          }
-        }
-        &.on {
-          > a, > a:visited {
-            background:$button-active;
-            text-decoration:none;
-          }
-          > ul {
-            @extend %menu-open;
-          }
-        }
-      }
-      &:first-child {
-        a {
-          @include rounded($default-radius $default-radius 0 0);
-        }
-      }
-      &:last-child {
-        a {
-          @include rounded(0 0 $default-radius $default-radius);
-        }
-        ul {
-          li {
-            a {
-              @include rounded(0 0 0 0 !important);
-            }
-            &:last-child {
-              a {
-                @include rounded(0 0 $default-radius $default-radius !important);
-              }
-            }
-          }
-        }
-      }
-      &:only-child {
-        a {
-          @include rounded($default-radius);
-        }
-      }
-    }
-    ul {
-      @extend %menu-closed;
-      position:absolute;
-      left:100%;
-      top:0;
-      width:auto;
-      z-index:101;
-      li {
-        a, a:visited {
-          @include rounded(0);
-          border:none;
-          border-top:1px solid $button-color;
-          background:lighten($button-color, 5%);
-          &:hover {
-            background:lighten($button-active, 5%);
-          }
-          &.disabled {
-            @include state(disabled,normal,desaturate(lighten($button-color, 5%),20%));
-          }
-        }
-        &:first-child {
-          a {
-            border-top:none;
-            @include rounded(0 $default-radius 0 0);
-          }
-        }
-        &:last-child {
-          a {
-            @include rounded(0 0 $default-radius $default-radius);
-          }
-        }
-        &:only-child {
-          a {
-            @include rounded(0 $default-radius $default-radius 0);
-          }
-        }
-      }
-    }
-    // horizontal grid navigation
-    &.row {
-      li {
-        a  {
-          border-left:1px solid $button-active;
-          border-top:none;
-          @include rounded(0);
-        }
-        &:first-child {
-          a {
-            border-left:none;
-            @include rounded($default-radius 0 0 $default-radius);
-          }
-        }
-        &:last-child {
-          a {
-            @include rounded(0 $default-radius $default-radius 0);
-          }
-        }
-        &:only-child {
-          a {
-            @include rounded($default-radius);
-          }
-        }
-      }
-      ul {
-        @extend %menu-closed;
-        position:absolute;
-        left:auto;
-        top:auto;
-        min-width:100%;
-        z-index:101;
-        li {
-          a {
-            @include rounded(0);
-            border-left:none;
-            border-top:1px solid $button-active;
-          }
-          &:first-child {
-            a {
-              @include rounded(0);
-            }
-          }
-          &:last-child {
-            a {
-              @include rounded(0 0 $default-radius $default-radius);
-            }
-          }
-        }
-      }
-    }
-  }
-  // horizontal inline navigation
-  &.inline {
-    width:auto;
-    ul {
-      font-size:0;
-      li {
-        font-size:$base-font-size;
-        display:inline-block;
-        white-space-collapse:discard;
-        float:none;
-        a {
-          border-left:1px solid $button-active;
-          border-top:none;
-        }
-        &:first-child {
-          a {
-            border-left:none;
-            @include rounded($default-radius 0 0 $default-radius);
-          }
-        }
-        &:last-child {
-          a {
-            @include rounded(0 $default-radius $default-radius 0);
-          }
-        }
-        &:only-child {
-          a {
-            @include rounded($default-radius);
-          }
-        }
-        ul {
-          @extend %menu-closed;
-          // display:none;
-          position:absolute;
-          left:auto;
-          top:auto;
-          min-width:100%;
-          z-index:101;
-          li {
-            display:block;
-            a {
-              @include rounded(0);
-              border-left:none;
-              border-top:1px solid $button-active;
-            }
-            &:first-child {
-              a {
-                @include rounded(0);
-              }
-            }
-            &:last-child {
-              a {
-                @include rounded(0 0 $default-radius $default-radius);
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-  // hamburger menu
-  &.menu {
-    .menu-toggle {
-      @extend %button;
-      display:none;
-    }
-  }
-}
-// pagination
-%pagination {
-  ul {
-    margin:10px auto;
-    display:block;
-    list-style-type:none;
-    li {
-      display:inline-block;
-      @include rounded($default-radius);
-      padding:0 3px 0 2px;
-      min-width:29px;
-      a, a:visited {
-        display:inline-block;
-        width:100%;
-        background:$button-color;
-        font-size:1em;
-        line-height:1.5;
-        font-weight:bold;
-        color:$button-text;
-        text-decoration:none;
-        text-align:center;
-        padding:0 3px;
-        @include rounded($default-radius);
-        &:hover, &:focus {
-          background:$button-active;
-          color:$button-text;
-        }
-        &.disabled {
-          @include state(disabled,normal,desaturate($button-color,20%));
-        }
-      }
-      &.active {
-        a {
-          @include state(disabled,normal,desaturate($button-color,20%));
-        }
-      }
-      &.prev, &.next {
-        a, a:visited {
-          padding:0 4px;
-          background:$button-color;
-          color:#fff;
-          &:hover, &:focus {
-            background:$button-active;
-          }
-        }
-      }
-      &.disabled {
-        a {
-          @include state(disabled,normal,desaturate($button-color,20%));
-        }
-      }
-      &:first-child {
-        a {
-          @include rounded($default-radius);
-        }
-      }
-      &:last-child {
-        a {
-          @include rounded($default-radius);
-        }
-      }
-    }
-  }
-}
-.no-js {
-  %nav {
-    ul {
-      li.menu {
-        ul {
-          @extend %menu-open;
-          display:none;
-        }
-        &:hover, &:focus {
-          ul {
-            display:block !important;
-          }
-        }
-      }
-    }
-  }
-}
-%breadcrumbs {
-  list-style:none;
-  margin:0;
-  padding:0;
-  font-size:0.8em;
-  li {
-    display:inline-block;
-    padding:0.2em 0;
-    a, a:visited {
-      border:none;
-      color:gray;
-      &:before {
-        content:'>';
-        display:inline-block;
-        margin:0 0.5em;
-        color:gray !important;
-      }
-      &:hover, &:focus {
-        color:$link-color;
-      }
-    }
-    &:first-child a {
-      &:before {
-        display:none;
-      }
-    }
-  }
-}
-
-@if $nav-tags {
-  nav {
-    @extend %nav;
-  }
-}
-
-@if $nav-classes {
-  .nav {
-    @extend %nav;
-  }
-  .pagination {
-    @extend %pagination;
-  }
-  .breadcrumbs {
-    @extend %breadcrumbs;
-  }
-}

data/app/assets/stylesheets/groundworkcss/nav/_tabs.scss

@@ -1,232 +0,0 @@
-// =============================================
-//                   Tabs
-//          Last Updated:2013-6-25
-// =============================================
-
-
-
-
-%tabs {
-  position:relative;
-}
-%tablist {
-  display:block;
-  width:100%;
-  margin:0;
-  padding:0;
-  list-style:none;
-  &:after {
-    content:'';
-    display:block;
-    clear:both;
-  }
-}
-%tab {
-  display:block;
-  float:left;
-  margin:0 2px;
-  &.pull-right  { float:right; }
-  &.pull-left   { float:left; }
-  &:first-child {
-    margin-left:0;
-    a, a:visited {
-      &:before {
-        display:none;
-      }
-    }
-  }
-}
-%tab-link {
-  display:block;
-  position:relative;
-  width:100%;
-  word-wrap:break-word;
-  padding:0.25em 1em;
-  background:$button-color;
-  border:1px solid $button-color;
-  color:$button-text;
-  font-weight:bold;
-  font-size:1em;
-  text-decoration:none;
-  text-align:center;
-  cursor:pointer;
-  line-height:1.5;
-  height:2em;
-  @include transition(background-color 0.25s ease-out);
-  @include rounded($default-radius $default-radius 0 0);
-  &:hover, &:focus {
-    background:$button-active;
-    border:1px solid $button-active;
-    color:$button-text;
-    text-decoration:none;
-    &:before {
-      box-shadow:2px 1px 0 $button-active;
-    }
-    &:after {
-      box-shadow:-2px 1px 0 $button-active;
-    }
-  }
-  &.active, &.active:hover, &.active:focus {
-    background:$button-active;
-    border:1px solid $button-active;
-    color:$button-text;
-    z-index:2;
-    &:before {
-      box-shadow:2px 1px 0 $button-active;
-    }
-    &:after {
-      box-shadow:-2px 1px 0 $button-active;
-    }
-  }
-  &.disabled {
-    @include state(disabled,normal,desaturate($button-color,20%));
-    border-bottom-color:lighten(desaturate($button-color,20%), 15%) !important;
-    &:before {
-      box-shadow:2px 1px 0 lighten(desaturate($button-color,20%), 15%);
-    }
-    &:after {
-      box-shadow:-2px 1px 0 lighten(desaturate($button-color,20%), 15%);
-    }
-  }
-  &:before, &:after {
-    position:absolute;
-    bottom:-1px;
-    width:6px;
-    height:6px;
-    content:'';
-  }
-  &:before {
-    left:-6px;
-    border-bottom-right-radius:6px;
-    border-width:0 1px 1px 0;
-    box-shadow:2px 1px 0 $button-color;
-  }
-  &:after {
-    right:-6px;
-    border-bottom-left-radius:6px;
-    border-width:0 0 1px 1px;
-    box-shadow:-2px 1px 0 $button-color;
-  }
-}
-%tabpanel {
-  display:none;
-  padding:$gutter * 2;
-  background:$background-color;
-  @include rounded(0 0 $default-radius $default-radius);
-  *:first-child {
-    margin-top:0;
-  }
-  *:last-child {
-    margin-bottom:0;
-  }
-  &.active {
-    display:block;
-    border:1px solid $button-active;
-  }
-}
-%vertical-tablist {
-  height:100%;
-  position:absolute;
-  width:20%;
-  background:$button-active;
-  border-bottom:1px solid $button-active;
-  @include rounded($default-radius 0 0 $default-radius);
-}
-%vertical-tabs {
-  float:none;
-  margin:0 -1px 0 0;
-  &:first-child {
-    a  {
-      @include rounded($default-radius 0 0 0);
-    }
-  }
-}
-%vertical-tab-link {
-  height:auto;
-  border-bottom:1px solid $button-active;
-  @include rounded(0);
-  &:before, &:after {
-    display:none !important;
-  }
-  &.active {
-    border-right:none;
-    color:$font-color;
-    background:$background-color;
-    &:hover, &:focus {
-      border-right:none;
-      color:$font-color;
-      background:$background-color;
-    }
-  }
-}
-%vertical-tabpanel {
-  position:relative;
-  left:20%;
-  width:80%;
-  @include rounded(0 $default-radius $default-radius 0);
-}
-
-@if $tab-classes {
-  .tabs {
-    @extend %tabs;
-    
-    > ul, > ol {
-      @extend %tablist;
-      li {
-        @extend %tab;
-        a, a:visited {
-          @extend %tab-link;
-        }
-      }
-    }
-    > div {
-      @extend %tabpanel;
-    }
-    &.vertical {
-      @extend %vertical-tabs;
-      > ul, > ol {
-        @extend %vertical-tablist;
-        li {
-          @extend %vertical-tabs;
-          a, a:visited {
-            @extend %vertical-tab-link;
-          }
-        }
-      }
-      > div {
-        @extend %vertical-tabpanel;
-      }
-
-      @if $aria-selectors {
-        [role~=tablist] {
-          @extend %vertical-tablist;
-          [role~=tab] {
-            @extend %vertical-tabs;
-          }
-        }
-        [role~=tabpanel] {
-          @extend %vertical-tabpanel;
-        }
-      }
-    }
-  }
-}
-
-@if $aria-selectors {
-  [role~=tabpanel] {
-    @extend %tabs;
-    [role~=tablist] {
-      @extend %tablist;
-      background:none;
-      [role~=tab] {
-        @extend %tab;
-        a, a:visited {
-          @extend %tab-link;
-        }
-      }
-    }
-    [role~=tabpanel] {
-      @extend %tabpanel;
-    }
-  }
-}