brevis 0.1.1 → 0.1.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 9c61d7072539a31cf55cd8a5bb433edade82b61f
-  data.tar.gz: d8cabcb2dfbd7a0617ea591871dde2ad91d471b1
+  metadata.gz: 01e696c3f4283406dd94da1df5e43ca718bbdf2d
+  data.tar.gz: 0dc3bbd0da50961eb8537762b09e027b84f37362
 SHA512:
-  metadata.gz: b92098b5030150606d85c133238a50183e8c74320d8db06b46b6a54bfa77c9911cb959a88d9a7006fc0f168275933f0ca92f2adfd7c9fb6546703a018d880f9b
-  data.tar.gz: 81eb76d674e8e5ab55c4ca98a1e8a1d60adb45ee8ac7e39fe285ab838e53999437d07af1fa658830bf4dcef2a28cf1e7f1aabf71ea1549d387e65a8f9dd71002
+  metadata.gz: 7f15f3f566d8889f262396f9a8db0d64b83358aded15d43c23fd3826fa4230430208e1c3827b68df5d8dbbafce6a7fb2996da9e08f874fd7706ddc5449a93b04
+  data.tar.gz: 7ccdaa7d6e91e0416f8ae487576f4760b1ff265472ccdc2cf833216a4a4bc19f40a3572122e0774da234970c20e9d1a99ee9bc095294da04af1fd77169be4ce5

data/lib/brevis.rb

@@ -17,8 +17,8 @@ Compass::Frameworks.register('brevis', :path => extension_path)
 #    a prerelease version
 #  Date is in the form of YYYY-MM-DD
 module Brevis
-  VERSION = "0.1.1"
-  DATE = "2014-11-04"
+  VERSION = "0.1.2"
+  DATE = "2015-01-28"
 end
 
 # This is where any custom SassScript should be placed. The functions will be

data/stylesheets/_brevis.scss

@@ -0,0 +1,35 @@
+@import "compass";
+@import "breakpoint";
+
+@import "brevis_utilities/admin";
+@import "brevis_utilities/animations";
+@import "brevis_utilities/breakpoints";
+@import "brevis_utilities/colors";
+@import "brevis_utilities/eq";
+@import "brevis_utilities/font_awesome.scss";
+@import "brevis_utilities/forms";
+@import "brevis_utilities/header";
+@import "brevis_utilities/images";
+@import "brevis_utilities/layout";
+@import "brevis_utilities/page";
+@import "brevis_utilities/tooltip";
+@import "brevis_utilities/typography";
+@import "brevis_utilities/z-index.scss";
+
+@import "brevis_components/chrome/header/branding";
+@import "brevis_components/chrome/header/mobile_toggle";
+@import "brevis_components/chrome/header/primary_menu";
+@import "brevis_components/chrome/header/search";
+@import "brevis_components/chrome/header/social";
+
+@import "brevis_components/content_lists/content_carousel";
+@import "brevis_components/content_lists/content_stream";
+@import "brevis_components/content_lists/featured";
+@import "brevis_components/content_lists/headlines";
+@import "brevis_components/content_lists/topic_lists";
+
+@import "brevis_components/content_modules/carousel";
+@import "brevis_components/content_modules/chosen";
+@import "brevis_components/content_modules/colorbox";
+@import "brevis_components/content_modules/flexslider";
+@import "brevis_components/content_modules/sticky_menu";

data/stylesheets/brevis_components/chrome/header/_branding.scss

@@ -0,0 +1,34 @@
+@mixin site-logo ($logoname: "logo" $logoname-mobile: "logo-mobile" ) {
+  display: block;
+  overflow: hidden;
+  background: no-repeat 0 0;
+  background-size: cover;
+  margin: 0 0 $logo-bottom-margin 0;
+  font-size: 0;
+  line-height: 1;
+  height: $mobile-logo-h;
+  width: $mobile-logo-w;
+  background-image: inline-image("#{logoname-mobile}.png");
+  @include breakpoint($mobile-hi-res) {
+    background-image: inline-image("#{logoname-mobile}@2x.png");
+  }
+
+  @include breakpoint($desktop) {
+    background-image: inline-image("#{logoname}.png");
+    background-size: contain;
+    height: $logo-h;
+    width: $logo-w;
+  }
+
+  @include breakpoint($desk-hi-res) {
+    background-image: inline-image("#{logoname}@2x.png");
+  }
+
+  @include breakpoint($print-media) {
+    -webkit-print-color-adjust: exact;
+    content: url("../images/logo.png");
+    background-image: none;
+    height: $logo-h;
+    width: $logo-w;
+  }
+}

data/stylesheets/brevis_components/chrome/header/_mobile_toggle.scss

@@ -0,0 +1,27 @@
+@mixin mobile-menu-toggle {
+  text-indent: -100%;
+  width: $navicon-size - 10px;
+  height: $navicon-size;
+  display: block;
+  margin: 5px;
+  padding-left: $navicon-size;
+  &:before {
+  content: "|||";
+  padding: 10px;
+  line-height: 0.7;
+  float: right;
+  font-size: 40px;
+  -webkit-transform: rotate(-90deg);
+  -moz-transform: rotate(-90deg);
+  -ms-transform: rotate(-90deg);
+  -o-transform: rotate(-90deg);
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
+  }
+  .modal-content & {
+    display: none;
+  }
+}
+
+%mobile-menu-toggle {
+  @include mobile-menu-toggle;
+}

data/stylesheets/brevis_components/chrome/header/_primary_menu.scss

@@ -0,0 +1,79 @@
+
+@mixin primary_menu (
+  $primary-menu-height: 40px,
+  $primary-menu-padding-v: 5px,
+  $primary-menu-padding-h: 10px
+  ){
+  @include breakpoint($desktop) {
+    position: relative;
+    width: 100%;
+    min-height: $primary-menu-height;
+    .primary-menu-inner {
+      @include horizontal-list;
+      ul.links {
+        padding: 0;
+        margin: 0 - #{$primary-menu-height}/2;
+        overflow: hidden;
+        height: $primary-menu-height;
+      }
+      // Main menubar:
+      .primary-links {
+        li {
+          margin: 0;
+          padding: 0;
+          text-align: center;
+          display: inline-block;
+        }
+        li a {
+          display: block;
+          padding: $primary-menu-padding-v $primary-menu-padding-h;
+          text-decoration: none;
+        }
+        li.first {
+          margin-left: 0;
+          a {
+            padding-left: $primary-menu-padding-h;
+          }
+        }
+        li.last {
+          margin-right: 0;
+          a {
+            padding-right: $primary-menu-padding-h;
+          }
+        }
+      }
+      // Dropdown menu:
+      li > .menu-minipanel-panel {
+        top: $primary-menu-height;
+      }
+    }
+  }
+
+  @include breakpoint($mobile-device) {
+    background: white;
+    .primary-links {
+      border: 1px solid #dddddd;
+    }
+    ul.links {
+      margin: 0 0 0 #{$primary-menu-height} * 1.5;
+      padding: 0;
+      width: auto;
+      list-style: none;
+      .last {
+        a {
+          border-bottom: 0px solid $text-quaternary;
+        }
+      }
+      a {
+        width: 100%;
+        padding: $primary-menu-padding-v;
+        display: inline-block;
+        border-bottom: 1px solid $text-quaternary;
+      }
+    }
+  }
+}
+
+%primary-menu {
+  @include primary-menu;
+}

data/stylesheets/brevis_components/chrome/header/_search.scss

@@ -0,0 +1,56 @@
+@mixin search {
+  @include breakpoint($print-media) {
+    display: none;
+  }
+
+  &:before {
+    content: " ";
+    width: $header-icon;
+    height: $header-icon;
+    display: block;
+    float: left;
+    background: no-repeat 50%;
+    @include svg-bg-simple("search");
+    @include border-radius(2px);
+    @include breakpoint($mobile-device) {
+      border: 1px solid #999999;
+      content: "D";
+      @include icon-font;
+      font-size: 32px;
+      text-align: center;
+      line-height: 1.35em;
+    }
+
+    @include breakpoint($desktop) {
+      &:before {
+        width: $header-icon-lg;
+        height: $header-icon-lg;
+      }
+      .search-block-form {
+        height: $header-icon-lg;
+      }
+    }
+  }
+  .search-inner {
+    display: none;
+    padding: 0 50px;
+    .search-block-form {
+      background: white;
+      height: $header-icon;
+      max-width: 100%;
+    }
+    input[type="text"] {
+      height: 35px;
+      margin: 5px 1px;
+    }
+    input[type="submit"] {
+      margin: 0;
+      padding: 0 3px;
+      height: 39px;
+    }
+  }
+}
+
+%search {
+  @include search;
+}

data/stylesheets/brevis_components/chrome/header/_social.scss

@@ -0,0 +1,44 @@
+@mixin social {
+  ul {
+    margin: 0 0 0 5px;
+    padding: 0;
+  }
+  li {
+    @include inline-block;
+    @include breakpoint($mobile-device) {
+      margin: 0 0 8px;
+    }
+  }
+  li ~li {
+    @include breakpoint($desktop) {
+      margin: 0 0 0 5px;
+    }
+  }
+  a {
+    @include hide-text;
+    @include inline-block;
+    @include border-radius(20px);
+    font-size: 0;
+    width: $header-icon;
+    height: $header-icon;
+    &.facebook {
+      @include svg-bg-simple("facebook");
+    }
+    &.twitter {
+      @include svg-bg-simple("twitter");
+    }
+    &.mail {
+      @include svg-bg-simple("email");
+    }
+    &.more {
+      @include svg-bg-simple("more-social");
+    }
+  }
+  @include breakpoint($print-media) {
+    display: none;
+  }
+}
+
+%social {
+  @include social;
+}

data/stylesheets/brevis_components/content_lists/_content_stream.scss

@@ -0,0 +1,417 @@
+//////////////////////////////////////////
+// Component groups
+@mixin headline {
+  .pane-node-field-short-headline,
+  .pane-node-title {
+    @content;
+  }
+}
+
+//things that wrap around a thumbnail
+@mixin teaser-items {
+  .pane-node-field-short-headline,
+  .pane-node-title,
+  .pane-node-created,
+  .pane-node-posted-on,
+  .pane-node-body {
+    @content;
+  }
+}
+
+@mixin image-pane {
+  .pane-node-field-thumbnail,
+  .pane-node-field-cover-photo,
+  .pane-node-field-image,
+  .image-fpp {
+    @content;
+  }
+}
+
+@mixin content-stream-node {
+  border-bottom: 1px solid #cccccc;
+  padding-bottom: 1em;
+  margin-bottom: 1em;
+  margin-right: 1em;
+}
+
+%content-stream-node {@include content-stream-node;}
+
+@mixin content-stream-image-max {
+  @include image-pane {
+    @extend %img-left;
+    width: 100%;
+  }
+
+  .field--type-image,
+  .field--type-image a,
+  img {
+    width: 100%;
+    vertical-align: top;
+  }
+  // target everyting except the taxonomy term tag
+  .panel-pane,
+  .embedded_photo {
+    float: left;
+    margin-bottom: 0;
+    h2 {
+      margin-bottom: 1px;
+    }
+  }
+}
+
+%content-stream-image-max { @include content-stream-image-max}
+
+// these are in the variables partial:
+// $content-stream-img-sm: 50%
+// $content-stream-img-md: 58%
+@mixin content-stream-image-sm {
+  @include content-stream-image-max;
+  @include teaser-items {
+    width: 40%;
+    width: calc(100% - #{$content-stream-img-sm} - 20px);
+    float: left;
+  }
+
+  @include image-pane {
+    @extend %img-left;
+    max-width: #{$content-stream-img-sm};
+  }
+}
+
+%content-stream-image-sm {@include content-stream-image-sm;}
+
+
+@mixin content-stream-image-md {
+  @include content-stream-image-max;
+  @include breakpoint($smartphone-landscape) {
+    @include teaser-items {
+      width: 40%;
+      width: calc(100% - #{$content-stream-img-md} - 20px);
+      float: left;
+    }
+
+    @include image-pane {
+      max-width: #{$content-stream-img-md};
+    }
+  }
+}
+
+%content-stream-image-md {@include content-stream-image-md;}
+
+@include content-stream-image-lg {
+  @include image-pane {
+    width: 100%;
+    max-width: 100%;
+    .field--type-image,
+    .field--type-image a,
+    img {
+      width: 100%;
+    }
+  }
+
+  h2 {
+    margin-bottom: 1px;
+  }
+}
+
+%content-stream-image-lg {@include content-stream-image-lg;}
+
+%float-thumb-left {
+  @include clearfix;
+  @include content-stream-image-sm;
+}
+
+%full-size-thumb {
+  @include image-pane {
+    @include img-no-float;
+    max-width: 100%;
+    width: 100%;
+  }
+}
+
+%no-float-thumb {
+  @extend %full-size-thumb;
+  .pane-node-title,
+  .pane-node-body {
+    width: 100%;
+    max-width: 100%;
+    float: none;
+    margin-bottom: 0;
+  }
+}
+
+%content-stream-basic {
+  .views-row {
+    float: left;
+    width: 100%;
+    max-width: 100%;
+  }
+}
+
+@mixin content-stream-1 {
+  @extend %content-stream-basic;
+  .views-row {
+    margin-top: 10px;
+  }
+  .views-row~.views-row {
+    @extend %view_row;
+  }
+}
+
+%layout-2 {
+  @include grid-desktop;
+  @include fluid-grid(2, $padding: 1%);
+}
+
+%layout-3 {
+  @include grid-desktop;
+  @include fluid-grid(3, $padding: 1.4%);
+}
+
+%layout-4 {
+  @include grid-desktop;
+  @include fluid-grid(4, $padding: 1%);
+}
+
+%layout-5 {
+  @include grid-desktop;
+  @include fluid-grid(5, $padding: 1%);
+}
+
+%layout-6 {
+  @include grid-desktop;
+  @include fluid-grid(6, $padding: 1%);
+}
+
+%layout-7 {
+  @include grid-desktop;
+  @include fluid-grid(7, $padding: 1%);
+}
+
+%layout-8 {
+  @include grid-desktop;
+  @include fluid-grid(8, $padding: 1%);
+}
+
+%layout-1-3 {
+  .views-row {
+    @extend %no-float-thumb;
+  }
+  .views-row-1 {
+    float: left;
+    width: 100% !important;
+    max-width: 100%;
+    margin-bottom: 0.5em;
+    @extend %no-float-thumb;
+    @include fallback {
+      img {
+        @extend %lg-thumbnail;
+      }
+    }
+  }
+  .views-row-2,
+  .views-row-3,
+  .views-row-4 {
+    width: 32%;
+    float: left;
+    clear: none;
+    .pane-node-title,
+    .pane-node-created,
+    .pane-node-posted-on {
+      display: none;
+    }
+    .field--name-field-cover-photo:after {
+      display: none;
+    }
+    @include image-pane {
+      img {
+        width: 100% !important;
+        @include fallback {
+          @extend %xxs-thumbnail;
+        }
+      }
+    }
+
+    .field--type-image {
+      width: 100%;
+      max-width: 100%;
+      #page & {
+        img {
+          width: 100%;
+        }
+      }
+    }
+  }
+  .views-row-2 {
+    margin-left: 0;
+    clear: left;
+  }
+  .views-row-3 {
+    margin-left: 2%;
+    clear: none;
+  }
+  .views-row-4 {
+    margin-left: 2%;
+  }
+}
+
+@mixin content-stream-1-3 {
+  @extend %layout-1-3;
+}
+
+@mixin content-stream-3 {
+  .views-row {
+    //@extend %float-thumb-left
+    @extend %content-stream-basic;
+  }
+  @include pane-eq-md-up {
+    @extend %layout-3;
+  }
+
+  @include fallback {
+    @extend %layout-3;
+  }
+}
+
+@mixin content-stream-3-parent {
+  .views-row {
+    //@extend %float-thumb-left
+    @extend %content-stream-basic;
+  }
+  @include pane-parent-eq-md-up {
+    @extend %layout-3;
+  }
+
+  @include fallback {
+    @extend %layout-3;
+  }
+}
+
+@mixin content-stream-4 {
+  .views-row {
+    //@extend %float-thumb-left
+    @extend %content-stream-basic;
+  }
+  &[data-eq-state="pane-sm"] {
+    @extend %layout-2;
+  }
+  @include pane-eq-md-up {
+    @extend %layout-4;
+  }
+
+  @include fallback {
+    //@extend %layout-4
+  }
+}
+
+@mixin content-stream-4-parent {
+  .views-row {
+    //@extend %float-thumb-left
+    @extend %content-stream-basic;
+  }
+  [data-eq-state="pane-sm"] & {
+    @extend %layout-2;
+  }
+  @include pane-parent-eq-md-up {
+    @extend %layout-4;
+  }
+
+  @include fallback {
+    @extend %layout-4;
+  }
+}
+
+@mixin content-stream-6 {
+  @include grid-desktop;
+  @include breakpoint($max-tab-p) {
+    @include fluid-grid(2, $padding: 1%);
+  }
+
+  @include breakpoint($tab-p-desk) {
+    @include fluid-grid(3, $padding: 1%);
+  }
+
+  @include breakpoint($desktop) {
+    @include fluid-grid(6, $padding: 1%);
+  }
+}
+
+@mixin content-stream-6-custom {
+  @include grid-desktop;
+  @include breakpoint($max-tab-p) {
+    @include fluid-grid(2, $padding: 1%);
+  }
+
+  @include breakpoint($tab-p-desk) {
+    @include fluid-grid(2, $padding: 1%);
+    .views-row-5, .views-row-6 //Show only 4 items {
+      display: none;
+    }
+    .views-row-4 {
+      margin-left: 0;
+    }
+  }
+
+  @include breakpoint($desktop) {
+    @include fluid-grid(6, $padding: 1%);
+  }
+}
+
+@mixin content-stream-5 {
+  @include grid-desktop;
+  @include breakpoint($max-tab-p) {
+    @include fluid-grid(2, $padding: 1%);
+  }
+
+  @include breakpoint($tab-p-desk) {
+    @include fluid-grid(3, $padding: 1%);
+  }
+
+  @include breakpoint($desktop) {
+    @include fluid-grid(5, $padding: 1%);
+  }
+}
+
+@mixin content-stream-7 {
+  [data-eq-state="pane-xl"] {
+    @extend %layout-7;
+  }
+  [data-eq-state="pane-lg"] {
+    @extend %layout-6;
+  }
+  [data-eq-state="pane-md"] {
+    @extend %layout-4;
+  }
+  @include pane-container-eq-sm-down {
+    @extend %layout-2;
+  }
+}
+
+@mixin content-stream-8 {
+  [data-eq-state="pane-xl"] {
+    @extend %layout-8;
+  }
+  [data-eq-state="pane-lg"] {
+    @extend %layout-6;
+  }
+  [data-eq-state="pane-md"] {
+    @extend %layout-4;
+  }
+  @include pane-container-eq-sm-down {
+    @extend %layout-2;
+  }
+}
+
+%latest-content-list-pane {
+  .more-link {
+    display: inline-block;
+  }
+  .feed {
+    position: absolute;
+    left: 10px;
+    bottom: 0px;
+    a {
+      font-size: 0;
+    }
+  }
+}