Permalink
Browse files

css: more real estate on small screens

On really small screens, don't show the sidebar at all.
  • Loading branch information...
1 parent 1be4c21 commit 4d04c1a31c2c5113d0d3efa18fdc636d0dbf2207 @vincentbernat committed Oct 24, 2012
Showing with 5 additions and 6 deletions.
  1. +1 −0 content/media/css/luffy.pages.less
  2. +2 −4 content/media/css/luffy.sidebar.less
  3. +2 −2 layout/sidebar.j2
@@ -73,6 +73,7 @@
@media only screen and (max-width: 54em) {
#lf-pages {
width: 100% !important;
+ margin-top: 1em;
#lf-page-1, #lf-page-2 {
display: none !important;
}
@@ -74,6 +74,7 @@
.border-box;
.transition(none, 0);
.lf-link {
+ &.lf-not-important { display: none; }
.inline-block;
.lf-link-details, .lf-link-inner {
/* Cancel most effects applied by non mobile CSS */
@@ -119,9 +120,6 @@
}
@media only screen and (max-width: 480px) {
#lf-links {
- padding-left: 0.5em;
- p {
- display: none;
- }
+ display: none;
}
}
View
@@ -41,7 +41,7 @@
{% endif %}
{# Tags #}
{% if resource.tags %}
- <div class="lf-link">
+ <div class="lf-link lf-not-important">
<a href="#" class="lf-sprite-tag lf-link-icon"
title="{{ resource.meta.l10n.attachments }}"></a>
<div class="lf-link-details"><div class="lf-link-inner">
@@ -59,7 +59,7 @@
</div>
{% endif %}
{# Share #}
- <div class="lf-link">
+ <div class="lf-link lf-not-important">
<a href="#" class="lf-sprite-share lf-link-icon"
title="{{ resource.meta.l10n.share }}"></a>
<div class="lf-link-details"><div class="lf-link-inner">

0 comments on commit 4d04c1a

Please sign in to comment.