app/assets/stylesheets/small.css.scss

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