瀏覽代碼

Fix cheatsheet print layout

This PR changes the print layout, showing three icons per row instead of
one. In this way we can solve an issue with the Bootstrap grid, which
for some reason limits the output to three pages when printing the
cheatsheet.

Fix: #10395
Geremia Taglialatela 8 年之前
父節點
當前提交
39905502b8
共有 3 個文件被更改,包括 7 次插入1 次删除
  1. 1 0
      src/assets/less/site.less
  2. 5 0
      src/assets/less/site/print.less
  3. 1 1
      src/cheatsheet.html

+ 1 - 0
src/assets/less/site.less

@@ -18,6 +18,7 @@
 @import "site/bootstrap/modals";
 
 @import "site/layout";
+@import "site/print";
 @import "site/social-buttons";
 @import "site/jumbotron-carousel";
 @import "site/stripe-ad";

+ 5 - 0
src/assets/less/site/print.less

@@ -0,0 +1,5 @@
+@media print {
+  .col-print-4 {
+    .make-xs-column(4);
+  }
+}

+ 1 - 1
src/cheatsheet.html

@@ -23,7 +23,7 @@ relative_path: ../
     {% assign sorted_icons = icons | expand_aliases | sort_by:'class' %}
 
     {% for icon in sorted_icons %}
-    <div class="col-md-4 col-sm-6 col-lg-3">
+    <div class="col-md-4 col-sm-6 col-lg-3 col-print-4">
       {% if icon.created >= site.fontawesome.major_version %}<small class="text-muted pull-right">{{ icon.created }}</small>{% endif %}
       <i class="fa fa-fw" aria-hidden="true" title="Copy to use {{ icon.class }}">&#x{{ icon.unicode }}</i>
       fa-{{ icon.class }}