Merge branch 'svbergerem-unify-ui' into develop

.scss-lint.yml

@@ -35,7 +35,7 @@ linters:
     enabled: true
 
   DisableLinterReason:
-    enabled: false
+    enabled: true
 
   DuplicateProperty:
     enabled: true

Changelog.md

@@ -80,6 +80,7 @@ Contributions are very welcome, the hard work is done!
 * Replace sidetiq with sidekiq-cron [#6616](https://github.com/diaspora/diaspora/pull/6616)
 * Refactor mobile comment section [#6509](https://github.com/diaspora/diaspora/pull/6509)
 * Set vertical resize as default for all textareas [#6654](https://github.com/diaspora/diaspora/pull/6654)
+* Unifiy max-widths and page layouts [#6675](https://github.com/diaspora/diaspora/pull/6675)
 
 ## Bug fixes
 * Destroy Participation when removing interactions with a post [#5852](https://github.com/diaspora/diaspora/pull/5852)

app/assets/stylesheets/base.scss

@@ -3,6 +3,13 @@ body {
   padding: none;
 }
 
+.container-fluid { max-width: $screen-lg-min; }
+
+.page-streams,
+.page-tags.action-show {
+  > .container-fluid { max-width: 100%; }
+}
+
 // Overflow
 h1,
 h2,

app/assets/stylesheets/conversations.scss

@@ -191,11 +191,12 @@
   }
 }
 
-@media (max-width: 1354px) {
+// We need this to override the Bootstrap pagination style only for the conversations view
-  #left_pane #conversation_inbox .pagination ul > li > a {
+// scss-lint:disable SelectorDepth
-    padding: 4px 7px;
+.conversation-inbox .pagination > li > a {
-  }
+  padding: 4px 7px;
 }
+// scss-lint:enable SelectorDepth
 
 #new_conversation_pane {
   ul.as-selections { width: 100% !important; }

app/assets/stylesheets/header.scss

@@ -9,7 +9,6 @@
   }
 
   @media (max-width: $grid-float-breakpoint-max) {
-    .col-lg-10 { padding: 0; }
     .navbar-header > .nav li { display: inline-block !important; }
     .nav-badge {
       color: $navbar-inverse-link-color;

app/assets/templates/header_tpl.jst.hbs

@@ -1,7 +1,7 @@
 <nav class="navbar navbar-inverse navbar-fixed-top">
   <div class="container-fluid">
     <div class="row">
-      <div class="col-lg-10 col-lg-offset-1">
+      <div class="col-md-12">
         <div class="navbar-header">
           <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target="#navbar-collapse">
             <span class="sr-only">{{t "header.toggle_navigation"}}</span>

app/views/api/openid_connect/user_applications/index.html.haml

@@ -3,10 +3,9 @@
 
 .container-fluid.applications-page
   .row
-    .col-lg-10.col-lg-offset-1
+    .col-md-3
       = render "shared/settings_nav"
-  .row
+    .col-md-9
-    .col-lg-8.col-lg-offset-2
       %h3= t(".title")
       .row
         .col-md-12

app/views/api/openid_connect/user_applications/index.mobile.haml

@@ -1,6 +1,6 @@
 .container-fluid.settings_container.applications-page
   .row
-    .col-lg-10.col-lg-offset-1
+    .col-md-12
       - content_for :page_title do
         = t(".edit_applications")
       = render "shared/settings_nav"

app/views/conversations/index.haml

@@ -14,7 +14,7 @@
               = link_to t('.new_conversation'), conversations_path, class: 'btn btn-default'
             = t('.inbox')
 
-        #conversation_inbox
+        .conversation-inbox#conversation_inbox
           .stream.conversations
             - if @visibilities.count > 0
               = render partial: "conversations/conversation", collection: @visibilities, as: :visibility
@@ -34,9 +34,8 @@
       - else
         .stream_container.hidden
           #conversation_show
-        .row#conversation_new
+        #conversation_new
-          .col-md-10.col-md-offset-1
+          .new-conversation
-            .new-conversation
+            %h3.text-center
-              %h3.text-center
+              = t("conversations.index.new_conversation")
-                = t("conversations.index.new_conversation")
+            = render "conversations/new"
-              = render "conversations/new"

app/views/layouts/_header.html.haml

@@ -8,7 +8,7 @@
       %nav.navbar.navbar-inverse.navbar-fixed-top
         .container-fluid
           .row
-            .col-lg-10.col-lg-offset-1
+            .col-md-12
               .navbar-header
                 %button.navbar-toggle.collapsed{type: "button", data: {toggle: "collapse", target: "#navbar-collapse"}}
                   %span.sr-only

app/views/profiles/edit.haml

@@ -4,11 +4,9 @@
 
 .container-fluid
   .row
-    .col-lg-10.col-lg-offset-1
+    .col-md-3
       = render "shared/settings_nav"
-
+    .col-md-9
-  .row
-    .col-lg-8.col-lg-offset-2
       - content_for :submit_block do
         = link_to t("cancel"), local_or_remote_person_path(current_user.person), class: "btn btn-default"
         = submit_tag t(".update_profile"), class: "btn btn-primary pull-right", id: "update_profile"

app/views/profiles/edit.mobile.haml

@@ -4,11 +4,11 @@
 
 .settings_container.container-fluid
   .row
-    .col-lg-10.col-lg-offset-1
+    .col-md-12
       = render "shared/settings_nav"
 
   .row
-    .col-lg-8.col-lg-offset-2
+    .col-md-12
       - content_for :submit_block do
         = link_to t("cancel"), local_or_remote_person_path(current_user.person), class: "btn btn-default"
         = submit_tag t(".update_profile"), class: "btn btn-primary pull-right", id: "update_profile"

app/views/services/index.html.haml

@@ -7,16 +7,15 @@
 
 .container-fluid
   .row
-    .col-lg-10.col-lg-offset-1
+    .col-md-3
       = render "shared/settings_nav"
-
+    .col-md-9
-  .row
-    .col-lg-8.col-lg-offset-2
       %h3= t(".title")
-  .row
+      .row
-    .col-md-7.col-lg-5.col-lg-offset-2
+        .col-md-12
-      = render "add_remove_services"
+          = render "add_remove_services"
 
-    .col-md-5.col-lg-3
+      .row
-      %p
+        .col-md-12
-        = t(".services_explanation")
+          %p
+            = t(".services_explanation")

app/views/services/index.mobile.haml

@@ -7,14 +7,14 @@
 
 .settings_container.services_page.container-fluid
   .row
-    .col-lg-10.col-lg-offset-1
+    .col-md-12
       = render "shared/settings_nav"
 
   .row
-    .col-lg-8.col-lg-offset-2
+    .col-md-12
       = render "add_remove_services"
 
   .row
-    .col-lg-8.col-lg-offset-2
+    .col-md-12
       .services_explanation
         = t(".services_explanation")

app/views/shared/_settings_nav.haml

@@ -1,10 +1,14 @@
 #section_header
   %h2
     = t("settings")
-  %ul.nav.nav-tabs#settings_nav
+  .list-group#settings_nav
-    %li{class: current_page?(edit_profile_path) && "active"}= link_to t("profile"), edit_profile_path
+    = link_to t("profile"), edit_profile_path,
-    %li{class: current_page?(edit_user_path) && "active"}= link_to t("account"), edit_user_path
+      class: current_page?(edit_profile_path) ? "list-group-item active" : "list-group-item"
-    %li{class: current_page?(privacy_settings_path) && "active"}= link_to t("privacy"), privacy_settings_path
+    = link_to t("account"), edit_user_path,
-    %li{class: current_page?(services_path) && "active"}= link_to t("_services"), services_path
+      class: current_page?(edit_user_path) ? "list-group-item active" : "list-group-item"
-    %li{class: current_page?(api_openid_connect_user_applications_path) && "active"}
+    = link_to t("privacy"), privacy_settings_path,
-      = link_to t("_applications"), api_openid_connect_user_applications_path
+      class: current_page?(privacy_settings_path) ? "list-group-item active" : "list-group-item"
+    = link_to t("_services"), services_path,
+      class: current_page?(services_path) ? "list-group-item active" : "list-group-item"
+    = link_to t("_applications"), api_openid_connect_user_applications_path,
+      class: current_page?(api_openid_connect_user_applications_path) ? "list-group-item active" : "list-group-item"

app/views/users/_edit.haml

@@ -6,11 +6,7 @@
   = t(".edit_account")
 
 .row
-  .col-lg-10.col-lg-offset-1
+  .col-md-12
-    = render "shared/settings_nav"
-
-.row
-  .col-lg-8.col-lg-offset-2
     .row
       .col-md-6
         %h3= t(".your_handle")
@@ -173,42 +169,40 @@
     %hr
 
     .row
-      .col-lg-7#account_data
+      .col-md-6#account_data
-        .row
+        %h3= t(".export_data")
-          .col-md-6
+        .form-group
-            %h3= t(".export_data")
+          - if current_user.exporting
-            .form-group
+            .export-in-progress= t(".export_in_progress")
-              - if current_user.exporting
+          - elsif current_user.export.present?
-                .export-in-progress= t(".export_in_progress")
+            = link_to t(".request_export_update"), export_profile_user_path, method: :post,
-              - elsif current_user.export.present?
+              class: "btn btn-default"
-                = link_to t(".request_export_update"), export_profile_user_path, method: :post,
+            .small-horizontal-spacer
-                  class: "btn btn-default btn-block"
+            = link_to t(".download_export"), download_profile_user_path,
-                .small-horizontal-spacer
+              class: "btn btn-success"
-                = link_to t(".download_export"), download_profile_user_path,
+            .small-horizontal-spacer
-                  class: "btn btn-success btn-block"
+            %h6
-                .small-horizontal-spacer
+              = t(".last_exported_at", timestamp: current_user.exported_at)
-                %h6
+          - else
-                  = t(".last_exported_at", timestamp: current_user.exported_at)
+            = link_to t(".request_export"), export_profile_user_path, method: :post,
-              - else
+              class: "btn btn-default"
-                = link_to t(".request_export"), export_profile_user_path, method: :post,
-                  class: "btn btn-default btn-block"
 
-            .form-group
+        .form-group
-              - if current_user.exporting_photos
+          - if current_user.exporting_photos
-                .export-in-progress= t(".export_photos_in_progress")
+            .export-in-progress= t(".export_photos_in_progress")
-              - elsif current_user.exported_photos_file.present?
+          - elsif current_user.exported_photos_file.present?
-                = link_to t(".request_export_photos_update"), export_photos_user_path, method: :post,
+            = link_to t(".request_export_photos_update"), export_photos_user_path, method: :post,
-                  class: "btn btn-default btn-block"
+              class: "btn btn-default"
-                .small-horizontal-spacer
+            .small-horizontal-spacer
-                = link_to t(".download_export_photos"), download_photos_user_path, class: "btn btn-success btn-block"
+            = link_to t(".download_export_photos"), download_photos_user_path, class: "btn btn-success"
-                .small-horizontal-spacer
+            .small-horizontal-spacer
-                %h6
+            %h6
-                  = t(".last_exported_at", timestamp: current_user.exported_photos_at)
+              = t(".last_exported_at", timestamp: current_user.exported_photos_at)
-              - else
+          - else
-                = link_to t(".request_export_photos"), export_photos_user_path, method: :post,
+            = link_to t(".request_export_photos"), export_photos_user_path, method: :post,
-                  class: "btn btn-default btn-block"
+              class: "btn btn-default"
 
-      .col-lg-5
+      .col-md-6
         %h3
           = t(".close_account_text")
         .form-group

app/views/users/_privacy_settings.haml

@@ -1,34 +1,28 @@
 .row
-  .col-lg-10.col-lg-offset-1
+  .col-md-12
-    = render "shared/settings_nav"
+    %h3
+      = t(".title")
+
+    = form_for current_user, url: user_path, html: {method: :put} do |f|
+      = f.error_messages
+
+      = f.fields_for :stream_preferences do
+        .checkbox#stream_prefs
+          = f.label :strip_exif do
+            = f.check_box :strip_exif
+            = t(".strip_exif")
+          = f.submit t("users.edit.change"), class: "btn btn-primary pull-right"
+%hr
 
 .row
-  .col-lg-8.col-lg-offset-2
+  .col-md-12
-    .row
+    %h3
-      .col-md-12
+      = t(".ignored_users")
-        %h3
-          = t(".title")
 
-        = form_for current_user, url: user_path, html: {method: :put} do |f|
+    - if @blocks.length.zero?
-          = f.error_messages
+      %p
-
+        = t(".no_user_ignored_message")
-          = f.fields_for :stream_preferences do
+    - else
-            .checkbox#stream_prefs
+      #blocked_people
-              = f.label :strip_exif do
+        - @blocks.each do |block|
-                = f.check_box :strip_exif
+          = render partial: "blocked_person", locals: {block: block, person: block.person}
-                = t(".strip_exif")
-              = f.submit t("users.edit.change"), class: "btn btn-primary pull-right"
-    %hr
-
-    .row
-      .col-md-12
-        %h3
-          = t(".ignored_users")
-
-        - if @blocks.length.zero?
-          %p
-            = t(".no_user_ignored_message")
-        - else
-          #blocked_people
-            - @blocks.each do |block|
-              = render partial: "blocked_person", locals: {block: block, person: block.person}

app/views/users/edit.html.haml

@@ -1,2 +1,6 @@
 .container-fluid
-  = render "edit"
+  .row
+    .col-md-3
+      = render "shared/settings_nav"
+    .col-md-9
+      = render "edit"

app/views/users/edit.mobile.haml

@@ -1,2 +1,8 @@
 .settings_container.container-fluid
-  = render "edit"
+  .row
+    .col-md-12
+      = render "shared/settings_nav"
+
+  .row
+    .col-md-12
+      = render "edit"

app/views/users/privacy_settings.html.haml

@@ -6,4 +6,8 @@
   = t('.title')
 
 .container-fluid
-  = render "privacy_settings"
+  .row
+    .col-md-3
+      = render "shared/settings_nav"
+    .col-md-9
+      = render "privacy_settings"

app/views/users/privacy_settings.mobile.haml

@@ -6,4 +6,10 @@
   = t(".title")
 
 .settings_container.container-fluid
-  = render "privacy_settings"
+  .row
+    .col-md-12
+      = render "shared/settings_nav"
+
+  .row
+    .col-md-12
+      = render "privacy_settings"