From f14907e64c8b9ef6c63ba8b4cf11b011bf55ed46 Mon Sep 17 00:00:00 2001
From: danielgrippi <danielgrippi@gmail.com>
Date: Sat, 12 May 2012 22:29:08 -0700
Subject: [PATCH] more responsive stuffs [ci skip]

---
 app/assets/javascripts/app/views/small_frame.js | 10 +++++++++-
 app/assets/stylesheets/new_styles/_base.scss    |  9 ++++++++-
 app/assets/stylesheets/new_styles/_canvas.scss  |  3 ++-
 app/assets/stylesheets/new_styles/_profile.scss |  5 +++--
 app/assets/templates/profile-info.jst.hbs       | 11 +++++++----
 5 files changed, 29 insertions(+), 9 deletions(-)

diff --git a/app/assets/javascripts/app/views/small_frame.js b/app/assets/javascripts/app/views/small_frame.js
index 2b21501a2..0a5dcf103 100644
--- a/app/assets/javascripts/app/views/small_frame.js
+++ b/app/assets/javascripts/app/views/small_frame.js
@@ -79,9 +79,17 @@ app.views.SmallFrame = app.views.Post.extend({
     if(!(this.model.get("photos") || [])[0]) { return }
 
     var modifiers = [this.dimensionsClass(), this.colorClass()].join(' ')
+      , width;
+
+    /* mobile width
+    *
+    *  currently does not re-calculate on orientation change */
+    if($(window).width() <= 767) {
+      width = $(window).width();
+    }
 
     var firstPhoto = this.model.get("photos")[0]
-      , width = (modifiers.search("x2") != -1 ? this.DOUBLE_COLUMN_WIDTH : this.SINGLE_COLUMN_WIDTH)
+      , width = width || (modifiers.search("x2") != -1 ? this.DOUBLE_COLUMN_WIDTH : this.SINGLE_COLUMN_WIDTH)
       , ratio = width / firstPhoto.dimensions.width;
 
     return(ratio * firstPhoto.dimensions.height)
diff --git a/app/assets/stylesheets/new_styles/_base.scss b/app/assets/stylesheets/new_styles/_base.scss
index 297d2b4dd..67c96ea11 100644
--- a/app/assets/stylesheets/new_styles/_base.scss
+++ b/app/assets/stylesheets/new_styles/_base.scss
@@ -1,6 +1,6 @@
 body {
   background-image : image_url("pattern.png");
-  padding : none !important;
+  padding : none;
 }
 
 /* new link color */
@@ -473,3 +473,10 @@ div[data-template=flow] {
     font-family : Roboto-Bold;
   }
 }
+
+/* responsive */
+@media (max-width: 767px) {
+  body {
+    padding : 0;
+ }
+}
\ No newline at end of file
diff --git a/app/assets/stylesheets/new_styles/_canvas.scss b/app/assets/stylesheets/new_styles/_canvas.scss
index 14dc85f18..f70da1cee 100644
--- a/app/assets/stylesheets/new_styles/_canvas.scss
+++ b/app/assets/stylesheets/new_styles/_canvas.scss
@@ -338,7 +338,7 @@
   }
 }
 
-/* canvas responsive */
+/* responsive */
 @media (max-width: 767px) {
   body {
     padding : 0;
@@ -352,6 +352,7 @@
     margin-bottom : 10px;
 
     .content {
+      font-size : 0.9em;
       margin : 0 20px;
       width : auto !important;
     }
diff --git a/app/assets/stylesheets/new_styles/_profile.scss b/app/assets/stylesheets/new_styles/_profile.scss
index 4385483c8..62c22d8c6 100644
--- a/app/assets/stylesheets/new_styles/_profile.scss
+++ b/app/assets/stylesheets/new_styles/_profile.scss
@@ -212,7 +212,7 @@
   }
 }
 
-/* canvas responsive */
+/* responsive */
 @media (max-width: 767px) {
   .profile-image-container {
     height : 100px;
@@ -228,7 +228,8 @@
     padding-bottom : 20px;
   }
 
-  #wallpaper-upload {
+  #wallpaper-upload,
+  .edit-control {
     display : none;
   }
 }
\ No newline at end of file
diff --git a/app/assets/templates/profile-info.jst.hbs b/app/assets/templates/profile-info.jst.hbs
index 4b137f1a2..d914fa9b0 100644
--- a/app/assets/templates/profile-info.jst.hbs
+++ b/app/assets/templates/profile-info.jst.hbs
@@ -36,10 +36,13 @@
         </span>
 
         {{#if is_own_profile}}
-            <span class="divider">•</span>
-            <a href="/profile/edit" title="Edit Profile" rel="tooltip" style="margin-left:2px;">
-                <i class="icon-cog icon-white"></i>
-            </a>
+            <span class="edit-control">
+                <span class="divider">•</span>
+                    <a href="/profile/edit" title="Edit Profile" rel="tooltip" style="margin-left:2px;">
+                        <i class="icon-cog icon-white"></i>
+                    </a>
+                </span>
+            </span>
         {{/if}}
     </div>