piskel/src/css/dialogs-import-image.css

/************************************************************************************************/
/* Import dialog                                                                                 */
/************************************************************************************************/

#dialog-container.import-image {
  width: 550px;
  height: 360px;
  top : 50%;
  left : 50%;
  position : absolute;
  margin-left: -250px;
}

.show #dialog-container.import-image {
  margin-top: -150px;
}

.import-subsection {
  margin-left: 25px;
}

.import-section:not(.import-subsection) > .dialog-section-title {
  width: 50px;
}

.import-section-preview-title {
  position: absolute;
  margin-left: 50%;
  margin-top: -28px;
}

.import-section-preview {
  position: absolute;
  display: inline-block;
  border: 1px dashed #999;
  border-radius: 3px;
  margin-left: 50%;
}

.import-section-preview img {
  max-width: 220px;
  max-height: 220px;
  display: block;
}

.import-section-preview.no-border {
  border-color: transparent;
}

.import-section-preview canvas {
  position: absolute;
  left: 0;
  top: 0;
}

.dialog-section-title {
  display : inline-block;
  width: 80px;
}

.dialog-section-radio {
  margin-top: 15px;
  vertical-align: sub;
}

.import-size-field:nth-of-type(2) {
  margin-left: 5px;
}

.import-image-file-name {
  display: inline-block;
  overflow: hidden;

  width: 200px;
  vertical-align: middle;

  word-break : break-all;
  white-space: nowrap;
  text-overflow: ellipsis;

  font-style: italic;
  font-weight: normal;
  text-shadow: none;
  color: gold;
}

[name=smooth-resize-checkbox] {
  margin : 0 8px;
}

.dialog-import-body {
  padding: 10px 20px;
  font-size:1.3em
}

.import-button {
  font-size: 1em;
  height: 28px;
  padding: 0px 10px;
  margin-top: 15px;
}