ama_layout 4.10.1 → 5.0.0

data/app/assets/stylesheets/ama_layout/layout_components/colour-coordinated-list.scss

@@ -1,25 +0,0 @@
-.colour-coordinated-list{
-  margin: $base-margin $base-margin*0.5;
-  padding: $base-padding*0.5 $base-padding;
-  list-style-type: none;
-
-  &.good{ //I will be making a bug for the devs to change the way the JS uses these classes so we can rename to something a bit better -KR
-    border-left: 9px solid $brand-green;
-  }
-
-  &.fair{
-    border-left: 9px solid $orange;
-  }
-
-  &.poor{
-    border-left: 9px solid  $brand-red;
-  }
-
-  &.unreported{
-    border-left: 9px solid $smoke;
-  }
-
-  &.closed{
-    border-left: 9px solid  $black;
-  }
-}

data/app/assets/stylesheets/ama_layout/layout_components/comparison-radios.scss

@@ -1,327 +0,0 @@
-.comparison-radios{
-  &__wrapper{
-    @include grid-row-nest;
-    @include clearfix;
-    margin-bottom: $base-margin;
-  }
-
-  &__radio-full{
-    @include medium-12;
-  }
-
-  &__radio-half{
-    @include medium-6;
-
-    &:nth-of-type(2){
-      .comparison-radios__ribbon{ //only display the ribbon for the first radio
-        display: none;
-      }
-    }
-  }
-
-  &__radio-third{
-    @include medium-4;
-
-    &:nth-of-type(1),
-    &:nth-of-type(3){
-      .comparison-radios__ribbon{ //only display the ribbon for the middle radio
-        display: none;
-      }
-    }
-  }
-
-  &--vertical{
-    text-align: center;
-  }
-
-  &__radio-btn--centered{
-    .comparison-radios__input + label{
-      @include breakpoint(small only){
-        overflow: hidden;
-        padding: 0;
-      }
-
-      @include breakpoint(medium){
-        padding: 0 0 46px 0;
-      }
-
-      &::before{
-        @include breakpoint(medium){
-          top: 100%;
-          margin-top: -35px;
-          left: 50%;
-          margin-left: -12px;
-        }
-
-        @include breakpoint(small only){
-          top: 50%;
-          left: 91%;
-          margin-top: -12px;
-          margin-left: -2px;
-        }
-      }
-
-      &::after{
-        @include breakpoint(medium){
-          top: 100%;
-          margin-top: -27px;
-          left: 50%;
-          margin-left: -4px;
-          display: none;
-        }
-
-        @include breakpoint(small only){
-          top: 50%;
-          left: 91%;
-          margin-top: -4px;
-          margin-left: 6px;
-        }
-      }
-    }
-
-    input[type="radio"]:checked + label{
-      @include breakpoint(medium){
-        padding: 0 0 46px 0;
-      }
-
-      &::after{
-        @include breakpoint(medium){
-          top: 100%;
-          margin-top: -27px;
-          left: 50%;
-          margin-left: -4px;
-        }
-
-        @include breakpoint(small only){
-          top: 50%;
-          left: 91%;
-          margin-top: -4px;
-          margin-left: 6px;
-        }
-      }
-    }
-  }
-
-  &__title{
-    font-size: $base-font-size*1.45;
-    padding: 7px;
-    font-weight: 700;
-
-    @include breakpoint(small only){
-      font-size: $base-font-size*1.25;
-    }
-
-    &--blue-bg{
-      @extend .comparison-radios__title;
-      background: $brand-blue-light;
-      color: $white;
-      margin-bottom: $base-margin;
-      position: relative;
-    }
-
-    &--mobile-split{
-      @include breakpoint(small only){
-        float: left;
-        width: 25%;
-        margin-bottom: 0;
-      }
-    }
-  }
-
-  &__title-content{
-    @include breakpoint(small only){
-      -webkit-transform: translate(-50%, -50%);
-      @include absolute-center;
-      font-size: 4.5vw;
-    }
-  }
-
-  &__label{
-    display: inline-block;
-    width: 85%;
-    margin: 9px auto;
-  }
-
-  &__input:checked{
-    &~label{
-      .comparison-radios__panel{
-        border-bottom: 2px solid darken($sky, 10%);
-        background: darken($sky, 3%);
-
-        @include breakpoint(medium){
-          border-top: 2px solid darken($sky, 10%);
-        }
-      }
-
-      .comparison-radios__content{
-        @include breakpoint(small only){
-          border-left: 2px solid darken($sky, 10%);
-          border-right: 2px solid darken($sky, 10%);
-        }
-      }
-
-      .comparison-radios__divider{
-        border: solid darken($sky, 10%);
-        border-width: 2px 0 0;
-        height: 0;
-      }
-    }
-  }
-
-  &__panel{
-    background-color: $ash;
-    border-bottom: 2px solid $stone;
-    padding: $base-padding;
-    margin-bottom: $base-margin;
-
-    @include breakpoint(medium){
-      border-top: 2px solid $stone;
-    }
-  }
-
-  &__content{
-    @include breakpoint(small only){
-      width: 63%;
-      float: left;
-      border-right: 2px solid $stone;
-      border-left: 2px solid $stone;
-    }
-  }
-
-  &__highlight{
-    font-weight: 700;
-    line-height: 1.5rem;
-
-    &--large{
-      @extend .comparison-radios__highlight;
-      font-size: 2rem;
-    }
-
-    &--medium{
-      @extend .comparison-radios__highlight;
-      font-size: 1.25rem;
-    }
-
-    &--blue{
-      @extend .comparison-radios__highlight;
-      color: $brand-blue-light;
-    }
-  }
-
-  &__image{
-    height: 125px;
-    margin-bottom: $base-margin;
-
-    @include breakpoint(small only){
-      display: none;
-    }
-  }
-
-  &__list{
-    list-style-type: none;
-    padding: 0 $base-padding;
-
-    @include breakpoint(small only){
-      padding: 0 $base-padding/3;
-      font-size: $base-font-size*0.875;
-    }
-  }
-
-  &__list-item{
-    padding-bottom: $base-padding;
-
-    &::before{
-      font-family: 'FontAwesome';
-      content: "\f00c";
-      color: $brand-blue-light;
-      margin-right: 5px;
-      margin-left: -17px;
-    }
-
-    @include breakpoint(small only){
-      text-align: left;
-      margin-left: $base-margin*1.5;
-    }
-  }
-
-  &__ribbon{
-    position: absolute;
-    top: 0;
-    right: -18px;
-
-    @include breakpoint(medium down){
-      right: -14px;
-      width: 100px;
-    }
-
-    @include breakpoint(small only){
-      top: -5px;
-      right: -13px;
-    }
-  }
-
-  &__icon{
-    display: block;
-
-    @include breakpoint(small only){
-      -webkit-transform: translate(-50%, -50%);
-      @include absolute-center;
-      font-size: 10vw;
-    }
-
-    &::before{
-      @include breakpoint(medium){
-        font-size: $base-font-size*3;
-      }
-    }
-
-    &.ama-icon-rv::before{ //make the custom icon play nice with the FA icons
-      position: relative;
-
-      @include breakpoint(medium){
-        font-size: $base-font-size*4;
-        top: 20px;
-        line-height: 9px;
-      }
-
-      @include breakpoint(small only){
-        font-size: 13vw;
-        top: 5px;
-      }
-    }
-  }
-
-  &__divider{
-    margin-bottom: 0;
-    
-    @include breakpoint(small only){
-      display: none;
-    }
-  }
-
-  &--disabled{
-    input[type="radio"]:checked + label{
-      background-color: lighten($sky, 4%);
-      border: 2px solid lighten($dark-sky, 12%);
-      color: lighten($stormcloud, 30%);
-
-      &:before{
-        border: 2px solid lighten($brand-blue-light, 55%);
-      }
-
-      &:after{
-        background-color: lighten($brand-blue-light, 55%);
-      }
-    }
-
-    input [type="radio"] + label{
-      border: 2px solid lighten($dark-sky, 6%);
-    }
-
-
-    [type='radio'] + label[for]{
-      cursor: not-allowed;
-      color: lighten($stormcloud, 30%);
-    }
-  }
-}

data/app/assets/stylesheets/ama_layout/layout_components/content-toggle.scss

@@ -1,25 +0,0 @@
-.content-toggle{
-  &__bg{
-    background-color: $stone;
-    padding: $base-padding;
-    margin-bottom: $base-margin;
-  }
-
-  &__close{
-    @extend .fa;
-    @extend .fa-close;
-    color: $charcoal;
-    cursor: pointer;
-    float: right;
-  }
-
-  //We have to create our own classes for this because Foundation's default show/hide classes
-  //have importants on them which messes with the specificity
-  &--hidden{
-    display: none;
-  }
-
-  &--visible{
-    display: block;
-  }
-}

data/app/assets/stylesheets/ama_layout/layout_components/error-page.scss

@@ -1,25 +0,0 @@
-.error-page-emph{
-  color: $secondary-color;
-}
-
-.error-pg-width{
-  max-width: 650px !important;
-  margin: 0 auto !important;
-  padding-left: $base-padding/2;
-  padding-right: $base-padding/2;
-}
-
-.error-pg-mb{
-  margin: 0 auto $base-margin*8 auto !important;
-}
-
-.error-pg-num{
-  min-width: 50%;
-  min-height: 80px;
-  padding-top: $base-padding/2;
-}
-
-.error-pg-num-border{
-  border-left: 1px solid $slate;
-  margin-top: 0;
-}

data/app/assets/stylesheets/ama_layout/layout_components/features.scss

@@ -1,104 +0,0 @@
-.feature{
-  &__container{
-    background: $white;
-  }
-
-  &__section-title{
-    @extend .wisdom-script;
-    text-align: center;
-    font-size: $base-font-size*2.857;
-
-    @include breakpoint(medium down){
-      margin-top: $base-margin*2;
-    }
-  }
-
-  &__item{
-    padding: $base-padding*2 0;
-    text-align: center;
-  }
-
-  &__image{
-    margin: 0 auto $base-margin auto;
-    width: 415px;
-    height: 219px;
-    background-repeat: no-repeat;
-    background-size: contain;
-    max-width: 100%;
-    background-position: center;
-    
-    @include breakpoint(small only){
-      max-width: 90%;
-    }
-  }
-
-  &__content{
-    @include breakpoint(large){
-      width: 80%;
-      margin: 0 auto;
-    }
-  }
-}
-
-#feature__image{
-  &--devices{
-    background-image: asset-url(devices);
-  }
-
-  &--membership{
-    background-image: asset-url(membership);
-  }
-
-  &--vrar{
-    background-image: asset-url(vrar);
-  }
-
-  &--automotive{
-    background-image: asset-url(automotive);
-  }
-
-  &--rewards{
-    background-image: asset-url(rewards);
-  }
-
-  &--subscriptions{
-    background-image: asset-url(subscriptions);
-  }
-
-  &--gift-cards{
-    background-image: asset-url(gift-card);
-  }
-}
-
-@media (-webkit-min-device-pixel-ratio: 2),
-(min-resolution: 192dpi){
-  #feature__image{
-    &--devices{
-      background-image: asset-url(devices2x);
-    }
-
-    &--feature--membership{
-      background-image: asset-url(membership2x);
-    }
-
-    &--vrar{
-      background-image: asset-url(vrar2x);
-    }
-
-    &--automotive{
-      background-image: asset-url(automotive2x);
-    }
-
-    &--rewards{
-      background-image: asset-url(rewards2x);
-    }
-
-    &--subscriptions{
-      background-image: asset-url(subscriptions2x);
-    }
-
-    &--gift-cards{
-      background-image: asset-url(gift-card2x);
-    }
-  }
-}