WIP mobile stylesheet for Discourse

mobile.scss

@media only screen and (max-device-width: 540px), only screen and (min-device-width: 560px) and (max-device-width: 1136px) and (-webkit-min-device-pixel-ratio: 2) {
  body {
    min-width: 320px !important;
    max-width: 320px !important;
    overflow: hidden;
  }
  .full-width{width:320px !important;}
  #main-outlet {
    padding-top: 95px !important;
  }
  .regular { width: 100% !important;}
  .d-header {
    width: 320px;
    .extra-info{
      display: block;
      h1{ font-size: 16px !important; } 
      width: 300px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;  // IE 6+, FF 7+, Op 11+, Saf 1.3+, Chr 1+
      -o-text-overflow: ellipsis;  // for Opera 9 & 10
    }  
    .posts-wrapper { width: 320px !important; }
    .container { margin: 10px;}
    .contents{ margin: 10px; }
    .panel {
      .current-username{ display: none; }
      float: right;
      position: fixed;
      right: 5px;
    }
    .d-dropdown{
      width: 308px;
      input[type='text'] {width: 285px;}
    }
  }
  #show-topic-admin{display:none !important;}
  #topic-title{ 
    width: 310px !important;
    margin-left: 8px;
    h1{max-width:267px !important;}
  }
  .extra-info{ a{ display: none; }}
  .topic-meta-data { 
    transform: scale(.5, .5);
    -moz-transform: scale(.5, .5);
    -ms-transform: scale(.5, .5);
    -webkit-transform: scale(.5, .5);
    -o-transform: scale(.5, .5);
    margin-left: -18px !important;
    margin-top: -10px !important;
  }
  .topic-summary {display: none; }
  .posts-wrapper { margin: 0 18px 0 24px; }
  .span5.gutter { display:none; }
  #topic-progress-wrapper { display: none; }
  .span14.topic-body { 
    width: 28% !important; 
    margin-left: -24px;
    img{height: auto;}
    }
  .span11.topic-body{
    width: 70%;
    margin: -2px 0 0 -20px;
  }  
  .embedded-posts.parent-post{
    margin-left: 50px !important;
    width: 262px !important;
  }
  
  #list-controls .nav {
    li{
      margin: 0 !important;
      float: none !important;
      display: inline-block;}
    text-align:center;
    width: 320px;
    margin-bottom: 40px !important;
    .btn.btn-default:second{display:none;}
  }
  
  #topic-list{ 
    thead{ display: none; }
    width: 320px !important;
  }
  
  td.main-link.clearfix{
    width: 280px !important;
  }
  td.star{width:2px;}
  
  td.category,td.posters,td.num{
    display: none;
  }
  
  #list-area h3{display: none;}
  #list-controls .btn {
        position: absolute;
        top: 190px;
        right: 16px;
        width: 90%;
  }
  
  .topic-post {
    width: 100%;
    article.boxed {
      .read-icon {
        right: 10% !important;
        }
      }
    }
  .topic-meta-data{
    .contents {
      padding: 0 0px 0 0;
    }
    .post-info{
      line-height: 14px !important;
    }
  }
  #topic-footer-buttons {
    margin: 24px 0 100px 27px !important;
    p {
      line-height: 18px !important;
      width: 126px;
    }
  }
  #suggested-topics {
    display: none;
    #margin: 40px 0 40px 24px !important;
    # width: 880px !important;
  }  
  .reply-area .form-element{
    width:320px;
  }
  #reply-control {
    .category-combobox{ 
      width: 271px;
      z-index: 99999;
    }
    .toggle-preview { display:none; }
    #reply-title { width: 250px; }
    .wmd-controls {
      #wmd-input {
        width: 100%;
        border-top: 0;
        margin-top: 40px;
      }
      .preview-wrapper {
        display: none;
      }
      .textarea-wrapper {
        width: 100%;
      }
      .wmd-button-bar {
        display: none;
      }
    }
  }
}