v3.0.0.md

v3.0.0 Migration Guide

This version contains some breaking changes to the styling of the FileInput component. The input in this component is now being wrapped in a div with button styling, instead of a Button component, due to issues with opening the file browser in Firefox and IE.

The updated fileupload class styles are below:

.fileupload{

  .thumbnail{
    display: inline-block;
    @include rem(margin-right, 15px);
    width: 70px;
    vertical-align: middle;

    img{
      border-radius: 50%;
      height: 70px;
    }
  }

  .button-secondary-light{
    overflow: hidden;
    position: relative;
    vertical-align: middle;
    background-color: $grey-base;
    box-shadow: none;
    border: none;
    cursor: pointer;
    color: $white-base;
    text-align: center;

    &:hover{
      background-color: darken($grey-base, 8%);
    }

    .fileupload-exists{
      color: $white-base;
    }
  }

  &.fileupload-exists{
    div{
      padding: 0px !important;

      span{
        display: inline-block;
        @include rem(margin, 20px 0px);
        color: $black-base;
      }
    }
  }

  .button-secondary-light>input{
    position:absolute;
    top:0;
    right:0;
    margin:0;
    opacity:0;
    filter:alpha(opacity=0);
    transform:translate(-300px, 0) scale(4);
    cursor: pointer;
  }
}