From dd4a01896b4f5f7bbaf66b5cc6e619b44a474f7d Mon Sep 17 00:00:00 2001
From: Kris Aubuchon <shout@k-ris.com>
Date: Mon, 3 Mar 2014 01:16:30 -0500
Subject: [PATCH] changed some topic page widths so the gutter fills the
 availible space, also right-aligning user-dropdown

---
 .../stylesheets/common/admin/admin_base.scss  |  9 ++-
 app/assets/stylesheets/desktop/discourse.scss | 11 +--
 app/assets/stylesheets/desktop/header.scss    |  6 +-
 .../stylesheets/desktop/topic-post.scss       | 67 ++++++++++++++-----
 app/assets/stylesheets/desktop/topic.scss     |  9 ++-
 5 files changed, 70 insertions(+), 32 deletions(-)

diff --git a/app/assets/stylesheets/common/admin/admin_base.scss b/app/assets/stylesheets/common/admin/admin_base.scss
index e4909eed8dc..d8ead6c2d04 100644
--- a/app/assets/stylesheets/common/admin/admin_base.scss
+++ b/app/assets/stylesheets/common/admin/admin_base.scss
@@ -10,7 +10,6 @@
   td, th {padding: 8px;}
   th {border-top: 1px solid $primary_border_color;}
   td {border-bottom: 1px solid $primary_border_color; border-top: 1px solid $primary_border_color;}
-  td:last-of-type {border-bottom: none;}
   tr:hover { background-color: darken($primary_background_color, 2.5%); }
   tr.selected { background-color: lighten($tertiary_background_color, 58%); }
   .filters input { margin-bottom: 0px; }
@@ -112,7 +111,7 @@
   }
   button {
     margin-right: 5px;
-    
+
   }
   input[type=text] {
     display: inline-block;
@@ -887,7 +886,7 @@ table.api-keys {
     background-color: lighten($secondary_background_color, 60%);
     padding: 3px 10px;
     border-radius: 3px;
-    
+
     color: $primary_text_color;
     &:hover {
       color: $primary_text_color;
@@ -920,7 +919,7 @@ table.api-keys {
 }
 
 .staff-actions, .screened-emails, .screened-urls, .screened-ip-addresses {
-  
+
   border-bottom: dotted 1px $primary_border_color;
 
   .heading-container {
@@ -939,7 +938,7 @@ table.api-keys {
     overflow-x: hidden;
   }
   .col.first {
-    
+
   }
 
   .ember-list-item-view {
diff --git a/app/assets/stylesheets/desktop/discourse.scss b/app/assets/stylesheets/desktop/discourse.scss
index dc6b77da0a0..1925931f2db 100644
--- a/app/assets/stylesheets/desktop/discourse.scss
+++ b/app/assets/stylesheets/desktop/discourse.scss
@@ -35,9 +35,7 @@ body {
   .full-width {
     width: $medium-width;
   }
-  .extra-info-wrapper {
-  max-width: 720px !important;
-}
+
 
 }
 
@@ -52,9 +50,7 @@ body {
   .full-width {
     width: $small-width;
   }
-    .extra-info-wrapper {
-  max-width: 680px !important;
-}
+
 }
 
 a.no-href {
@@ -441,7 +437,7 @@ body {
     &:focus {
     }
   }
- 
+
   .radio, .checkbox {
     min-height: 18px;
     padding-left: 18px;
@@ -793,4 +789,3 @@ body {
 .offset1 {
   margin-left: 64px;
 }
-
diff --git a/app/assets/stylesheets/desktop/header.scss b/app/assets/stylesheets/desktop/header.scss
index 945b6ee7219..b372196e4cb 100644
--- a/app/assets/stylesheets/desktop/header.scss
+++ b/app/assets/stylesheets/desktop/header.scss
@@ -237,7 +237,11 @@
   }
 
   &#user-dropdown {
-    width: 155px;
+    width: 116px;
+    .user-dropdown-links {
+    text-align: right;
+
+    }
   }
 
   .btn {
diff --git a/app/assets/stylesheets/desktop/topic-post.scss b/app/assets/stylesheets/desktop/topic-post.scss
index 819e1b7250c..55df6a7dc8c 100644
--- a/app/assets/stylesheets/desktop/topic-post.scss
+++ b/app/assets/stylesheets/desktop/topic-post.scss
@@ -58,6 +58,12 @@ h1 .topic-statuses .topic-status i {margin-right: 5px;}
   font-size: 12px;
   margin-left: -8px;
   background: $primary_background_color;
+  @include medium-width {
+  left: 107px;
+  }
+  @include small-width {
+  left: 103px;
+  }
 }
 
 .avoid-tab {
@@ -69,8 +75,8 @@ h1 .topic-statuses .topic-status i {margin-right: 5px;}
   .reply-new {
     .discourse-no-touch & {
      opacity:0;
-     transition: linear 0.4s;
-     -webkit-transition: linear 0.4s;
+     transition: opacity linear 0.4s;
+     -webkit-transition: opacity linear 0.4s;
     }
     .discourse-touch & {opacity: 1;}
   }
@@ -79,8 +85,8 @@ h1 .topic-statuses .topic-status i {margin-right: 5px;}
 section.post-menu-area, .post-actions {
     .discourse-no-touch & {
       opacity: 0.2;
-       transition: linear 0.4s;
-    -webkit-transition: linear 0.4s;
+       transition: opacity linear 0.4s;
+    -webkit-transition: opacity linear 0.4s;
     }
     .discourse-touch & {opacity: 1;}
   }
@@ -206,9 +212,9 @@ nav.post-controls {
     .quote .title {background: lighten($secondary_background_color, 60%);}
     blockquote {background: lighten($secondary_background_color, 60%);}
     .onebox {
-    background: lighten($secondary_background_color, 60%); 
+    background: lighten($secondary_background_color, 60%);
     border-left: 5px solid lighten($secondary_background_color, 35%);
-    .quote-controls, .quote-controls a {color: $link-color;} 
+    .quote-controls, .quote-controls a {color: $link-color;}
     }
     &.bottom { margin-top: -11px;}
     .topic-meta-data h5 {margin: 5px;}
@@ -438,6 +444,23 @@ iframe {
   .topic-statuses {margin-right: 5px;}
 }
 
+
+@include medium-width {
+  .extra-info-wrapper {
+  max-width: 720px;
+}
+}
+
+/**/
+
+
+@include small-width {
+    .extra-info-wrapper {
+  max-width: 680px;
+}
+}
+
+
 .extra-info {
   h1 {
     margin: 5px 0 0 0;
@@ -708,8 +731,7 @@ blockquote { /* solo quotes */
 
 .gutter {
   float: left;
-  max-width: 250px;
-  width: 15%;
+
   margin-top: 6px;
       ul {margin: 0;}
       padding-left: 10px;
@@ -738,8 +760,7 @@ blockquote { /* solo quotes */
   border-top: 1px solid lighten($primary_border_color, 10%);
   float: left;
   position: relative;
-  width: 720px;
-  padding: 10px 10px 15px 20px;
+  padding: 10px 0 15px 0;
   .highlighted {
     background-color: $highlight_background_color !important;
   }
@@ -762,10 +783,10 @@ blockquote { /* solo quotes */
 
 //columns
 
-.span14 { width: 70%; max-width: 720px; } //main content
-.span2 {max-width: 92px;}
-.span11 {width: 80%; max-width: 580px;}
-.span5 {max-width: 250px;}
+.span14 { width: 70%; padding-left: 1%; } //main content
+.span2 {width: 9%; }
+.span11 {width: 83%; padding-left: 2%; padding-right: 1%;}
+.span5 {width: 19%; padding-left: 1%; }
 
 
 @media screen and (max-width: 966px) {
@@ -780,11 +801,27 @@ blockquote { /* solo quotes */
   h1, h2, h3 {margin: 10px 0;}
   a.mention {background: lighten($secondary_background_color, 60%);}
   &.bottom {
+    .topic-meta-data {padding-left: 13px;}
     &.hidden {display: block; opacity: 0; }
 
   }
   &.bottom .arrow {float: right; margin: 0 0 0 0;}
-  &.top {margin-left: 112px;}
+  &.top {
+
+    margin-left: 112px;
+    max-width: 775px;
+    .topic-meta-data {padding-left: 13px;}
+
+    @include medium-width {
+    margin-left: 99px;
+    }
+
+    @include small-width {
+    margin-left: 95px;
+    max-width: 720px;
+    }
+  }
+  &.top.span14 {padding-left: 0;}
   .topic-body, .topic-meta-data {border: none;}
   .row {border-top: 1px solid $primary_border_color; padding-top: 7px;}
   .reply:first-of-type .row {border-top: none;}
diff --git a/app/assets/stylesheets/desktop/topic.scss b/app/assets/stylesheets/desktop/topic.scss
index 387ac73b7a5..ede8e474723 100644
--- a/app/assets/stylesheets/desktop/topic.scss
+++ b/app/assets/stylesheets/desktop/topic.scss
@@ -1,7 +1,10 @@
 @import "common/foundation/variables";
 @import "common/foundation/mixins";
 
-.post-info a {color: lighten($primary_text_color, 50%);}
+.post-info a {
+  color: lighten($primary_text_color, 50%);
+  padding-right: 5px;
+}
 
 .topic-meta-data-inside {
   float: right;
@@ -100,7 +103,7 @@
 
 a.reply-new {
   position: absolute;
-  color: lighten($primary_text_color, 35%); 
+  color: lighten($primary_text_color, 35%);
   margin-top: -2px;}
 a:hover.reply-new {
   color: $link-color;
@@ -112,7 +115,7 @@ a:hover.reply-new {
 
 #topic-progress {
   position: relative;
-  left: 302px;
+  left: 345px;
   &.hidden {
     display: none;
   }