image-uploader-crop/src/image-uploader-crop.css

cropper and uploader of images that uses another libraries

/* image-uploader-crop v0.1.1 for jQuery that uses fine-uploader, jcrop
* (c) 2017, MIT licensed. http://tuproyecto.com
* ====================================================================
* Dependencies: jQuery, fine-uploader, jcrop
* Author: TuProyecto.com
* Developer: @krobing
* Created: 04/03/2016
* Website: http://tuproyecto.com
* Description: cropper and uploader of images that uses another libraries
*/
.__fx-main-content {
  width: 100%;
  -webkit-display: -webkit-box;
  -webkit-display: -webkit-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row wrap;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-align-items: stretch;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch; }
  .__fx-main-content .__fx-column {
    -webkit-flex: 1;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 10px; }
    .__fx-main-content .__fx-column:first-of-type {
      margin-left: -10px; }
    .__fx-main-content .__fx-column:last-of-type {
      margin-right: -10px; }

.iuc__clearfix:before, .iuc__image-uploader:before, .iuc__clearfix:after, .iuc__image-uploader:after {
  content: " ";
  display: table; }

.iuc__clearfix:after, .iuc__image-uploader:after {
  clear: both; }

.iuc__image-uploader .iuc__qq-uploader .iuc__qq-upload-button {
  display: inline;
  width: 105px;
  margin-bottom: 10px;
  padding: 7px 10px;
  text-align: center;
  float: left;
  background: #00abc7;
  color: #fff;
  border-radius: 2px;
  border: 1px solid #2dadc2;
  box-shadow: 0 1px 1px rgba(255, 255, 255, 0.37) inset, 1px 0 1px rgba(255, 255, 255, 0.07) inset, 0 1px 0 rgba(0, 0, 0, 0.36), 0 -2px 12px rgba(0, 0, 0, 0.08) inset;
  width: auto; }
  .iuc__image-uploader .iuc__qq-uploader .iuc__qq-upload-button.qq-upload-button-hover {
    background: #33b6cc; }

.iuc__image-uploader .iuc__qq-uploader .qq-upload-list-selector {
  visibility: hidden;
  width: 0px;
  height: 0px;
  margin: 0;
  padding: 0; }

.iuc__content-image-preview {
  overflow: hidden; }

*:not(.qq-uploader) .iuc__content-image-to-crop {
  position: relative;
  min-height: 200px;
  max-height: 490px;
  overflow-y: hidden;
  width: inherit;
  border-radius: 6px;
  background-color: #fdfdfd;
  border: 1px dashed #ccc;
  padding: 20px; }
  *:not(.qq-uploader) .iuc__content-image-to-crop:before {
    content: attr(iuc__drop-area-text) " ";
    position: absolute;
    font-size: 2em;
    left: 0;
    width: 100%;
    text-align: center;
    top: 50%;
    margin-top: -1em;
    opacity: .25; }