<commit_before>@import "images";
@import "mixins";
@import "dialog";
@import "crop-widget";

$widget-height: 25px;
$button-text-color: #8f9295;
$circle-center-width: 10%;
$dragndrop-background-color: #f0f0f0;
$dragndrop-border-color: #b3b5b6;
$dragndrop-text-color: #707478;

.uploadcare-widget {
  display: inline-block !important;
  position: relative;
  vertical-align: middle;
  padding: 0 5px;

  &[data-status=loaded], &[data-status=started] {
    .uploadcare-widget-buttons > li { display: none; }
  }
  &[data-status=started] .uploadcare-widget-buttons .uploadcare-widget-buttons-cancel,
  &[data-status=loaded] .uploadcare-widget-buttons .uploadcare-widget-buttons-remove {
    display: inline-block;
  }

  .uploadcare-widget-circle {
    width: $widget-height;
    height: $widget-height;
    top: -1px;
    float: left;
    margin-right: 1ex;
  }
}

.uploadcare-widget-circle {
  position: relative;
}

.uploadcare-widget-circle--text {
  .uploadcare-widget-circle-back {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: table;
  }
    .uploadcare-widget-circle-text {
      display: table-cell;
      vertical-align: middle;
      text-align: center;
      font-size: 60%;
      line-height: 1;
    }
}

.uploadcare-widget-buttons {
  position: relative;
  top: -1px;
  float: left;
  overflow: hidden;
  margin: 0;
  padding: 0;
  list-style: none;
  .uploadcare-widget-button {
    $height: 24px;
    display: inline-block;
    height: $height;
    float: left;
    font-size: 11px;
    color: $button-text-color;
    line-height: $widget-height;
    width: 36px;
    padding: 0 6px;
    margin: 0 3px ($widget-height - 24) 0;
    list-style: none;
    @include prefix(box-sizing, border-box);
    border-radius: 2px;
    background: #e1e5e7;
    cursor: default;

    $frame: -$height;
    &.uploadcare-widget-buttons-dialog,
    &.uploadcare-widget-buttons-file,
    &.uploadcare-widget-buttons-url {
      @extend %widget-buttons-image;
      background-position: 0 0;
      background-repeat: no-repeat;
      padding-left: 30px;
    }
    &.uploadcare-widget-buttons-dialog,
    &.uploadcare-widget-buttons-url {
      background-position: 0 $frame;
    }
    &.uploadcare-widget-buttons-cancel, &.uploadcare-widget-buttons-remove {
      font-size: 0.9em;
      display: none;
      width: auto;
    }
  }
}

.uploadcare-widget-status-text {
  float: left;
  overflow: hidden;
  line-height: $widget-height;
  height: $widget-height;
  margin-right: 1ex;
  white-space: nowrap;
  padding: 0 5px;
}
  .uploadcare-widget-file-name {
    cursor: pointer;
    color: #1a85ad;
    border-bottom-color: #1a85ad;
    text-decoration: none;
    border-bottom: 1px dotted;
  }

.uploadcare-widget {
  .uploadcare-widget-dragndrop-area {
    display: none;
    position: absolute;
    $padding: 8px;
    $height: $padding * 2 + $widget-height;
    top: -$padding;
    left: 0;
    width: 100%;
    height: $height;
    line-height: $height;
    text-align: center;
    background-color: $dragndrop-background-color;
    color: $dragndrop-text-color;
    border: 1px dashed $dragndrop-border-color;
    border-radius: $widget-height / 2 + $padding;

    &.uploadcare-dragging {
      display: block;
    }
  }
}
<commit_msg>buttons should disappear in loaded state<commit_after>@import "images";
@import "mixins";
@import "dialog";
@import "crop-widget";

$widget-height: 25px;
$button-text-color: #8f9295;
$circle-center-width: 10%;
$dragndrop-background-color: #f0f0f0;
$dragndrop-border-color: #b3b5b6;
$dragndrop-text-color: #707478;

.uploadcare-widget {
  display: inline-block !important;
  position: relative;
  vertical-align: middle;
  padding: 0 5px;

  &[data-status=loaded], &[data-status=started] {
    .uploadcare-widget-button { display: none; }
  }
  &[data-status=started] .uploadcare-widget-buttons .uploadcare-widget-buttons-cancel,
  &[data-status=loaded] .uploadcare-widget-buttons .uploadcare-widget-buttons-remove {
    display: inline-block;
  }

  .uploadcare-widget-circle {
    width: $widget-height;
    height: $widget-height;
    top: -1px;
    float: left;
    margin-right: 1ex;
  }
}

.uploadcare-widget-circle {
  position: relative;
}

.uploadcare-widget-circle--text {
  .uploadcare-widget-circle-back {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: table;
  }
    .uploadcare-widget-circle-text {
      display: table-cell;
      vertical-align: middle;
      text-align: center;
      font-size: 60%;
      line-height: 1;
    }
}

.uploadcare-widget-buttons {
  position: relative;
  top: -1px;
  float: left;
  overflow: hidden;
  margin: 0;
  padding: 0;
  list-style: none;
  .uploadcare-widget-button {
    $height: 24px;
    display: inline-block;
    height: $height;
    float: left;
    font-size: 11px;
    color: $button-text-color;
    line-height: $widget-height;
    width: 36px;
    padding: 0 6px;
    margin: 0 3px ($widget-height - 24) 0;
    list-style: none;
    @include prefix(box-sizing, border-box);
    border-radius: 2px;
    background: #e1e5e7;
    cursor: default;

    $frame: -$height;
    &.uploadcare-widget-buttons-dialog,
    &.uploadcare-widget-buttons-file,
    &.uploadcare-widget-buttons-url {
      @extend %widget-buttons-image;
      background-position: 0 0;
      background-repeat: no-repeat;
      padding-left: 30px;
    }
    &.uploadcare-widget-buttons-dialog,
    &.uploadcare-widget-buttons-url {
      background-position: 0 $frame;
    }
    &.uploadcare-widget-buttons-cancel, &.uploadcare-widget-buttons-remove {
      font-size: 0.9em;
      display: none;
      width: auto;
    }
  }
}

.uploadcare-widget-status-text {
  float: left;
  overflow: hidden;
  line-height: $widget-height;
  height: $widget-height;
  margin-right: 1ex;
  white-space: nowrap;
  padding: 0 5px;
}
  .uploadcare-widget-file-name {
    cursor: pointer;
    color: #1a85ad;
    border-bottom-color: #1a85ad;
    text-decoration: none;
    border-bottom: 1px dotted;
  }

.uploadcare-widget {
  .uploadcare-widget-dragndrop-area {
    display: none;
    position: absolute;
    $padding: 8px;
    $height: $padding * 2 + $widget-height;
    top: -$padding;
    left: 0;
    width: 100%;
    height: $height;
    line-height: $height;
    text-align: center;
    background-color: $dragndrop-background-color;
    color: $dragndrop-text-color;
    border: 1px dashed $dragndrop-border-color;
    border-radius: $widget-height / 2 + $padding;

    &.uploadcare-dragging {
      display: block;
    }
  }
}

{'fraction_non_alphanumeric': 0.14476682363663984, 'fraction_numerical': 0.024608840953972352, 'mean_word_length': 2.9143876337693224, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 4, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '128347', 'n_tokens_mistral': 2468, 'n_tokens_neox': 2333, 'n_words': 460}