소스 검색

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 }}