app/Resources/static/themes/baggy/css/media_queries.scss

   1
   2 @media screen and (max-width: 1050px) {
   3   .entry {
   4     width: 49%;
   5   }
   6
   7   .entry:nth-child(3n+1) {
   8     margin-left: 1.5%;
   9   }
  10
  11   .entry:nth-child(2n+1) {
  12     margin-left: 0;
  13   }
  14 }
  15
  16 @media screen and (max-width: 900px) {
  17   #article {
  18     width: 80%;
  19   }
  20
  21   .topPosF {
  22     right: 2.5em;
  23   }
  24 }
  25
  26 @media screen and (max-width: 700px) {
  27   .entry {
  28     width: 100%;
  29     margin-left: 0;
  30   }
  31
  32   #display-mode {
  33     display: none;
  34   }
  35 }
  36
  37 @media screen and (max-height: 770px) {
  38   .menu.users,
  39   .menu.internal,
  40   .menu.developer {
  41     display: none;
  42   }
  43 }
  44
  45 @media screen and (max-width: 500px) {
  46   .entry {
  47     width: 100%;
  48     margin-left: 0;
  49   }
  50
  51   body > header {
  52     background-color: #333;
  53     position: fixed;
  54     top: 0;
  55     width: 100%;
  56     height: 3em;
  57     z-index: 11;
  58   }
  59
  60   #links li:last-child {
  61     position: static;
  62     width: auto;
  63   }
  64
  65   #links li:last-child a::before {
  66     content: none;
  67   }
  68
  69   .logo {
  70     width: 1.25em;
  71     height: 1.25em;
  72     left: 0;
  73     top: 0;
  74   }
  75
  76   .login > header {
  77     position: static;
  78   }
  79
  80   .login form {
  81     width: 100%;
  82     position: static;
  83     margin-left: 0;
  84   }
  85
  86   .login .logo {
  87     height: auto;
  88     top: 0.5em;
  89     width: 75px;
  90     margin-left: -37.5px;
  91   }
  92
  93   .desktopHide {
  94     display: block;
  95     position: fixed;
  96     z-index: 20;
  97     top: 0;
  98     right: 0;
  99     border: 0;
 100     width: 2.5em;
 101     height: 2.5em;
 102     cursor: pointer;
 103     background-color: #999;
 104     font-size: 1.2em;
 105   }
 106
 107   .desktopHide:hover,
 108   .desktopHide:focus {
 109     background-color: #fff;
 110   }
 111
 112   #links {
 113     display: none;
 114     width: 100%;
 115     height: auto;
 116     padding-top: 3em;
 117   }
 118
 119   #links.menu--open {
 120     display: block;
 121   }
 122
 123   footer {
 124     position: static;
 125     margin-right: 3em;
 126   }
 127
 128   #main {
 129     margin-left: 1.5em;
 130     padding-right: 1.5em;
 131     position: static;
 132     margin-top: 3em;
 133   }
 134
 135   .card-entry-labels {
 136     display: none;
 137   }
 138
 139   #article_toolbar .topPosF {
 140     display: none;
 141   }
 142
 143   #article {
 144     width: 100%;
 145   }
 146
 147   #article h1 {
 148     font-size: 1.5em;
 149   }
 150
 151   #article_toolbar a {
 152     padding: 0.3em 0.4em 0.2em;
 153   }
 154
 155   #display-mode {
 156     display: none;
 157   }
 158
 159   .popup-form,
 160   #bagit-form,
 161   #search-form {
 162     left: 0;
 163     width: 100%;
 164     border-left: none;
 165   }
 166
 167   .popup-form form,
 168   #bagit-form form,
 169   #search-form form {
 170     width: 100%;
 171   }
 172 }