acklen-keystone/admin/client/App/isomorphic/style/ecommerce/cart/topbar-cart.less

Web Application Framework and Admin GUI / Content Management System built on Express.js and Mongoose

.isoCartItemsWrapper {
  display: flex;
  flex-direction: column;

  .isoNoItemMsg {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;

    span {
      font-size: @isoFontSize * 2 + 2;
      font-weight: 300;
      color: @isoColor--GreyDark;
      line-height: 1.2;
    }
  }

  .isoCartItems {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 15px 30px;
    flex-shrink: 0;
    position: relative;
    .isoTransition;

    .isoItemImage {
      width: 50px;
      height: 50px;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;

      img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }

    .isoCartDetails {
      width: 100%;
      display: flex;
      padding-left: 20px;
      flex-direction: column;

      h3 {
        margin: 0 0 5px;
        line-height: 1;

        a {
          font-size: @isoFontSize - 1;
          font-weight: 500;
          color: @isoColor--Heading;
          line-height: 1.3;
          text-decoration: none;
        }
      }

      p {
        display: flex;
        margin: 0;

        span {
          font-size: @isoFontSize - 2;
          font-weight: 400;
          color: @isoColor--Text;
          line-height: 1.2;

          &.itemMultiplier {
            padding: 0 3px;
          }
        }
      }
    }

    .isoItemRemove {
      position: absolute;
      right: 15px;
      font-size: @isoFontSize - 1;
      font-weight: 500;
      color: @isoColor--Heading !important;
      opacity: 0;
      .isoTransition;
    }

    &:hover {
      background-color: @isoColor--GreyAlt;

      .isoItemRemove {
        opacity: 1;
      }
    }
  }
}