Stylesheets for Printers. (#520)

elixirschool · Jul 16, 2016 · 636cf23 · 636cf23
1 parent ab71484
commit 636cf23
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 5 deletions.
diff --git a/_assets/stylesheets/hyde.css b/_assets/stylesheets/hyde.css
@@ -59,6 +59,14 @@ html {
   color: rgba(255,255,255,.5);
   background-color: #202020;
 }
+
+/* Do not show when we print the page. */
+@media print {
+  .sidebar {
+    display: none;
+  }
+}
+
 @media (min-width: 48em) {
   .sidebar {
     position: fixed;
@@ -120,15 +128,21 @@ html {
   padding-bottom: 4rem;
 }
 
-@media (min-width: 48em) {
+@media print {
+  .content {
+    padding:    1rem 0;
+  }
+}
+
+@media screen and (min-width: 48em) {
   .content {
     max-width: 38rem;
     margin-left: 20rem;
     margin-right: 2rem;
   }
 }
 
-@media (min-width: 64em) {
+@media screen and (min-width: 64em) {
   .content {
     margin-left: 22rem;
     margin-right: 4rem;
@@ -142,7 +156,7 @@ html {
  * Flip the orientation of the page by placing the `.sidebar` on the right.
  */
 
-@media (min-width: 48em) {
+@media screen and (min-width: 48em) {
   .layout-reverse .sidebar {
     left: auto;
     right: 0;
@@ -153,7 +167,7 @@ html {
   }
 }
 
-@media (min-width: 64em) {
+@media screen and (min-width: 64em) {
   .layout-reverse .content {
     margin-left: 4rem;
     margin-right: 22rem;

diff --git a/_assets/stylesheets/social.scss b/_assets/stylesheets/social.scss
@@ -100,3 +100,16 @@ div.social__item a[class^="social__icon"] {
   padding: 0;
   font-size: 1.2em;
 }
+
+#github_ribbon img {
+  position: absolute;
+  top: 0;
+  right: 0;
+  border: 0;
+}
+
+@media print {
+  #social, .social__container, #github_ribbon {
+    display: none;
+  }
+}
diff --git a/_layouts/default.html b/_layouts/default.html
@@ -8,7 +8,7 @@
     {% assign body_class = 'rtl' %}
   {% endif %}
   <body class="theme-custom-purple {{ body_class }}">
-    <a href="https://github.com/doomspork/elixir_school"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/652c5b9acfaddf3a9c326fa6bde407b87f7be0f4/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6f72616e67655f6666373630302e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_orange_ff7600.png"></a>
+    <a id="github_ribbon" href="https://github.com/doomspork/elixir_school"><img src="https://camo.githubusercontent.com/652c5b9acfaddf3a9c326fa6bde407b87f7be0f4/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6f72616e67655f6666373630302e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_orange_ff7600.png"></a>
 
     {% include sidebar.html %}