浏览代码

making design page print nicer

davegandy 12 年之前
父节点
当前提交
38b6b5e402

+ 1 - 1
build/_includes/footer.html

@@ -1,4 +1,4 @@
-<footer class="footer">
+<footer class="footer hidden-print">
   <div class="container text-center">
     <div>
       <i class="icon-flag"></i> Font Awesome {{ site.font_awesome.version }} &middot;

+ 1 - 1
build/_includes/jumbotron.html

@@ -1,4 +1,4 @@
-<div class="jumbotron jumbotron-ad">
+<div class="jumbotron jumbotron-ad hidden-print">
   <div class="container">
     <h1>{{ jumbotron_h1 }}</h1>
     <p>{{ jumbotron_p }}</p>

+ 1 - 1
build/_includes/navbar.html

@@ -1,4 +1,4 @@
-<div class="navbar navbar-inverse navbar-static-top">
+<div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="navbar-inner">
     <div class="container">
       <a class="brand" href="{{ page.relative_path }}"><i class="icon-flag"></i> Font Awesome</a>

+ 58 - 0
build/assets/css/site.css

@@ -5253,6 +5253,64 @@ a.badge:focus {
 .affix {
   position: fixed;
 }
+@-ms-viewport {
+  width: device-width;
+}
+.hidden {
+  display: none;
+  visibility: hidden;
+}
+.visible-phone {
+  display: none !important;
+}
+.visible-tablet {
+  display: none !important;
+}
+.hidden-desktop {
+  display: none !important;
+}
+.visible-desktop {
+  display: inherit !important;
+}
+@media (min-width: 768px) and (max-width: 979px) {
+  .hidden-desktop {
+    display: inherit !important;
+  }
+  .visible-desktop {
+    display: none !important ;
+  }
+  .visible-tablet {
+    display: inherit !important;
+  }
+  .hidden-tablet {
+    display: none !important;
+  }
+}
+@media (max-width: 767px) {
+  .hidden-desktop {
+    display: inherit !important;
+  }
+  .visible-desktop {
+    display: none !important;
+  }
+  .visible-phone {
+    display: inherit !important;
+  }
+  .hidden-phone {
+    display: none !important;
+  }
+}
+.visible-print {
+  display: none !important;
+}
+@media print {
+  .visible-print {
+    display: inherit !important;
+  }
+  .hidden-print {
+    display: none !important;
+  }
+}
 html,
 body {
   height: 100%;

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

@@ -1,4 +1,5 @@
 @import "twbs-2.3.1/bootstrap.less";
+@import "twbs-2.3.1/responsive-utilities.less";
 @import "sticky-footer.less";
 
 @import "mixins.less";