]> cat aescling's git repositories - mastodon.git/commitdiff
Update settings to re-use admin layout, one big navigation tree, improve settings...
authorEugen Rochko <eugen@zeonfederated.com>
Sat, 28 Jan 2017 02:56:10 +0000 (03:56 +0100)
committerEugen Rochko <eugen@zeonfederated.com>
Sat, 28 Jan 2017 02:56:10 +0000 (03:56 +0100)
22 files changed:
app/assets/stylesheets/about.scss
app/assets/stylesheets/admin.scss
app/assets/stylesheets/application.scss
app/assets/stylesheets/forms.scss
app/controllers/auth/registrations_controller.rb
app/controllers/settings/preferences_controller.rb
app/controllers/settings/profiles_controller.rb
app/controllers/settings/two_factor_auths_controller.rb
app/views/admin/accounts/index.html.haml
app/views/admin/accounts/show.html.haml
app/views/auth/registrations/edit.html.haml
app/views/layouts/admin.html.haml
app/views/layouts/application.html.haml
app/views/settings/preferences/show.html.haml
app/views/settings/profiles/show.html.haml
app/views/settings/two_factor_auths/show.html.haml
config/application.rb
config/i18n-tasks.yml
config/initializers/simple_form.rb
config/locales/en.yml
config/locales/simple_form.en.yml
config/navigation.rb

index b7d903ddf90feb1b9f2d97e405d09c23bf164e15..f29090f1a4f1b17498318d943096f0bb6783fba9 100644 (file)
@@ -12,7 +12,7 @@
   }
 
   h1 {
-    font: 46px/52px -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+    font: 46px/52px 'Roboto', sans-serif;
     font-weight: 600;
     margin-bottom: 20px;
     color: $color4;
index 8d01ac4c4eec239520c764cc1d83ad11806d7bde..8de42d6808c1a8428706bac6ab4962183a52838a 100644 (file)
@@ -1,16 +1,20 @@
 .admin-wrapper {
-  width: 100%;
+  display: flex;
+  justify-content: center;
   height: 100%;
-  position: fixed;
-  background: darken($color1, 2%);
-  overflow-y: scroll;
+
+  .sidebar-wrapper {
+    flex: 1;
+    height: 100%;
+    background: $color1;
+    display: flex;
+    justify-content: flex-end;
+  }
 
   .sidebar {
     width: 240px;
-    position: fixed;
-    left: 0;
     height: 100%;
-    background: $color1;
+    padding: 20px 0;
 
     .logo {
       display: block;
@@ -21,6 +25,8 @@
 
     ul {
       list-style: none;
+      border-radius: 4px 0 0 4px;
+      overflow: hidden;
 
       a {
         display: block;
@@ -28,6 +34,7 @@
         color: rgba($color5, 0.7);
         text-decoration: none;
         transition: all 200ms linear;
+        border-radius: 4px 0 0 4px;
 
         i.fa {
           margin-right: 5px;
         }
 
         &.selected {
-          color: $color5;
-          background-color: $color4;
+          background: darken($color1, 2%);
+          border-radius: 4px 0 0 0;
+        }
+      }
+
+      ul {
+        background: darken($color1, 4%);
+        border-radius: 0 0 0 4px;
+
+        a {
+          border: 0;
 
-          &:hover {
-            background-color: lighten($color4, 5%);
+          &.selected {
+            color: $color5;
+            background-color: $color4;
+            border-bottom: 0;
+            border-radius: 0;
+
+            &:hover {
+              background-color: lighten($color4, 5%);
+            }
           }
         }
       }
     }
   }
 
+  .content-wrapper {
+    flex: 2;
+  }
+
   .content {
-    margin-left: 240px;
-    padding: 15px;
+    max-width: 700px;
+    padding: 20px 15px;
+    padding-top: 60px;
+    padding-left: 25px;
+
+    h2 {
+      color: $color2;
+      font-size: 24px;
+      line-height: 28px;
+      font-weight: 400;
+      margin-bottom: 40px;
+    }
+
+    p {
+      font-size: 14px;
+      line-height: 18px;
+      color: $color2;
+      margin-bottom: 20px;
+
+      strong {
+        color: $color5;
+        font-weight: 500;
+      }
+    }
+  }
+
+  .simple_form {
+    max-width: 400px;
   }
 }
 
 .filters {
   display: flex;
   margin-bottom: 20px;
-  padding-left: 8px;
 
   .filter-subset {
     flex: 0 0 auto;
index 0bdff6186f3ae3421a225e39165ea42f3cb3b6a2..c4c876e30e4a07f652f24b0c02ca90adf2befc99 100644 (file)
@@ -115,6 +115,7 @@ body {
     width: 100%;
     height: 100%;
     padding: 0;
+    background: $color1;
   }
 
   &.embed {
@@ -129,6 +130,14 @@ body {
     }
   }
 
+  &.admin {
+    background: darken($color1, 4%);
+    position: fixed;
+    width: 100%;
+    height: 100%;
+    padding: 0;
+  }
+
   @media screen and (max-width: 360px) {
     padding-bottom: 0;
   }
index 560388f8fa9239732d665395374a4487734ec6df..a97a767e097f3f211b6be93c2e4c26e7d5a8cb3e 100644 (file)
@@ -7,18 +7,6 @@ code {
   max-width: 400px;
   padding: 20px;
   margin: 0 auto;
-
-  p {
-    font-size: 14px;
-    line-height: 18px;
-    color: $color2;
-    margin-bottom: 20px;
-
-    strong {
-      color: $color5;
-      font-weight: 500;
-    }
-  }
 }
 
 .simple_form {
@@ -28,28 +16,35 @@ code {
 
   .hint {
     display: block;
-    color: rgba($color5, 0.8);
+    color: $color3;
     font-size: 12px;
+    margin-top: 4px;
+  }
+
+  .label_input {
+    display: flex;
+
+    label {
+      flex: 0 0 auto;
+      width: 100px;
+    }
+
+    input {
+      flex: 1 1 auto;
+    }
   }
 
   .input.file, .input.select {
     padding: 15px 0;
     margin-bottom: 0;
-    display: flex;
 
     label {
       font-family: inherit;
       font-size: 16px;
       color: $color5;
-      width: 100px;
       display: block;
-      flex: 0 0 auto;
       padding-top: 5px;
     }
-
-    input[type=file], select {
-      flex: 1 1 auto;
-    }
   }
 
   .fields-group {
@@ -64,6 +59,7 @@ code {
       font-size: 14px;
       color: white;
       display: block;
+      width: auto;
     }
 
     label.checkbox {
@@ -80,6 +76,7 @@ code {
 
     .hint {
       padding-left: 25px;
+      margin-left: 0;
     }
   }
 
@@ -116,13 +113,19 @@ code {
   }
 
   .input.field_with_errors {
+    label {
+      color: $color6;
+    }
+
     input[type=text], input[type=email], input[type=password] {
       border-bottom-color: $color6;
     }
 
     .error {
+      display: block;
       font-weight: 500;
       color: $color6;
+      margin-top: 4px;
     }
   }
 
index 6ce4984bb31ee9e1d3467c2fafea7c7d81796389..b7d019c2459a9e12fe9fdd0ca267e5857de438f3 100644 (file)
@@ -2,6 +2,7 @@
 
 class Auth::RegistrationsController < Devise::RegistrationsController
   layout 'auth'
+  layout 'admin', only: [:edit]
 
   before_action :check_single_user_mode
   before_action :configure_sign_up_params, only: [:create]
index f273b5f2145ee1d3f6a4e77f72179fad0e32cc16..5ad825675d5a503c236abee5963dbcb30a8b371d 100644 (file)
@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
 class Settings::PreferencesController < ApplicationController
-  layout 'auth'
+  layout 'admin'
 
   before_action :authenticate_user!
 
index 4be549958633113775bcde77d234ae8b2dc9009f..2b74b4e949e43a5f346732ad974cd69993fb7b24 100644 (file)
@@ -3,7 +3,7 @@
 class Settings::ProfilesController < ApplicationController
   include ObfuscateFilename
 
-  layout 'auth'
+  layout 'admin'
 
   before_action :authenticate_user!
   before_action :set_account
index 66a82aab773494368c1e4d20f8bf19ffdec1292f..f34295cb9309cc26954dad5e77c2644c43e28536 100644 (file)
@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
 class Settings::TwoFactorAuthsController < ApplicationController
-  layout 'auth'
+  layout 'admin'
 
   before_action :authenticate_user!
 
index 99c2af576f61cc6d5fbe761011f1d1fc97c65676..a93aa91439415fe00466c8a179fbc69535051be1 100644 (file)
@@ -54,8 +54,8 @@
           - else
             %i.fa.fa-times
         %td
-          = table_link_to 'circle', 'Open in web', web_path("accounts/#{account.id}")
-          = table_link_to 'globe', 'Open public', TagManager.instance.url_for(account)
+          = table_link_to 'circle', 'Web', web_path("accounts/#{account.id}")
+          = table_link_to 'globe', 'Public', TagManager.instance.url_for(account)
           = table_link_to 'pencil', 'Edit', admin_account_path(account.id)
 
 = will_paginate @accounts, pagination_options
index de63dd7f983cddd686a1781957522df3224c7077..7d3f449e5cd18a21cfd264d729deb5054e4662a1 100644 (file)
@@ -1,3 +1,6 @@
+- content_for :page_title do
+  = @account.acct
+
 %table.table
   %tbody
     %tr
index 91e0fe142decc0813f46e7336f367cb8e06b20ba..39b726f9c21190aacd53203558cd2909da920b5e 100644 (file)
@@ -11,5 +11,3 @@
 
   .actions
     = f.button :button, t('generic.save_changes'), type: :submit
-
-.form-footer= render "settings/shared/links"
index 11f76a1deab64c00fe7bdbdf55b73d7a9d339429..750d6036f3f7fee27a531d5ebe6ccd35323d783c 100644 (file)
@@ -1,14 +1,17 @@
 - content_for :header_tags do
   = javascript_include_tag 'application_public'
-  
+
 - content_for :content do
   .admin-wrapper
-    .sidebar
-      = link_to root_path do
-        = image_tag 'logo.png', class: 'logo'
+    .sidebar-wrapper
+      .sidebar
+        = link_to root_path do
+          = image_tag 'logo.png', class: 'logo'
 
-      = render_navigation
-    .content
-      = yield
+        = render_navigation
+    .content-wrapper
+      .content
+        %h2= yield :page_title
+        = yield
 
-= render template: "layouts/application"
+= render template: "layouts/application", locals: { body_classes: 'admin' }
index 5b5239dd55d04ccef959d0fd8e0cca520859286e..e122e1c55fecbac44737ac64a464d9528e616a92 100644 (file)
@@ -20,5 +20,7 @@
 
     = yield :header_tags
 
-  %body{ class: @body_classes }
+  - body_classes ||= @body_classes
+
+  %body{ class: body_classes }
     = content_for?(:content) ? yield(:content) : yield
index a9a1d21acdfcbdcebb4598e2c57378f1826d67c2..747977f9ca45f144fe1c95f91ffe2192944b1509 100644 (file)
@@ -4,14 +4,16 @@
 = simple_form_for current_user, url: settings_preferences_path, html: { method: :put } do |f|
   = render 'shared/error_messages', object: current_user
 
-  = f.input :locale, collection: I18n.available_locales, wrapper: :with_label, include_blank: false, label_method: lambda { |locale| human_locale(locale) }
+  .fields-group
+    = f.input :locale, collection: I18n.available_locales, wrapper: :with_label, include_blank: false, label_method: lambda { |locale| human_locale(locale) }
 
-  = f.simple_fields_for :notification_emails, hash_to_object(current_user.settings.notification_emails) do |ff|
-    = ff.input :follow, as: :boolean, wrapper: :with_label
-    = ff.input :follow_request, as: :boolean, wrapper: :with_label
-    = ff.input :reblog, as: :boolean, wrapper: :with_label
-    = ff.input :favourite, as: :boolean, wrapper: :with_label
-    = ff.input :mention, as: :boolean, wrapper: :with_label
+  .fields-group
+    = f.simple_fields_for :notification_emails, hash_to_object(current_user.settings.notification_emails) do |ff|
+      = ff.input :follow, as: :boolean, wrapper: :with_label
+      = ff.input :follow_request, as: :boolean, wrapper: :with_label
+      = ff.input :reblog, as: :boolean, wrapper: :with_label
+      = ff.input :favourite, as: :boolean, wrapper: :with_label
+      = ff.input :mention, as: :boolean, wrapper: :with_label
 
   = f.simple_fields_for :interactions, hash_to_object(current_user.settings.interactions) do |ff|
     = ff.input :must_be_follower, as: :boolean, wrapper: :with_label
@@ -19,5 +21,3 @@
 
   .actions
     = f.button :button, t('generic.save_changes'), type: :submit
-
-.form-footer= render "settings/shared/links"
index 6bb458aa28c4621facc916d8675e187613025284..b946853b1191c875d37deec40e6fdaa9368a2b1f 100644 (file)
@@ -7,12 +7,10 @@
   .fields-group
     = f.input :display_name, placeholder: t('simple_form.labels.defaults.display_name')
     = f.input :note, placeholder: t('simple_form.labels.defaults.note')
-    = f.input :avatar, wrapper: :with_label
-    = f.input :header, wrapper: :with_label
+    = f.input :avatar, wrapper: :with_label, hint: t('simple_form.hints.defaults.avatar')
+    = f.input :header, wrapper: :with_label, hint: t('simple_form.hints.defaults.header')
 
   = f.input :locked, as: :boolean, wrapper: :with_label, hint: t('simple_form.hints.defaults.locked')
 
   .actions
     = f.button :button, t('generic.save_changes'), type: :submit
-
-.form-footer= render "settings/shared/links"
index 5070bb9d4e67f750e5c00bd34cfe1560c157f87d..bad359f8f995b64e7a8eee2f7a58d679d3a9a49a 100644 (file)
@@ -1,17 +1,13 @@
 - content_for :page_title do
   = t('settings.two_factor_auth')
 
-- if current_user.otp_required_for_login
-  %p= t('two_factor_auth.instructions_html')
+.simple_form
+  - if current_user.otp_required_for_login
+    %p= t('two_factor_auth.instructions_html')
 
-  .qr-code= raw @qrcode.as_svg(padding: 0, module_size: 5)
+    .qr-code= raw @qrcode.as_svg(padding: 0, module_size: 5)
 
-  .simple_form
     = link_to t('two_factor_auth.disable'), disable_settings_two_factor_auth_path, data: { method: 'POST' }, class: 'block-button'
-- else
-  %p= t('two_factor_auth.description_html')
-
-  .simple_form
+  - else
+    %p= t('two_factor_auth.description_html')
     = link_to t('two_factor_auth.enable'), enable_settings_two_factor_auth_path, data: { method: 'POST' }, class: 'block-button'
-
-.form-footer= render "settings/shared/links"
index e561d04738e91a59baf0550872be55d7a2a3c23d..d44835957475203cecc0a83dcb6e43513ad36872 100644 (file)
@@ -46,6 +46,7 @@ module Mastodon
 
     config.to_prepare do
       Doorkeeper::AuthorizationsController.layout 'public'
+      Doorkeeper::AuthorizedApplicationsController.layout 'admin'
       Doorkeeper::Application.send :include, ApplicationExtension
     end
 
index e7206384471492e95abbc794bb28cad0390224e0..4304bbd180741435e4d5754d7b753bc05191ee99 100644 (file)
@@ -18,6 +18,7 @@ data:
 search:
   paths:
    - app/
+   - config/navigation.rb
 
   relative_roots:
     - app/controllers
index 065999d0b8a4b909d0f277228f7e61b8ca4fce00..60bbcb778580a44d2fde1635f86c9c061209df8d 100644 (file)
@@ -52,7 +52,7 @@ SimpleForm.setup do |config|
 
   config.wrappers :with_label, class: :input, hint_class: :field_with_hint, error_class: :field_with_errors do |b|
     b.use :html5
-    b.use :label_input
+    b.use :label_input, wrap_with: { tag: :div, class: :label_input }
     b.use :hint,  wrap_with: { tag: :span, class: :hint }
     b.use :error, wrap_with: { tag: :span, class: :error }
   end
index 4f02a87e287ce0a2954b20753bda0d508a05544d..941fe5b3f95e809e8d7cc9abd4438058630703ff 100644 (file)
@@ -31,10 +31,11 @@ en:
   applications:
     invalid_url: The provided URL is invalid
   auth:
-    change_password: Change password
+    change_password: Credentials
     didnt_get_confirmation: Didn't receive confirmation instructions?
     forgot_password: Forgot your password?
     login: Log in
+    logout: Logout
     register: Sign up
     resend_confirmation: Resend confirmation instructions
     reset_password: Reset password
@@ -93,6 +94,7 @@ en:
     back: Back to Mastodon
     edit_profile: Edit profile
     preferences: Preferences
+    settings: Settings
     two_factor_auth: Two-factor Authentication
   statuses:
     over_character_limit: character limit of %{max} exceeded
index e45a9a7a6e56a6a74a31825eee38ade64de27c9b..5ef4a18fa9f565af4932a201df693131fc8eae58 100644 (file)
@@ -3,7 +3,11 @@ en:
   simple_form:
     hints:
       defaults:
+        avatar: PNG, GIF or JPG. At most 2MB. Will be downscaled to 120x120px
+        display_name: At most 30 characters
+        header: PNG, GIF or JPG. At most 2MB. Will be downscaled to 700x335px
         locked: Requires you to manually approve followers and defaults post privacy to followers-only
+        note: At most 160 characters
     labels:
       defaults:
         avatar: Avatar
index 9aaa12b0b75de644ca6bf2cadc2f132b581c85cd..b2930f62fea0ede1b0784af1b4a6525ec8a9ec32 100644 (file)
@@ -2,11 +2,25 @@
 
 SimpleNavigation::Configuration.run do |navigation|
   navigation.items do |primary|
-    primary.item :accounts, safe_join([fa_icon('users fw'), 'Accounts']), admin_accounts_url
-    primary.item :pubsubhubbubs, safe_join([fa_icon('paper-plane-o fw'), 'PubSubHubbub']), admin_pubsubhubbub_index_url
-    primary.item :domain_blocks, safe_join([fa_icon('lock fw'), 'Domain Blocks']), admin_domain_blocks_url
-    primary.item :sidekiq, safe_join([fa_icon('diamond fw'), 'Sidekiq']), sidekiq_url
-    primary.item :pghero, safe_join([fa_icon('database fw'), 'PgHero']), pghero_url
-    primary.item :settings, safe_join([fa_icon('cogs fw'), 'Site Settings']), admin_settings_url
+    primary.item :web, safe_join([fa_icon('chevron-left fw'), t('settings.back')]), root_url
+
+    primary.item :settings, safe_join([fa_icon('cog fw'), t('settings.settings')]), settings_profile_url do |settings|
+      settings.item :profile, safe_join([fa_icon('user fw'), t('settings.edit_profile')]), settings_profile_url
+      settings.item :preferences, safe_join([fa_icon('sliders fw'), t('settings.preferences')]), settings_preferences_url
+      settings.item :password, safe_join([fa_icon('cog fw'), t('auth.change_password')]), edit_user_registration_url
+      settings.item :two_factor_auth, safe_join([fa_icon('mobile fw'), t('settings.two_factor_auth')]), settings_two_factor_auth_url
+      # settings.item :authorized_apps, safe_join([fa_icon('list fw'), 'Authorized Apps']), oauth_authorized_applications_url
+    end
+
+    primary.item :admin, safe_join([fa_icon('cogs fw'), 'Administration']), admin_accounts_url, if: proc { current_user.admin? } do |admin|
+      admin.item :accounts, safe_join([fa_icon('users fw'), 'Accounts']), admin_accounts_url, highlights_on: %r{/admin/accounts}
+      admin.item :pubsubhubbubs, safe_join([fa_icon('paper-plane-o fw'), 'PubSubHubbub']), admin_pubsubhubbub_index_url
+      admin.item :domain_blocks, safe_join([fa_icon('lock fw'), 'Domain Blocks']), admin_domain_blocks_url
+      admin.item :sidekiq, safe_join([fa_icon('diamond fw'), 'Sidekiq']), sidekiq_url
+      admin.item :pghero, safe_join([fa_icon('database fw'), 'PgHero']), pghero_url
+      admin.item :settings, safe_join([fa_icon('cogs fw'), 'Site Settings']), admin_settings_url
+    end
+
+    primary.item :logout, safe_join([fa_icon('sign-out fw'), t('auth.logout')]), destroy_user_session_url, link_html: { 'data-method' => 'delete' }
   end
 end