<commit_before>@ticketPadding: 5px;
@baseStripWidth: 275px;
@baseToGoPanelWidth: 32px;
@baseTicketTableWidth: 228px;
@baseTicketTableHeight: 76px;
.media-size(@width){
  @scale: @width / @baseStripWidth;
  @numberToGoPanelWidth: @baseToGoPanelWidth * @scale;
  @tableWidth: @width - (@ticketPadding * 3) - @numberToGoPanelWidth;
  @tableHeight: @baseTicketTableHeight * (@tableWidth / @baseTicketTableWidth);
  @media only screen and (max-device-width: @width)
  {
    .ticketStrip {
      width: @width;
    }
    .ticketContent table {
      width: @tableWidth;
      height: @tableHeight;
    }
    .ticketCell {
      font-size: 1em * @scale;
    }
    .numberToGoPanel {
      font-size: 0.9em * @scale;
      width: @numberToGoPanelWidth;
      .panelValue {
        font-size: 1.6em * @scale;
        line-height: 1.6em / @scale;
      }
    }
  }
}

body, table {
  font-family: 'Open Sans', sans-serif;
}
body {
  padding: 0;
  margin: 0;
}
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
body, div {
  box-sizing: border-box;
}
.ticketStrip {
  background-color: #fddbe4;
  width: @baseStripWidth;
}
.ticket {
  padding: @ticketPadding;
  border-bottom: 1px dashed black;
  width: 100%;
}
.ticketContent {
  position: relative;
  table {
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    width: @baseTicketTableWidth;
    height: @baseTicketTableHeight;
  }
}
.ticketCell {
  background-color: white;
  border: 1px solid black;
  font-size: 1em;
  text-align: center;
  padding: 0;
}
.numberCell {
  &.numberCellLoading {
    animation: spin 200ms linear infinite;
    -webkit-animation: spin 200ms linear infinite;
  }
}
@-webkit-keyframes spin { 100% {-webkit-transform: rotate(360deg);}}
@keyframes spin { 100% {transform: rotate(360deg);}}
.numberToGoPanel {
  position: absolute;
  right: 0;
  top: 0;
  text-align: center;
  font-size: 0.9em;
  border: 1px solid black;
  border-radius: 5px;
  width: @baseToGoPanelWidth;
  height: 100%;
  background: linear-gradient(to bottom, #5aac5e 0%, #219128 50%, #017e02 51%, #007e01 100%);
  color: white;
  .panelValue {
    font-size: 1.6em;
    line-height: 1.6em;
  }
}
.media-size(424px);
.media-size(414px);
.media-size(400px);
.media-size(384px);
.media-size(375px);
.media-size(360px);
.media-size(320px);
.media-size(213px);<commit_msg>Adds 3d rotate animation to numbers to go panel on load<commit_after>@ticketPadding: 5px;
@baseStripWidth: 275px;
@baseToGoPanelWidth: 32px;
@baseTicketTableWidth: 228px;
@baseTicketTableHeight: 76px;
.media-size(@width){
  @scale: @width / @baseStripWidth;
  @numberToGoPanelWidth: @baseToGoPanelWidth * @scale;
  @tableWidth: @width - (@ticketPadding * 3) - @numberToGoPanelWidth;
  @tableHeight: @baseTicketTableHeight * (@tableWidth / @baseTicketTableWidth);
  @media only screen and (max-device-width: @width)
  {
    .ticketStrip {
      width: @width;
    }
    .ticketContent table {
      width: @tableWidth;
      height: @tableHeight;
    }
    .ticketCell {
      font-size: 1em * @scale;
    }
    .numberToGoPanel {
      font-size: 0.9em * @scale;
      width: @numberToGoPanelWidth;
      .panelValue {
        font-size: 1.6em * @scale;
        line-height: 1.6em / @scale;
      }
    }
  }
}

body, table {
  font-family: 'Open Sans', sans-serif;
}
body {
  padding: 0;
  margin: 0;
}
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
body, div {
  box-sizing: border-box;
}
.ticketStrip {
  background-color: #fddbe4;
  width: @baseStripWidth;
}
.ticket {
  padding: @ticketPadding;
  border-bottom: 1px dashed black;
  width: 100%;
}
.ticketContent {
  position: relative;
  table {
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    width: @baseTicketTableWidth;
    height: @baseTicketTableHeight;
  }
}
.ticketCell {
  background-color: white;
  border: 1px solid black;
  font-size: 1em;
  text-align: center;
  padding: 0;
}
.numberCell {
  &.numberCellLoading {
    animation: spin 200ms linear infinite;
    -webkit-animation: spin 200ms linear infinite;
  }
}
@-webkit-keyframes spin { 100% {-webkit-transform: rotate(360deg);}}
@keyframes spin { 100% {transform: rotate(360deg);}}
.numberToGoPanel {
  position: absolute;
  right: 0;
  top: 0;
  text-align: center;
  font-size: 0.9em;
  border: 1px solid black;
  border-radius: 5px;
  width: @baseToGoPanelWidth;
  height: 100%;
  background: linear-gradient(to bottom, #5aac5e 0%, #219128 50%, #017e02 51%, #007e01 100%);
  color: white;
  .panelValue {
    font-size: 1.6em;
    line-height: 1.6em;
  }
  -webkit-animation: rotate 2000ms linear 1;
  animation: rotate 2000ms linear 1;
}
@-webkit-keyframes rotate {
  0% {-webkit-transform: rotateY(0deg)}
  20% {-webkit-transform: rotateY(-360deg)}
  50% {-webkit-transform: rotateY(0deg)}
  100% {-webkit-transform: rotateY(-360deg)}
}
@keyframes rotate {
  0% {transform: rotateY(0deg)}
  20% {transform: rotateY(-360deg)}
  50% {transform: rotateY(0deg)}
  100% {transform: rotateY(-360deg)}
}
.media-size(424px);
.media-size(414px);
.media-size(400px);
.media-size(384px);
.media-size(375px);
.media-size(360px);
.media-size(320px);
.media-size(213px);
{'fraction_non_alphanumeric': 0.14716106604866744, 'fraction_numerical': 0.051950560061799926, 'mean_word_length': 3.491760624457936, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, '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': '4283951', 'n_tokens_mistral': 2167, 'n_tokens_neox': 1910, 'n_words': 427}