lcms-engine 0.2.0 → 0.3.0

data/app/assets/stylesheets/lcms/engine/layout/_sticky-navigation.scss

@@ -1,124 +0,0 @@
-$sticky-width: 60px;
-$sticky-height: 60px;
-$sticky-btn-height: 90px;
-$sticky-btn-width: (small: 50px, medium: 60px, large: 60px, xlarge: 80px );
-$sticky-txt-width: 280px;
-//$sticky-btn-margin: $sticky-width - $sticky-btn-width;
-
-.o-sticky {
-  position: fixed;
-
-  @include breakpoint(small only) {
-    bottom: 0;
-    width: 50%;
-  }
-
-  @include breakpoint(medium) {
-    top: 50%;
-    transform: translateY(-50%);
-    &:hover, &:focus {
-      .o-sticky__txt {
-        display: block;
-      }
-    }
-  }
-
-
-  @include m(right) {
-    right: 0;
-    text-align: right;
-
-    @include breakpoint(medium) {
-      @include e(btn) {
-        border-bottom-right-radius: 0;
-        border-top-right-radius: 0;
-      }
-    }
-  }
-
-  @include m(left) {
-    left: 0;
-    text-align: left;
-
-    @include breakpoint(medium) {
-      @include e(btn) {
-        border-bottom-left-radius: 0;
-        border-top-left-radius: 0;
-      }
-    }
-  }
-
-  @include m(disabled) {
-    &, a {
-      cursor: not-allowed;
-      pointer-events: none !important;
-    }
-  }
-
-  @include e(wrap) {
-    flex-wrap: nowrap;
-    height: 100%;
-
-    @include breakpoint(medium) {
-      @include flex-align($x: center, $y: middle);
-    }
-
-    @include breakpoint(small only) {
-      @include m(right) {
-        @include flex-align($x: right, $y: middle);
-      }
-      @include m(left) {
-        @include flex-align($x: left, $y: middle);
-      }
-    }
-  }
-
-  @include e(btn) {
-    @include button($background: $ub-white, $background-hover: darken($ub-white, 10%), $color: $ub-txt);
-    @include breakpoint(medium) {
-      @include button($background: rgba($ub-panel-bg, .7), $background-hover: rgba($ub-white, .7), $color: $ub-txt);
-    }
-    @include button-expand;
-    border: 1px solid darken($ub-panel-bg, 5%);
-    height: $sticky-btn-height;
-    margin-bottom: 0;
-    padding: 0 $ub-xs-padding;
-
-    @include breakpoint(small only) {
-      border-radius: 0;
-      padding: 0;
-    }
-
-    @each $breakpoint, $btn-width in $sticky-btn-width {
-      @include breakpoint($breakpoint) {
-        min-width: $btn-width;
-      }
-    }
-
-  }
-
-  @include e(icon) {
-    @include flex-grid-column(shrink, 0);
-  }
-
-  @include e(txt) {
-    @include flex-grid-column(shrink, 0);
-    max-width: $sticky-txt-width;
-    text-align: left;
-    width: auto;
-
-    @include breakpoint(medium) {
-      display: none;
-      padding-left: $ub-xs-padding;
-    }
-  }
-
-  @include e(arrow-header) {
-    @include txt-element(arrow-header);
-  }
-
-  @include e(arrow-subheader) {
-    @include txt-element(arrow-subheader);
-  }
-
-}

data/app/assets/stylesheets/lcms/engine/layout/_subscribe.scss

@@ -1,68 +0,0 @@
-.o-subscribe {
-  background-color: map-get($ub-green, sixty);
-}
-
-.o-subscribe-form {
-  $ub-subscribe-form-bg: map-get($ub-green, eighty);
-
-  @include e(wrap) {
-    @include breakpoint(medium down) {
-      padding-left: 0;
-      padding-right: 0;
-    }
-  }
-
-  @include e(label) {
-    @include flex-grid-column(12);
-    @include flex-align-self(middle);
-    @include txt-element(subscribe-header);
-    @include add-top-bottom-padding($y: .5);
-    color: map-get($ub-mignight, base);
-
-    @include breakpoint(ipad) {
-      @include flex-grid-column(4, 0);
-      @include add-top-bottom-padding(0);
-      @include add-column-padding($x: 0);
-    }
-  }
-
-  @include e(email) {
-    //@include flex-grid-column(12, 0);
-    @include placeholder($ub-subscribe-txt);
-    height: $ub-subscribe-height;
-    margin-bottom: 0;
-    input {
-      @include txt-element(subscribe-text);
-      flex: 1 1 auto;
-      height: auto;
-      margin: 0;
-      padding: 1.5rem 1rem 1.5rem 2rem;
-      &, &:focus {
-        background-color: $ub-subscribe-form-bg;
-        border-color: $ub-subscribe-form-bg;
-        box-shadow: none;
-        color: $ub-subscribe-txt;
-      }
-    }
-
-    @include breakpoint(medium down) {
-      input {
-        @include add-column-padding($x: .5);
-        min-width: 1px;
-      }
-    }
-
-    @include breakpoint(ipad) {
-      @include flex-grid-column(8, 0);
-    }
-  }
-  @include e(submit) {
-    flex: 0 0 auto;
-    height: 100%;
-    button {
-      @include button($background: $ub-subscribe-form-bg, $background-hover: auto, $color: $ub-txt);
-      height: 100%;
-      margin: 0;
-    }
-  }
-}

data/app/assets/stylesheets/lcms/engine/pages/_about-people.scss

@@ -1,115 +0,0 @@
-$staff-img: 120px;
-
-.c-stp-header {
-  h1 { color: $ub-primary; }
-  @include e(title) {
-    font-family: $ub-serif;
-    font-weight: 600;
-    padding-bottom: $ub-small-padding;
-  }
-  @include breakpoint(large) {
-    p { width: 70%; }
-  }
-}
-
-@mixin staff-dsc($dsc-count) {
-  @for $i from 1 through $dsc-count {
-    &:nth-child(#{$dsc-count}n + #{$i}) {
-      .c-stp-staff__dsc {
-        margin-left: (1 - $i) * 100%;
-        width: $dsc-count * 100%;
-
-        &::before {
-          @include css-triangle($tooltip-pip-width, $ub-white, up);
-          bottom: 100%;
-          left: (100% / $dsc-count) * ($i - 1);
-          margin-left: $staff-img / 2;
-          position: absolute;
-          transform: translateX(-50%);
-        }
-      }
-    }
-  }
-}
-
-.c-stp-staff {
-  @include e(item) {
-    @include flex-grid-column(12, 0);
-    @include staff-dsc(1);
-    flex-shrink: 1;
-
-    @include breakpoint(medium) {
-      @include flex-grid-column(6, 0);
-      @include staff-dsc(2);
-    }
-
-    @include breakpoint(large) {
-      @include flex-grid-column(4, 0);
-      @include staff-dsc(3);
-    }
-  }
-
-  @include e(dsc) {
-    @extend %material-card;
-    @extend %popup-shadow;
-    @include callout-base;
-    @include callout($ub-white);
-    @include add-column-padding;
-    @include add-top-bottom-padding;
-    display: none;
-
-    > div { @include txt-element(base); }
-
-    // @include breakpoint(large) {
-    //   > div { width: 75%;  }
-    // }
-    //
-    // @include breakpoint(medium) {
-    //   > div { width: 85%;  }
-    // }
-
-    .close-button {
-      color: map-get($ub-yellow, base);
-      font-size: xx-large;
-      font-weight: bold;
-    }
-  }
-}
-
-.c-stp-media {
-  @include media-object-container;
-  margin-bottom: .5rem;
-  margin-top: 1rem;
-
-  @include breakpoint(medium) {
-    @include add-gutter(margin, top, 1.5);
-    margin-bottom: 1rem;
-  }
-
-  @include e(img) {
-    @include media-object-section;
-    img {
-      @extend %material-card;
-      background-color: $ub-white;
-      border: 1px solid $medium-gray;
-      border-radius: 50%;
-      height: $staff-img;
-      width: $staff-img;
-    }
-  }
-
-  @include e(body) {
-    @include media-object-section;
-    flex: 1 1 0;
-    padding: $ub-base-padding $ub-xs-padding;
-
-    h3 {
-      @include txt-element(staff-name);
-      margin-bottom: .5rem;
-    }
-
-    h4 {
-      @include txt-element(staff-position);
-    }
-  }
-}

data/app/assets/stylesheets/lcms/engine/pages/_about.scss

@@ -1,61 +0,0 @@
-.c-ap {
-}
-
-.c-ap-hero {
-  background: image-url('lcms/engine/about_hero_bg.jpg'), no-repeat;
-  background-size: cover;
-  height: 300px;
-
-  @include e(body) {
-    @include grid-column-offset(4);
-    @include flex-grid-column(8);
-    background-color: rgba($ub-white, .45);
-    color: $ub-primary;
-
-    @include breakpoint(medium) {
-      @include grid-column-offset(6);
-      @include flex-grid-column(6);
-    }
-  }
-}
-
-.c-ap-cta {
-  @include add-gutter($type: margin, $subtype: bottom);
-  @include add-gutter($type: margin, $subtype: top);
-
-  h2 {
-    @include txt-element(media-header);
-    margin-bottom: 1rem;
-  }
-  p { @include txt-element(media-text); }
-}
-
-.c-ap-img--si {
-  background-image: image-url('lcms/engine/about_standards_institute.jpg');
-  background-repeat: no-repeat, no-repeat;
-  background-size: cover;
-
-  @media screen and #{breakpoint(medium)} and #{breakpoint(ipad down)} {
-    background-position: 40% 0;
-  }
-}
-
-.c-ap-img--hwa {
-  background-image: image-url('lcms/engine/about_who_we_are.jpg');
-  background-repeat: no-repeat, no-repeat;
-  background-size: cover;
-
-  @media screen and #{breakpoint(medium)} and #{breakpoint(ipad down)} {
-    background-position: 100% 0;
-  }
-}
-
-.c-ap-img--op {
-  background-image: image-url('lcms/engine/about_partners.jpg');
-  background-repeat: no-repeat, no-repeat;
-  background-size: cover;
-
-  @media screen and #{breakpoint(medium)} and #{breakpoint(ipad down)} {
-    background-position: 70% 0;
-  }
-}

data/app/assets/stylesheets/lcms/engine/pages/_content-guide.scss

@@ -1,205 +0,0 @@
-@mixin cg-page-color-scheme($map) {
-  .c-cg-btn-download {
-    $background: transparentize(#fff, .2);
-    $color: map-get($map, link);
-    @include button-style($background: $background, $background-hover: transparentize($background, .3),$color: $color);
-  }
-
-  .o-sidebar-nav {
-    @include e(header) {
-      color: map-get($map, sidebar);
-    }
-
-    @include e(sep) {
-      background: map-get($map, sidebar);
-    }
-
-    @include e(item) {
-      a {
-        &.active, &:hover {
-          color: map-get($map, sidebar);
-        }
-      }
-    }
-  }
-}
-
-.c-cg-hero {
-  background-color: $ub-hero-bg;
-
-  @include e(img) {
-    @extend %u-ph-img--light;
-    @include aspect-ratio(1, 1);
-    @include flex-grid-column(12);
-    background-color: $ub-hero-bg;
-    background-position: center center;
-    background-size: cover;
-    padding: 0 !important;
-
-    @include breakpoint(ipad) {
-      @include flex-grid-column(3);
-    }
-  }
-
-  @include e(body) {
-    @include flex-grid-column(12, 2 * 1.5rem);
-    padding-bottom: 3.5rem;
-    padding-top: 2.25rem;
-
-    @include breakpoint(ipad) {
-      @include flex-grid-column(9, 2 * 1.875rem);
-    }
-
-  }
-}
-
-.c-cg-content {
-  padding-bottom: $ub-large-padding * 2;
-  padding-top: $ub-xlarge-padding;
-
-  @include e(sidebar) {
-
-    @include breakpoint(medium down) {
-      @include add-gutter(margin, left, -.5);
-      @include add-gutter(margin, right, -.5);
-      // flex: 0 0 100%;
-      // min-width: 100%;
-      @include flex-grid-column(12, 0);
-      //display: none;
-    }
-
-    @include breakpoint(ipad) {
-      @include flex-grid-column(3);
-      border-right: 1px dotted $light-gray;
-    }
-  }
-
-  @include e(body) {
-    @include flex-grid-column(12, 2 * 1.75rem);
-
-    @include breakpoint(ipad) {
-      @include flex-grid-column(9);
-      padding: 0 2.125rem 0 2.25rem !important;
-    }
-
-    h1, h2, h3, h4 {
-      font-weight: bold;
-    }
-
-    h1 {
-      @include txt-heading(h3);
-      clear: both;
-      padding-top: 1.25rem;
-
-      & + h2 {
-        padding-top: 0 !important;
-      }
-    }
-
-    h2 {
-      @include txt-heading(h4);
-      padding-top: 1.25rem;
-
-      & + h3 {
-        padding-top: 0 !important;
-      }
-    }
-
-    h3 {
-      @include txt-heading(h5);
-      padding-top: 1.25rem;
-
-      & + h4 {
-        padding-top: 0 !important;
-      }
-    }
-
-    h4 {
-      @include txt-heading(h6);
-      padding-top: 1.25rem;
-    }
-
-    p, ol, ul {
-      &, * {
-        color: $ub-txt-dark;
-        font-family: $ub-sanserif !important;
-        font-size: 1rem !important;
-        line-height: 1.5 !important;
-      }
-    }
-
-    ul li {
-      text-indent: 0 !important;
-    }
-
-    img, span, td, table {
-      max-width: 100%;
-      //max-height: 100%;
-    }
-    img { height: auto !important; }
-
-    @include breakpoint(ipad down) {
-      p { margin: 0 !important; text-indent: 0 !important; }
-      li { margin-left: 15px !important;}
-      // span:not(.c-cg-standard):not(.c-cg-dropdown):not(.c-cg-icon), img {
-      //   width: 100% !important;
-      // }
-
-      table {
-        margin-left: 0 !important;
-        margin-right: 0 !important;
-      }
-    }
-
-  }
-}
-
-@include breakpoint(ipad down) {
-  .c-cg-dropdown {
-    max-width: 200px !important;
-    width: 100% !important;
-  }
-}
-
-.c-cg-grade {
-  text-transform: capitalize;
-
-  &::after {
-    content: ', ';
-  }
-
-  &:last-child::after {
-    content: ''
-  }
-}
-
-.c-cg-teaser {
-  @include txt-element(cg-teaser);
-  color: $ub-white;
-}
-
-.c-cg-title {
-  margin-bottom: 2rem;
-
-  * {
-    @include txt-element(cg-title);
-    color: $ub-white !important;
-    margin-bottom: 0;
-  }
-
-}
-
-.o-page--cg-ela {
-  @include cg-color-scheme($ub-cg-ela-colors);
-  @include cg-page-color-scheme($ub-cg-ela-colors);
-}
-
-.o-page--cg-math {
-  @include cg-color-scheme($ub-cg-math-colors);
-  @include cg-page-color-scheme($ub-cg-math-colors);
-}
-
-.o-page--cg-lead {
-  @include cg-color-scheme($ub-cg-lead-colors);
-  @include cg-page-color-scheme($ub-cg-lead-colors);
-}