iehacks.less

// Generic Internet Explorer
.ie {

  .lang-dropdown {
    position: relative;
    top: -20px;
  }

  .module,
  .media-image {
    border: 1px solid @genericBorderColor;
  }

  .module-popup {
    border-bottom: none;
  }

  .banner {
    top: 0;
    right: 0;
    width: auto;
  }

  .group-listing {
    margin-left: -24px; // Include border around items.
  }

  .toolbar .breadcrumb {
    filter: none; // Remove filter set by the gradient mixin.
    li {
      float: left; // Fixes inline block display issues.
      &:after {
        margin: 0 0.2em;
      }
    }
  }

}

// Internet Explorer 9
.ie9 {
  .control-large input {
    height: 56px; // Fixes cropped text in IE9
  }
  .module {
    // IE9 renders box shadows wildly out.
    .box-shadow(0 0 5px rgba(0, 0, 0, 0.3));
  }
}

// Internet Explorer 7 + 8
.ie7,
.ie8 {
  .masthead {
    nav ul li a.active {
      position: relative;
      top: -1px;
      background-color: lighten(@mastheadBackgroundColorStart, 2);
      border-top: 1px solid darken(@mastheadBackgroundColorStart, 3);
      border-bottom: 1px solid lighten(@mastheadBackgroundColorStart, 5);
    }
  }  
}


// Internet Explorer 8
.ie8 {
  .masthead .account a.image {
    display: block;
    width: 25px;
  }
}

// Internet Explorer 7
.ie7 {

  // Generic fixes
  .alert {
  	position: relative;
    .close {
      position: absolute;
      top: 6px !important;
      right: @gutterSmallY;
    }
  }
  .media-item {
    width: 30%;
  }
  .tags {
    .tag-list {
      .clearfix;
      li {
        display: block;
        float: left;
      }
    }
    h3 {
      float: left;
    }
    .tag {
      display: block;
      border: 1px solid @moduleHeadingBorderColor;
      background: @moduleHeadingBackgroundColorStart;
    }
  }

  // Form based fixes
  .search-giant input {
    width: 95%;
  }
  .control-full {
    input,
    select,
    textarea {
      width: 95%;
    }
    &.control-large .controls input {
      padding-bottom: 20px;
    }
  }
  .controls {
    position: relative;
    .info-block,
    .info-inline {
      position: absolute;
      top: 0;
      right: 0;
    }
  }
  .form-horizontal .controls {
    margin-left: 0;
  }
  .control-custom .checkbox {
    .ie7-inline-block;
  }
  .stages {
    overflow: hidden;
    background-color: @stagesBackground;
    li {
      height: 30px;
      width: 27.5%;
      button,
      span {
        display: block;
        height: 30px;
        padding-left: 20px;
      }
      button {
        height: 50px;
      }
      .highlight {
        width: auto;
      }
    }
  }

  // Header
  .masthead {
    position: relative;
    z-index: 1;
    .logo img,
    nav {
      .ie7-inline-block;
    }
    nav ul {
      margin-top: 5px;
      li {
        float: left;
        a.active {
          position: relative;
          top: -1px;
          background-color: lighten(@mastheadBackgroundColorStart, 2);
          border-top: 1px solid darken(@mastheadBackgroundColorStart, 3);
          border-bottom: 1px solid lighten(@mastheadBackgroundColorStart, 5);
        }
      }
    }
    .header-image {
      display: block;
    }
    .account .dropdown-menu {
      z-index: 10000;
    }
  }

  // Footer
  .footer-links {
    .clearfix;
    li {
      float: left;  
    }
  }

  // Navs
  .nav-item.active > a {
    background-image: url(../images/background-tag-ie7.png);
    background-position: 0 0;
  }
  .module-narrow .nav-item.image {
    .clearfix;
  }
  .nav-facet .nav-item.active a {
    content: 'x';
  }

  // Toolbar
  .toolbar .breadcrumb li {
    padding-right: 10px;
    margin-right: 5px;
    background: transparent url("@{imagePath}/breadcrumb-slash-ie7.png") 100% 50% no-repeat;
    &.active {
      background-image: none;
    }
  }

  // Modules
  .module-heading {
    .clearfix;
    .media-content {
      position: relative;
    }
    .action {
      position: absolute;
      top: 9px;
      right: 10px;
    }
    .media-image img {
      float: left;
    }
  }
  .group-listing {
    position: relative;
    zoom: 1;
  }

}