<commit_before><!doctype html>
<html>
<head>
  <title>TCG Proxy Print</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/10up-sanitize.css/8.0.0/sanitize.min.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  <style>
    @page {
      size: A4;
      margin: 0;
    }
    .page {
      display: flex;
      flex-wrap: wrap;
      align-content: flex-start;
      width: 210mm;
      padding: 16mm 0 0 10.5mm;
      page-break-after: always;
    }
    .card {
      width: 63mm;
      height: 88mm;
      overflow: hidden;
      position: relative;
      background: #E6B89C;
    }
    .card_image {
      width: 63mm;
      position: absolute;
      top: 0;
      left: 0;
    }
    .rotate {
      transform: rotate(90deg) translate(-63mm, 0);
      transform-origin: left bottom 0;
      width: auto;
      height: 63mm;
    }
    @media print {
      body {
        width: 210mm;
      }
      .nav,
      .card_icons,
      .card_input,
      .newcard,
      .newpage {
        display: none;
      }
    }
    @media screen {
      body {
        background: gray;
        padding: 2mm 0;
      }
      .page {
        background: #FFFFFF;
        margin: 2mm auto;
        height: 297mm;
      }
      .nav {
        position: fixed;
        top: 0;
        right: 0;
        background: #9CAFB7;
        border-bottom-left-radius: 20px;
      }
      .nav_link {
        color: #20172C;
        display: inline-block;
        padding: 20px 20px 25px 25px;
      }
      .card_icons {
        position: absolute;
        top: 20px;
        right: 20px;
        background-color: rgba(255, 255, 255, 0.3);
      }
      .card_icon {
        cursor: pointer;
        padding: 8px;
        background-color: rgba(255, 255, 255, 0.7);
        border-radius: 4px;
      }
      .card_input {
        position: absolute;
        bottom: 40mm;
        left: 10px;
        right: 10px;
        width: calc(100% - 20px);
        background-color: rgba(255, 255, 255, 0.7);
        font-size: 10pt;
        font-family: arial, sans-serif;
        text-align: center;
        border: none;
        min-height: 1.5em;
      }
      .newcard {
        cursor: pointer;
        text-align: center;
        line-height: 88mm;
      }
      .newcard_icon {
        vertical-align: middle;
      }
    }
  </style>
</head>
<body>
  <cards></cards>

  <script type="riot/tag">
    <cards>
      <nav class="nav" show={ cards.length > 0 }>
        <a class="nav_link" href="javascript:window.print()" title="print"><i class="nav_icon fa fa-print fa-2x"></i></a>
      </nav>

      <section class="page" each={ packet in packets }>
        <div class="card" each={ card in packet }>
          <img class={ card_image: true, rotate: card.rotate } src={ card.src }>
          <div class="card_icons">
            <i class="card_icon fa fa-clone" title="clone" onclick={ parent.clone }></i>
            <i class="card_icon fa fa-times" title="remove" onclick={ parent.remove }></i>
          </div><commit_msg>カード画像読み込み済みの場合にも背景色が指定されていたのを newcard のみに修正<commit_after><!doctype html>
<html>
<head>
  <title>TCG Proxy Print</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/10up-sanitize.css/8.0.0/sanitize.min.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  <style>
    @page {
      size: A4;
      margin: 0;
    }
    .page {
      display: flex;
      flex-wrap: wrap;
      align-content: flex-start;
      width: 210mm;
      padding: 16mm 0 0 10.5mm;
      page-break-after: always;
    }
    .card {
      width: 63mm;
      height: 88mm;
      overflow: hidden;
      position: relative;
    }
    .card_image {
      width: 63mm;
      position: absolute;
      top: 0;
      left: 0;
    }
    .rotate {
      transform: rotate(90deg) translate(-63mm, 0);
      transform-origin: left bottom 0;
      width: auto;
      height: 63mm;
    }
    @media print {
      body {
        width: 210mm;
      }
      .nav,
      .card_icons,
      .card_input,
      .newcard,
      .newpage {
        display: none;
      }
    }
    @media screen {
      body {
        background: gray;
        padding: 2mm 0;
      }
      .page {
        background: #FFFFFF;
        margin: 2mm auto;
        height: 297mm;
      }
      .nav {
        position: fixed;
        top: 0;
        right: 0;
        background: #9CAFB7;
        border-bottom-left-radius: 20px;
      }
      .nav_link {
        color: #20172C;
        display: inline-block;
        padding: 20px 20px 25px 25px;
      }
      .card_icons {
        position: absolute;
        top: 20px;
        right: 20px;
        background-color: rgba(255, 255, 255, 0.3);
      }
      .card_icon {
        cursor: pointer;
        padding: 8px;
        background-color: rgba(255, 255, 255, 0.7);
        border-radius: 4px;
      }
      .card_input {
        position: absolute;
        bottom: 40mm;
        left: 10px;
        right: 10px;
        width: calc(100% - 20px);
        background-color: rgba(255, 255, 255, 0.7);
        font-size: 10pt;
        font-family: arial, sans-serif;
        text-align: center;
        border: none;
        min-height: 1.5em;
      }
      .newcard {
        cursor: pointer;
        text-align: center;
        line-height: 88mm;
        background: #E6B89C;
      }
      .newcard_icon {
        vertical-align: middle;
      }
    }
  </style>
</head>
<body>
  <cards></cards>

  <script type="riot/tag">
    <cards>
      <nav class="nav" show={ cards.length > 0 }>
        <a class="nav_link" href="javascript:window.print()" title="print"><i class="nav_icon fa fa-print fa-2x"></i></a>
      </nav>

      <section class="page" each={ packet in packets }>
        <div class="card" each={ card in packet }>
          <img class={ card_image: true, rotate: card.rotate } src={ card.src }>
          <div class="card_icons">
            <i class="card_icon fa fa-clone" title="clone" onclick={ parent.clone }></i>
            <i class="card_icon fa fa-times" title="remove" onclick={ parent.remove }></i>
          </div>
{'fraction_non_alphanumeric': 0.13890675241157557, 'fraction_numerical': 0.04019292604501608, 'mean_word_length': 1.7490057445868317, 'pattern_counts': {'":': 0, '<': 63, '<?xml version=': 0, '>': 65, 'https://': 4, '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': '2033643', 'n_tokens_mistral': 2352, 'n_tokens_neox': 2117, 'n_words': 479}