Improved style of settings page

feature/8296-invite_api
Eugen Rochko 6 years ago
parent e9bc4a4a08
commit 693383234c
  1. 4
      app/assets/javascripts/components/features/account/components/action_bar.jsx
  2. 19
      app/assets/stylesheets/application.scss
  3. 2
      app/controllers/settings_controller.rb
  4. 23
      app/views/settings/show.html.haml

@ -34,8 +34,8 @@ const ActionBar = React.createClass({
}
return (
<div style={{ borderTop: '1px solid #363c4b', borderBottom: '1px solid #363c4b', padding: '10px', lineHeight: '36px' }}>
{actionButton} <span style={{ color: '#616b86', fontWeight: '500', textTransform: 'uppercase' }}>{infoText}</span>
<div style={{ borderTop: '1px solid #363c4b', borderBottom: '1px solid #363c4b', padding: '10px', lineHeight: '36px', overflow: 'hidden', flex: '0 0 auto' }}>
{actionButton} <span style={{ color: '#616b86', fontWeight: '500', textTransform: 'uppercase', float: 'right', display: 'block' }}>{infoText}</span>
</div>
);
},

@ -127,7 +127,23 @@ body {
margin-bottom: 15px;
}
input[type=text], input[type=email], input[type=password] {
.file-field {
padding: 15px 0;
label {
font-family: 'Roboto';
font-size: 16px;
color: #fff;
width: 100px;
display: inline-block;
}
input[type=file] {
width: 280px;
}
}
input[type=text], input[type=email], input[type=password], textarea {
background: transparent;
border: 0;
border-bottom: 2px solid #9baec8;
@ -137,6 +153,7 @@ body {
display: block;
width: 100%;
outline: 0;
font-family: 'Roboto';
&:invalid {
box-shadow: none;

@ -1,4 +1,6 @@
class SettingsController < ApplicationController
layout 'auth'
before_action :authenticate_user!
before_action :set_account

@ -1,14 +1,17 @@
- content_for :page_title do
Edit profile
= simple_form_for @account, url: settings_path, method: :put do |f|
= f.error_notification
= form_for @account, url: settings_path, html: { method: :put } do |f|
.field
= f.text_field :display_name, placeholder: 'Display name'
.field
= f.text_area :note, placeholder: 'Bio'
.file-field
= f.label :avatar
= f.file_field :avatar
.file-field
= f.label :header
= f.file_field :header
.form-inputs
= f.input :display_name
= f.input :note
= f.input :avatar
= f.input :header
.form-actions
= f.button :submit, 'Save changes'
.actions
= f.button 'Save changes', type: :submit

Loading…
Cancel
Save