app/assets/stylesheets/small.scss

   1 @import "parameters";
   2
   3 /* Styles specific to a small screen, such as iPhone, Android, etc... */
   4
   5 input[type="submit"],
   6 input[type="text"] {
   7   -webkit-appearance: none;
   8 }
   9
  10 .column-1 {
  11   width: 100%;
  12 }
  13
  14 #menu-icon {
  15   display: inline-block !important;
  16 }
  17
  18 nav.primary,
  19 nav.secondary {
  20   float: none !important;
  21   position: relative;
  22   display: block;
  23   clear: both;
  24 }
  25
  26 header {
  27   height: auto;
  28   min-height: $headerHeight;
  29   background: #fff;
  30
  31   h1 {
  32     padding-bottom: 15px;
  33   }
  34
  35   &.closed nav {
  36     display: none;
  37   }
  38
  39   .search_form {
  40     display: block;
  41   }
  42 }
  43
  44 #sidebar .search_form,
  45 #edit_tab,
  46 #export_tab {
  47   display: none;
  48 }
  49
  50 nav.primary {
  51   padding: 0;
  52
  53   ul, li {
  54     border: none;
  55     border-radius: 0;
  56     width: 100%;
  57   }
  58
  59   ul {
  60     border-top: 1px solid #eee;
  61     li {
  62       border-bottom: 1px solid #eee;
  63       border-right: none;
  64       > a {
  65         border-radius: 0;
  66         width: 100%;
  67         text-align: center;
  68         font-size: 15px;
  69       }
  70     }
  71   }
  72 }
  73
  74 nav.secondary {
  75   border-bottom: 1px solid #eee;
  76
  77   .user-menu {
  78     display: block;
  79     width: 100%;
  80     margin-left: 0;
  81     > li {
  82       width: 49%;
  83       > a {
  84         width: 100%;
  85         text-align: center;
  86       }
  87     }
  88   }
  89 }
  90
  91 #compact-secondary-nav {
  92   display: none;
  93 }
  94
  95 .compact-hide {
  96   display: inline-block;
  97 }
  98
  99 .map-layout {
 100   #sidebar, #map {
 101     position: relative;
 102     overflow-x: hidden;
 103     width: 100%;
 104     height: 50%;
 105   }
 106
 107   .overlay-sidebar {
 108     #sidebar {
 109       width: 300px;
 110     }
 111
 112     #map {
 113       height: 100%;
 114     }
 115   }
 116
 117   #map-ui {
 118     z-index: 9999;
 119     width: 100%;
 120     overflow-y: scroll;
 121   }
 122 }
 123
 124 #sidebar .welcome {
 125   display: none !important;
 126 }
 127
 128 .leaflet-top.leaflet-right {
 129   top: 10px !important;
 130   z-index: 0;
 131 }
 132
 133 .content_map {
 134   width: 100%;
 135   border: none;
 136   float: none;
 137   height: 200px;
 138   max-height: none;
 139   min-height: auto;
 140 }
 141
 142 /* Rules for the login form */
 143
 144 #login_login input#user_email {
 145   width: 100%;
 146   max-width: 18em;
 147 }
 148
 149 #login_login input#user_password {
 150   width: 100%;
 151   max-width: 18em;
 152 }
 153
 154 #login_login input#openid_url {
 155   width: 100%;
 156   max-width: 18em;
 157 }
 158
 159 #login_openid_buttons td {
 160   padding: 2px;
 161 }
 162
 163 /* Rules for the user view */
 164
 165 .user_map {
 166   width: 100% !important;
 167   height: 300px !important;
 168 }
 169
 170 #userinformation .deemphasize {
 171   position: relative;
 172   right: auto; left: auto;
 173   margin-top: 10px;
 174   top: auto;
 175 }
 176
 177 /* Rules for the sign-up page */
 178
 179 .user-new,
 180 .user-create {
 181   .col6 {
 182     width: 100%;
 183   }
 184
 185   .aside {
 186     display: none;
 187   }
 188 }
 189
 190 .site-about #content .attr h1 {
 191   font-size: 28px;
 192 }