<commit_before><!-- Inject all styles to use them directly -->
<style type="text/css" ng-repeat="variant in fontItem.variants">
@font-face {
  font-family: {{variant.fontFamily}};
  font-style: {{variant.fontStyle}};
  font-weight: {{variant.fontWeight}};
  src:
    local('{{variant.local[0]}}'),
    local('{{variant.local[1]}}'),
    url('{{variant.eot}}') format('embedded-opentype'),
    url('{{variant.woff}}') format('woff'),
    url('{{variant.ttf}}') format('truetype'),
    url('{{variant.svg}}') format('svg');
}
</style>


<div cg-busy="{promise: fontItemPromise, message: 'Fetching {{fontID}}...', templateUrl: 'app/fonts/customLoadingTemplate.html'}">
  <div class="row" ng-hide="busy">
    <div class="col-sm-6 column">
      <h3>{{fontItem.family}} <small>{{fontItem.category}}</small></h3>
      <h4><ng-pluralize count="fontItem.variants.length"
                    when="{'0': 'no style',
                           'one': '{} style',
                           'other': '{} styles'}">
      </ng-pluralize>&nbsp;<small><span ng-repeat="variant in fontItem.variants">{{variant.id}}{{$last ? "" : ", "}}</span></small></h4>
      <h5><ng-pluralize count="fontItem.subsets.length"
                    when="{'0': 'no subsets',
                           'one': '{} subset',
                           'other': '{} subsets'}">
      </ng-pluralize>&nbsp;<small><span ng-repeat="subset in fontItem.subsets">{{subset}}{{$last ? "" : ", "}}</span></small></h5>
      
      <button class="btn btn-default btn-sm" ng-click="isCollapsed = !isCollapsed" ng-init="isCollapsed=true" style="font-family:{{fontItem.variants[0].fontFamily}}; font-weight:400; font-style:{{fontItem.variants[0].fontStyle}};">The quick brown fox jumps over the lazy dog.</button>
    </div>

    <div class="col-sm-6 column">
      <!-- <div class="well well-sm"> -->
      <a href="/api/fonts/{{fontItem.id}}?download=zip" target="_blank" role="button" class="btn btn-primary btn-lg btn-block download-button"><i class="fa fa-download fa-lg"></i><br/>{{fontItem.id}}.zip&nbsp;<br/><small>.eot, .ttf, .svg, .woff and .woff2 files included</small></a>
      <p><small>last modified on {{fontItem.lastModified}} ({{fontItem.version}})</small></p>
      <!-- </div> -->
    </div>

  </div>
  

  

  <!-- <hr> -->

  <div ng-hide="busy" class="fontVariant"> <!-- FONT VARIANT BEGINS -->

    

    <!-- <h4>Font archive</h4> -->

    
    

    <div collapse="isCollapsed">
      <hr>    

      <!-- Show a preview of all fonts -->
      <div class="row" >
        <div class="preview col-md-3 col-sm-4 col-xs-6" ng-repeat="variant in fontItem.variants" style="font-family:{{variant.fontFamily}}; font-weight:{{variant.fontWeight}}; font-style:{{variant.fontStyle}};">
          <!-- <a href="#{{variant.id}}"></a> -->
          <h4>{{variant.id}}</h4>
          <textarea class="form-control" rows="3">The quick brown fox jumps over the lazy dog.</textarea>
          <!-- <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p> -->
        </div>
      </div>

    </div>

    <hr>

    <h4>CSS snippets</h4>

    <tabset>
      <tab heading="Best support">
        <h5>Instructions:</h5>
        <ol>
          <!-- <li></li> -->
          <li class="form-inline">Customize the folder prefix:&nbsp;<div class="form-group">
          <!-- <label>Folder prefix:</label> -->
          <input class="form-control input-sm" type="text" ng-model="folderPrefix" placeholder="no folder prefix" ng-init="folderPrefix='../fonts/'" value="../fonts/">
        </div></li>
          <li>Copy &amp; paste the CSS snippet</li>
        </ol>
        
<pre ng-repeat="variant in fontItem.variants">/* {{fontID}}-{{variant.id}} */
@font-face {
  font-family: {{variant.fontFamily}};
  font-style: {{variant.fontStyle}};
  font-weight: {{variant.fontWeight}};
  src: url('<a href="{{variant.eot}}">{{folderPrefix}}{{fontID}}-{{variant.id}}.eot</a>'); /* IE9 Compat Modes */
  src: local('{{variant.local[0]}}'),{{variant.local[1].length > 0 ? " local('" + variant.local[1] + "')," : ""}}
       url('{{folderPrefix}}{{fontID}}-{{variant.id}}.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('<a href="{{variant.woff}}">{{folderPrefix}}{{fontID}}-{{variant.id}}.woff</a>') format('woff'), /* Modern Browsers */
       url('<a href="{{variant.ttf}}">{{folderPrefix}}{{fontID}}-{{variant.id}}.ttf</a>')  format('truetype'), /* Safari, Android, iOS */
       url('<a href="{{variant.svg}}">{{folderPrefix}}{{fontID}}-{{variant.id}}.svg#{{variant.svg.substring(variant.svg.indexOf('#')+1);}}</a>') format('svg'); /* Legacy iOS */
}
</pre>
      </tab>
      <tab heading="woff2 subsets">
        <h5>Instructions:</h5>
        <ol>
          <li class="form-inline">Customize the folder prefix:&nbsp;<div class="form-group">
          <input class="form-control input-sm" type="text" ng-model="folderPrefix" placeholder="no folder prefix" ng-init="folderPrefix='../fonts/'" value="../fonts/">
        </div></li>
          <!-- <li>Download each <code>.woff2</code> file of your font variants and required subsets</li> -->
          <!-- <li><strong>Rename</strong> the downloaded files</li> -->
          <li>Copy &amp; paste the CSS snippet</li>
        </ol>
        
<pre ng-repeat="variant in fontItem.variants"><span ng-repeat="woff2Item in variant.woff2">/* {{fontID}}-{{variant.id}} - {{woff2Item.subset}} subset */
@font-face {
  font-family: {{variant.fontFamily}};  
  font-style: {{variant.fontStyle}};
  font-weight: {{variant.fontWeight}};
  src: local('{{variant.local[0]}}'),{{variant.local[1].length > 0 ? " local('" + variant.local[1] + "')," : ""}} 
       url('<a href="{{woff2Item.url}}">{{folderPrefix}}{{fontID}}-{{variant.id}}-{{woff2Item.subset}}.woff2</a>') format('woff2');
  unicode-range: {{woff2Item.unicodeRange}};
}
</span></pre>
      </tab>
      <!-- <tab heading="Google hosting">
<pre ng-repeat="variant in fontItem.variants">/* {{variant.id}} */
@font-face {
  font-family: {{variant.fontFamily}};
  font-style: {{variant.fontStyle}};
  font-weight: {{variant.fontWeight}};
  src: url('<a href="{{variant.eot}}">{{variant.eot}}</a>'); /* IE9 Compat Modes */
  src: url('{{variant.eot}}?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('<a href="{{variant.woff}}">{{variant.woff}}</a>') format('woff'), /* Modern Browsers */
       url('<a href="{{variant.ttf}}">{{variant.ttf}}</a>')  format('truetype'), /* Safari, Android, iOS */
       url('<a href="{{variant.svg}}">{{variant.svg}}</a>') format('svg'); /* Legacy iOS */
}
</pre>

      </tab>
      <tab heading="Google hosting with local fallback">
<pre ng-repeat="variant in fontItem.variants">/* {{variant.id}} */
@font-face {
  font-family: {{variant.fontFamily}};
  font-style: {{variant.fontStyle}};
  font-weight: {{variant.fontWeight}};
  src:
    local('{{variant.local[0]}}'),
    local('{{variant.local[1]}}'),
    url('<a href="{{variant.eot}}">{{variant.eot}}</a>') format('embedded-opentype'),
    url('<a href="{{variant.woff}}">{{variant.woff}}</a>') format('woff'),
    url('<a href="{{variant.ttf}}">{{variant.ttf}}</a>') format('truetype'),
    url('<a href="{{variant.svg}}">{{variant.svg}}</a>') format('svg');
}
</pre>
      </tab> -->
    </tabset>

    
  </div> <!-- FONT VARIANT ENDS -->
</div><commit_msg>woff only snippet<commit_after><!-- Inject all styles to use them directly -->
<style type="text/css" ng-repeat="variant in fontItem.variants">
@font-face {
  font-family: {{variant.fontFamily}};
  font-style: {{variant.fontStyle}};
  font-weight: {{variant.fontWeight}};
  src:
    local('{{variant.local[0]}}'),
    local('{{variant.local[1]}}'),
    url('{{variant.eot}}') format('embedded-opentype'),
    url('{{variant.woff}}') format('woff'),
    url('{{variant.ttf}}') format('truetype'),
    url('{{variant.svg}}') format('svg');
}
</style>


<div cg-busy="{promise: fontItemPromise, message: 'Fetching {{fontID}}...', templateUrl: 'app/fonts/customLoadingTemplate.html'}">
  <div class="row" ng-hide="busy">
    <div class="col-sm-6 column">
      <h3>{{fontItem.family}} <small>{{fontItem.category}}</small></h3>
      <h4><ng-pluralize count="fontItem.variants.length"
                    when="{'0': 'no style',
                           'one': '{} style',
                           'other': '{} styles'}">
      </ng-pluralize>&nbsp;<small><span ng-repeat="variant in fontItem.variants">{{variant.id}}{{$last ? "" : ", "}}</span></small></h4>
      <h5><ng-pluralize count="fontItem.subsets.length"
                    when="{'0': 'no subsets',
                           'one': '{} subset',
                           'other': '{} subsets'}">
      </ng-pluralize>&nbsp;<small><span ng-repeat="subset in fontItem.subsets">{{subset}}{{$last ? "" : ", "}}</span></small></h5>
      
      <button class="btn btn-default btn-sm" ng-click="isCollapsed = !isCollapsed" ng-init="isCollapsed=true" style="font-family:{{fontItem.variants[0].fontFamily}}; font-weight:400; font-style:{{fontItem.variants[0].fontStyle}};">The quick brown fox jumps over the lazy dog.</button>
    </div>

    <div class="col-sm-6 column">
      <!-- <div class="well well-sm"> -->
      <a href="/api/fonts/{{fontItem.id}}?download=zip" target="_blank" role="button" class="btn btn-primary btn-lg btn-block download-button"><i class="fa fa-download fa-lg"></i><br/>{{fontItem.id}}.zip&nbsp;<br/><small>.eot, .ttf, .svg, .woff and .woff2 files included</small></a>
      <p><small>last modified on {{fontItem.lastModified}} ({{fontItem.version}})</small></p>
      <!-- </div> -->
    </div>

  </div>
  

  

  <!-- <hr> -->

  <div ng-hide="busy" class="fontVariant"> <!-- FONT VARIANT BEGINS -->

    

    <!-- <h4>Font archive</h4> -->

    
    

    <div collapse="isCollapsed">
      <hr>    

      <!-- Show a preview of all fonts -->
      <div class="row" >
        <div class="preview col-md-3 col-sm-4 col-xs-6" ng-repeat="variant in fontItem.variants" style="font-family:{{variant.fontFamily}}; font-weight:{{variant.fontWeight}}; font-style:{{variant.fontStyle}};">
          <!-- <a href="#{{variant.id}}"></a> -->
          <h4>{{variant.id}}</h4>
          <textarea class="form-control" rows="3">The quick brown fox jumps over the lazy dog.</textarea>
          <!-- <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p> -->
        </div>
      </div>

    </div>

    <hr>

    <h4>CSS snippets</h4>

    <!-- <h5>Instructions:</h5> -->
    <ol>
      <li class="form-inline">Customize the folder prefix:&nbsp;<div class="form-group">
      <input class="form-control input-sm" type="text" ng-model="folderPrefix" placeholder="no folder prefix" ng-init="folderPrefix='../fonts/'" value="../fonts/">
    </div></li>
      <li>Copy &amp; paste the CSS snippet</li>
    </ol>

    <tabset>
      <tab heading="Best support">

<pre ng-repeat="variant in fontItem.variants">/* {{fontID}}-{{variant.id}} */
@font-face {
  font-family: {{variant.fontFamily}};
  font-style: {{variant.fontStyle}};
  font-weight: {{variant.fontWeight}};
  src: url('<a href="{{variant.eot}}">{{folderPrefix}}{{fontID}}-{{variant.id}}.eot</a>'); /* IE9 Compat Modes */
  src: local('{{variant.local[0]}}'),{{variant.local[1].length > 0 ? " local('" + variant.local[1] + "')," : ""}}
       url('{{folderPrefix}}{{fontID}}-{{variant.id}}.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('<a href="{{variant.woff}}">{{folderPrefix}}{{fontID}}-{{variant.id}}.woff</a>') format('woff'), /* Modern Browsers */
       url('<a href="{{variant.ttf}}">{{folderPrefix}}{{fontID}}-{{variant.id}}.ttf</a>')  format('truetype'), /* Safari, Android, iOS */
       url('<a href="{{variant.svg}}">{{folderPrefix}}{{fontID}}-{{variant.id}}.svg#{{variant.svg.substring(variant.svg.indexOf('#')+1);}}</a>') format('svg'); /* Legacy iOS */
}
</pre>
      </tab>

      <tab heading="Modern browsers (woff only)">
      <p><a href="http://caniuse.com/#feat=woff" target="blank">Can I use woff? (compatibility information)</a></p>
<pre ng-repeat="variant in fontItem.variants">/* {{fontID}}-{{variant.id}} */
@font-face {
  font-family: {{variant.fontFamily}};
  font-style: {{variant.fontStyle}};
  font-weight: {{variant.fontWeight}};
  src: local('{{variant.local[0]}}'),{{variant.local[1].length > 0 ? " local('" + variant.local[1] + "')," : ""}}
       url('<a href="{{variant.woff}}">{{folderPrefix}}{{fontID}}-{{variant.id}}.woff</a>') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
</pre>
      </tab>

      <tab heading="Bleeding edge (woff2 with subsets)">
      <p><a href="http://caniuse.com/#feat=woff2" target="blank">Can I use woff2? (compatibility information)</a></p>
<pre ng-repeat="variant in fontItem.variants"><span ng-repeat="woff2Item in variant.woff2">/* {{fontID}}-{{variant.id}} - {{woff2Item.subset}} subset */
@font-face {
  font-family: {{variant.fontFamily}};  
  font-style: {{variant.fontStyle}};
  font-weight: {{variant.fontWeight}};
  src: local('{{variant.local[0]}}'),{{variant.local[1].length > 0 ? " local('" + variant.local[1] + "')," : ""}} 
       url('<a href="{{woff2Item.url}}">{{folderPrefix}}{{fontID}}-{{variant.id}}-{{woff2Item.subset}}.woff2</a>') format('woff2');
  unicode-range: {{woff2Item.unicodeRange}};
}
</span></pre>
      </tab>
      <!-- <tab heading="Google hosting">
<pre ng-repeat="variant in fontItem.variants">/* {{variant.id}} */
@font-face {
  font-family: {{variant.fontFamily}};
  font-style: {{variant.fontStyle}};
  font-weight: {{variant.fontWeight}};
  src: url('<a href="{{variant.eot}}">{{variant.eot}}</a>'); /* IE9 Compat Modes */
  src: url('{{variant.eot}}?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('<a href="{{variant.woff}}">{{variant.woff}}</a>') format('woff'), /* Modern Browsers */
       url('<a href="{{variant.ttf}}">{{variant.ttf}}</a>')  format('truetype'), /* Safari, Android, iOS */
       url('<a href="{{variant.svg}}">{{variant.svg}}</a>') format('svg'); /* Legacy iOS */
}
</pre>

      </tab>
      <tab heading="Google hosting with local fallback">
<pre ng-repeat="variant in fontItem.variants">/* {{variant.id}} */
@font-face {
  font-family: {{variant.fontFamily}};
  font-style: {{variant.fontStyle}};
  font-weight: {{variant.fontWeight}};
  src:
    local('{{variant.local[0]}}'),
    local('{{variant.local[1]}}'),
    url('<a href="{{variant.eot}}">{{variant.eot}}</a>') format('embedded-opentype'),
    url('<a href="{{variant.woff}}">{{variant.woff}}</a>') format('woff'),
    url('<a href="{{variant.ttf}}">{{variant.ttf}}</a>') format('truetype'),
    url('<a href="{{variant.svg}}">{{variant.svg}}</a>') format('svg');
}
</pre>
      </tab> -->
    </tabset>

    
  </div> <!-- FONT VARIANT ENDS -->
</div>
{'fraction_non_alphanumeric': 0.24656162371478169, 'fraction_numerical': 0.00847910268393644, 'mean_word_length': 3.496847793455419, 'pattern_counts': {'":': 0, '<': 319, '<?xml version=': 0, '>': 324, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 10, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5807818', 'n_tokens_mistral': 5259, 'n_tokens_neox': 5036, 'n_words': 885}