Refactor right side bar, see you, BRs.

Changelog.md

@@ -74,6 +74,7 @@ For more details see https://wiki.diasporafoundation.org/Updating
 * Slight redesign of mobile publisher [#4604](https://github.com/diaspora/diaspora/pull/4604)
 * Port conversations to Bootstrap [#4622](https://github.com/diaspora/diaspora/pull/4622)
 * Remove participants popover and improve conversations menu [#4644](https://github.com/diaspora/diaspora/pull/4644)
+* Refactor right side bar [#4793](https://github.com/diaspora/diaspora/pull/4793)
 
 ## Bug fixes
 * Highlight down arrow at the user menu on hover [#4441](https://github.com/diaspora/diaspora/pull/4441)

app/assets/stylesheets/application.css.sass

@@ -982,87 +982,6 @@ h1.tag
     :font
       :weight bold
 
-.rightBar
-  .title
-    :position relative
-    :border
-      :bottom 1px solid $border-grey
-    :padding 2px 0
-      :top 0
-
-    &.no_icon
-      :padding
-        :left 8px
-
-    .right
-      :right 4px
-      :top 3px
-      :font-size smaller
-      :font-weight bold
-      :color $text-dark-grey
-
-    .icons-plus,
-    .icons-heart,
-    .icons-question,
-    .icons-monotone_wrench_settings,
-    .icons-coffee,
-    .icons-mail,
-    .icons-bookmark,
-      :position absolute
-      :margin-left 3px
-
-    .icons-plus
-      :width  14px
-      :height 14px
-
-    .icons-heart
-      :width  13px
-      :height 13px
-
-    .icons-question
-      :width  16px
-      :height 16px
-
-    .icons-monotone_wrench_settings
-      :width  16px
-      :height 16px
-
-    .icons-bookmark
-      :width  14px
-      :height 16px
-
-    .icons-coffee
-      :width  16px
-      :height 14px
-
-    .icons-mail
-      :width 16px
-      :height 13px
-
-    h5.title-header
-      :margin-left 22px
-
-    h5
-      :font-size 12px
-      :margin 0
-      :color $text-dark-grey
-
-  .section
-    .content
-      :padding 8px
-      :color $text-grey
-      :font-size 11px
-    li
-      :list-style none
-      :float left
-      :padding-right 10px
-    :margin
-      :bottom 25px
-
-    #invite_code
-      :width 100%
-      @include box-sizing(border-box)
-
 .subtle
   :color $text-grey
   :font

app/assets/stylesheets/sidebar.css.scss

@@ -137,3 +137,101 @@ $bluebg: #e7f2f7;
 	}
 	/* ---- end override app/stylesheets/vendor/autoSuggest.css ---- */
 }
+
+.rightBar {
+  .section {
+    margin-bottom: 20px;
+    
+    .title {
+      position: relative;
+      border-bottom: 1px solid $border-grey;
+      padding-bottom: 2px;
+
+      &.no_icon { padding-left: 8px; }
+
+      .right {
+        right: 4px;
+        top: 3px;
+        font-size: smaller;
+        font-weight: bold;
+        color: $text-dark-grey;
+      }
+      
+      .icons-plus,
+      .icons-heart,
+      .icons-question,
+      .icons-monotone_wrench_settings,
+      .icons-coffee,
+      .icons-mail,
+      .icons-bookmark {
+        position: absolute;
+        margin-left: 3px;
+      }
+
+      .icons-plus {
+        width:  14px;
+        height: 14px;
+      }
+
+      .icons-heart {
+        width:  13px;
+        height: 13px;
+      }
+
+      .icons-question,
+      .icons-monotone_wrench_settings {
+        width:  16px;
+        height: 16px;
+      }
+
+      .icons-bookmark {
+        width:  14px;
+        height: 16px;
+      }
+
+      .icons-coffee {
+        width:  16px;
+        height: 14px;
+      }
+
+      .icons-mail {
+        width:  16px;
+        height: 13px;
+      }
+
+
+      h5.title-header {
+        margin-left: 22px;
+      }
+
+      h5 {
+        font-size: 12px;
+        margin: 0;
+        color: $text-dark-grey;
+      }
+    }
+    
+    .content {
+      padding: 8px;
+      color: $text-grey;
+      font-size: 11px;
+          
+      p, ul {
+        margin: 5px 0px;
+      }
+
+      ul {
+        padding-left: 0;
+      
+        li {
+          list-style: none;
+        }
+      }
+
+      #invite_code {
+        width: 100%;
+        @include box-sizing(border-box);
+      }
+    }
+  }
+}

app/views/shared/_right_sections.html.haml

@@ -18,7 +18,7 @@
     %h5.title-header
       = t('aspects.index.new_here.title')
   .content
-    != t('aspects.index.new_here.follow', :link => link_to("#"+t('shared.publisher.new_user_prefill.newhere'), tag_path(:name => t('shared.publisher.new_user_prefill.newhere'))))
+    != t('aspects.index.new_here.follow', link: link_to("#"+t('shared.publisher.new_user_prefill.newhere'), tag_path(name: t('shared.publisher.new_user_prefill.newhere'))))
     %br
     = link_to(t('aspects.index.new_here.learn_more'), "http://wiki.diasporafoundation.org/Welcoming_Committee")
 
@@ -28,17 +28,17 @@
     %h5.title-header
       = t('aspects.index.help.need_help')
   .content
-    = t('aspects.index.help.here_to_help')
+    %p
-    %br
+      = t('aspects.index.help.here_to_help')
-    = t('aspects.index.help.do_you')
+    %p
-    %br
+      = t('aspects.index.help.do_you')
-    != t('aspects.index.help.have_a_question', :link => link_to("#"+t('aspects.index.help.tag_question'), tag_path(:name => t('aspects.index.help.tag_question'))))
+    %ul
-    %br
+      %li
-    != t('aspects.index.help.find_a_bug', :link => link_to("#"+t('aspects.index.help.tag_bug'), tag_path(:name => t('aspects.index.help.tag_bug'))))
+        != t('aspects.index.help.have_a_question', :link => link_to("#"+t('aspects.index.help.tag_question'), tag_path(:name => t('aspects.index.help.tag_question'))))
-    %br
+      %li
-    != t('aspects.index.help.feature_suggestion', :link => link_to("#"+t('aspects.index.help.tag_feature'), tag_path(:name => t('aspects.index.help.tag_feature'))))
+        != t('aspects.index.help.find_a_bug', :link => link_to("#"+t('aspects.index.help.tag_bug'), tag_path(:name => t('aspects.index.help.tag_bug'))))
-    %br
+      %li
-    %br
+        != t('aspects.index.help.feature_suggestion', :link => link_to("#"+t('aspects.index.help.tag_feature'), tag_path(:name => t('aspects.index.help.tag_feature'))))
     %p
       != t('aspects.index.help.tutorials_and_wiki',
            :faq => link_to(t('_help'), help_path),
@@ -75,8 +75,8 @@
       %h5.title-header
         = t('aspects.index.donate')
     .content
-      = t('aspects.index.keep_pod_running', :pod => AppConfig.pod_uri.host)
+      %p
-      %br
+        = t('aspects.index.keep_pod_running', :pod => AppConfig.pod_uri.host)
       = render 'shared/donatepod'
 
 - if AppConfig.admins.podmin_email.present?
@@ -86,10 +86,10 @@
       %h5.title-header
         = t('aspects.index.help.any_problem')
     .content
-      = t('aspects.index.help.contact_podmin')
+      %p
-      %br
+        = t('aspects.index.help.contact_podmin')
-      %br
+      %p
-      = link_to t('aspects.index.help.mail_podmin'), "mailto:#{AppConfig.admins.podmin_email}", :class => "button"
+        = link_to t('aspects.index.help.mail_podmin'), "mailto:#{AppConfig.admins.podmin_email}", :class => "button"
 
 .section
   .title