commit: 25d7c1b6eaf03ddaec892c82f7d93a128b79a872
parent: 34413615683677e26213263fb98f63b5aab64872
Author: Eugen Rochko <eugen@zeonfederated.com>
Date: Mon, 14 Mar 2016 17:41:13 +0100
Customizing the last of doorkeeper views, adding CSS for dashboard forms
Diffstat:
14 files changed, 192 insertions(+), 119 deletions(-)
diff --git a/app/assets/stylesheets/dashboard.scss b/app/assets/stylesheets/dashboard.scss
@@ -4,10 +4,12 @@
margin: 20px auto;
width: 940px;
display: flex;
+ overflow: hidden;
.dashboard__sidebar {
width: 240px;
border-radius: 4px 0 0 4px;
+ flex-shrink: 0;
.dashboard__top-bar {
border-radius: 4px 0 0 0;
@@ -175,8 +177,8 @@
display: inline-block;
border: 0;
background: #2b90d9;
- border-radius: 4px;
- padding: 4px 16px;
+ border-radius: 16px;
+ padding: 6px 16px;
font-size: 12px;
font-weight: 500;
color: #fff;
@@ -187,6 +189,16 @@
&:hover {
background: lighten(#2b90d9, 5%);
}
+
+ &.btn-iconized {
+ font-size: 16px;
+ font-weight: 400;
+ width: 24px;
+ text-align: center;
+ padding: 10px 7px;
+ border-radius: 100px;
+ box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
+ }
}
}
@@ -194,5 +206,110 @@
border-radius: 0 4px 0 0;
}
}
+}
+
+.simple_form {
+ .form-actions {
+ padding-top: 20px;
+ text-align: center;
+ }
+ .input {
+ margin-bottom: 15px;
+
+ label {
+ display: block;
+ text-transform: uppercase;
+ font-size: 11px;
+ font-weight: 500;
+ margin-bottom: 10px;
+ }
+
+ input[type=text], input[type=email], input[type=password], textarea {
+ display: block;
+ box-sizing: border-box;
+ width: 100%;
+ border: 0;
+ background: transparent;
+ border-bottom: 1px solid lighten(#282c37, 55%);
+ padding: 5px 0;
+ outline: 0;
+ padding-bottom: 6px;
+ font-size: 14px;
+ font-family: 'Roboto', sans-serif;
+
+ &:focus {
+ border-bottom: 2px solid #2b90d9;
+ padding-bottom: 5px;
+ }
+ }
+
+ input[type=file] {
+ display: block;
+ }
+ }
+}
+
+.panel {
+ box-sizing: border-box;
+ padding: 10px 15px;
+ background: lighten(#d9e1e8, 5%);
+ margin-bottom: 20px;
+ border-radius: 4px;
+
+ .panel-heading {
+ font-size: 13px;
+ text-transform: uppercase;
+ color: lighten(#282c37, 25%);
+ margin-bottom: 10px;
+ }
+
+ &.panel-full {
+ width: 100%;
+ }
+
+ .panel-row {
+ display: flex;
+
+ dt {
+ color: #282c37;
+ width: 100px;
+ }
+
+ dd {
+ flex: 1;
+ color: lighten(#282c37, 25%);
+ }
+
+ &.panel-row-wider {
+ dt {
+ width: auto;
+ flex: 1;
+ }
+ }
+ }
+}
+
+.row {
+ overflow: hidden;
+ clear: both;
+
+ .panel {
+ float: left;
+ width: 320px;
+ margin-right: 20px;
+
+ &:last-child {
+ margin-right: 0;
+ }
+ }
+}
+
+.page-actions {
+ margin-top: 20px;
+ text-align: right;
+
+ .btn {
+ margin-left: 5px;
+ }
}
diff --git a/app/views/doorkeeper/applications/_delete_form.html.erb b/app/views/doorkeeper/applications/_delete_form.html.erb
@@ -1,5 +0,0 @@
-<%- submit_btn_css ||= 'btn btn-link' %>
-<%= form_tag oauth_application_path(application) do %>
- <input type="hidden" name="_method" value="delete">
- <%= submit_tag t('doorkeeper.applications.buttons.destroy'), onclick: "return confirm('#{ t('doorkeeper.applications.confirmations.destroy') }')", class: submit_btn_css %>
-<% end %>
diff --git a/app/views/doorkeeper/applications/_form.html.erb b/app/views/doorkeeper/applications/_form.html.erb
@@ -1,47 +0,0 @@
-<%= form_for application, url: doorkeeper_submit_path(application), html: {class: 'form-horizontal', role: 'form'} do |f| %>
- <% if application.errors.any? %>
- <div class="alert alert-danger" data-alert><p><%= t('doorkeeper.applications.form.error') %></p></div>
- <% end %>
-
- <%= content_tag :div, class: "form-group#{' has-error' if application.errors[:name].present?}" do %>
- <%= f.label :name, class: 'col-sm-2 control-label' %>
- <div class="col-sm-10">
- <%= f.text_field :name, class: 'form-control' %>
- <%= doorkeeper_errors_for application, :name %>
- </div>
- <% end %>
-
- <%= content_tag :div, class: "form-group#{' has-error' if application.errors[:redirect_uri].present?}" do %>
- <%= f.label :redirect_uri, class: 'col-sm-2 control-label' %>
- <div class="col-sm-10">
- <%= f.text_area :redirect_uri, class: 'form-control' %>
- <%= doorkeeper_errors_for application, :redirect_uri %>
- <span class="help-block">
- <%= t('doorkeeper.applications.help.redirect_uri') %>
- </span>
- <% if Doorkeeper.configuration.native_redirect_uri %>
- <span class="help-block">
- <%= raw t('doorkeeper.applications.help.native_redirect_uri', native_redirect_uri: "<code>#{ Doorkeeper.configuration.native_redirect_uri }</code>") %>
- </span>
- <% end %>
- </div>
- <% end %>
-
- <%= content_tag :div, class: "form-group#{' has-error' if application.errors[:scopes].present?}" do %>
- <%= f.label :scopes, class: 'col-sm-2 control-label' %>
- <div class="col-sm-10">
- <%= f.text_field :scopes, class: 'form-control' %>
- <%= doorkeeper_errors_for application, :scopes %>
- <span class="help-block">
- <%= t('doorkeeper.applications.help.scopes') %>
- </span>
- </div>
- <% end %>
-
- <div class="form-group">
- <div class="col-sm-offset-2 col-sm-10">
- <%= f.submit t('doorkeeper.applications.buttons.submit'), class: "btn btn-primary" %>
- <%= link_to t('doorkeeper.applications.buttons.cancel'), oauth_applications_path, :class => "btn btn-default" %>
- </div>
- </div>
-<% end %>
diff --git a/app/views/doorkeeper/applications/_form.html.haml b/app/views/doorkeeper/applications/_form.html.haml
@@ -0,0 +1,9 @@
+= simple_form_for application, url: doorkeeper_submit_path(application) do |f|
+ = f.error_notification
+
+ .form-inputs
+ = f.input :name
+ = f.input :redirect_uri, hint: t('doorkeeper.applications.help.redirect_uri')
+ = f.input :scopes, hint: t('doorkeeper.applications.help.scopes')
+ .form-actions
+ = f.button :submit, 'Save'
diff --git a/app/views/doorkeeper/applications/edit.html.erb b/app/views/doorkeeper/applications/edit.html.erb
@@ -1,5 +0,0 @@
-<div class="page-header">
- <h1><%= t('.title') %></h1>
-</div>
-
-<%= render 'form', application: @application %>
diff --git a/app/views/doorkeeper/applications/edit.html.haml b/app/views/doorkeeper/applications/edit.html.haml
@@ -0,0 +1,4 @@
+- content_for :page_title do
+ Edit app
+
+= render 'form', application: @application
diff --git a/app/views/doorkeeper/applications/index.html.haml b/app/views/doorkeeper/applications/index.html.haml
@@ -1,13 +1,13 @@
- content_for :page_title do
- Applications
+ Apps
-%p= link_to t('.new'), new_oauth_application_path, class: 'btn btn-success'
+%p= link_to 'Add new', new_oauth_application_path, class: 'btn btn-success'
%table.table
%thead
%tr
- %th= t('.name')
- %th= t('.callback_url')
+ %th App
+ %th Callback URL
%th
%th
%tbody
@@ -15,5 +15,5 @@
%tr
%td= link_to application.name, oauth_application_path(application)
%td= application.redirect_uri
- %td= link_to t('doorkeeper.applications.buttons.edit'), edit_oauth_application_path(application), class: 'btn btn-link'
- %td= render 'delete_form', application: application
+ %td= link_to 'Edit', edit_oauth_application_path(application)
+ %td= link_to 'Delete', oauth_application_path(application), method: :delete, data: { confirm: 'Are you sure?' }
diff --git a/app/views/doorkeeper/applications/new.html.erb b/app/views/doorkeeper/applications/new.html.erb
@@ -1,5 +0,0 @@
-<div class="page-header">
- <h1><%= t('.title') %></h1>
-</div>
-
-<%= render 'form', application: @application %>
diff --git a/app/views/doorkeeper/applications/new.html.haml b/app/views/doorkeeper/applications/new.html.haml
@@ -0,0 +1,4 @@
+- content_for :page_title do
+ New app
+
+= render 'form', application: @application
diff --git a/app/views/doorkeeper/applications/show.html.erb b/app/views/doorkeeper/applications/show.html.erb
@@ -1,39 +0,0 @@
-<div class="page-header">
- <h1><%= t('.title', name: @application.name) %></h1>
-</div>
-
-<div class="row">
- <div class="col-md-8">
- <h4><%= t('.application_id') %>:</h4>
- <p><code id="application_id"><%= @application.uid %></code></p>
-
- <h4><%= t('.secret') %>:</h4>
- <p><code id="secret"><%= @application.secret %></code></p>
-
- <h4><%= t('.scopes') %>:</h4>
- <p><code id="scopes"><%= @application.scopes %></code></p>
-
- <h4><%= t('.callback_urls') %>:</h4>
-
- <table>
- <% @application.redirect_uri.split.each do |uri| %>
- <tr>
- <td>
- <code><%= uri %></code>
- </td>
- <td>
- <%= link_to t('doorkeeper.applications.buttons.authorize'), oauth_authorization_path(client_id: @application.uid, redirect_uri: uri, response_type: 'code'), class: 'btn btn-success', target: '_blank' %>
- </td>
- </tr>
- <% end %>
- </table>
- </div>
-
- <div class="col-md-4">
- <h3><%= t('.actions') %></h3>
-
- <p><%= link_to t('doorkeeper.applications.buttons.edit'), edit_oauth_application_path(@application), class: 'btn btn-primary' %></p>
-
- <p><%= render 'delete_form', application: @application, submit_btn_css: 'btn btn-danger' %></p>
- </div>
-</div>
diff --git a/app/views/doorkeeper/applications/show.html.haml b/app/views/doorkeeper/applications/show.html.haml
@@ -0,0 +1,35 @@
+- content_for :page_title do
+ = @application.name
+
+.row
+ .panel
+ .panel-heading General
+ .panel-row
+ %dt Name
+ %dd= @application.name
+ .panel-row
+ %dt Scopes:
+ %dd= @application.scopes
+
+.panel.panel-full
+ .panel-heading Details
+ .panel-row
+ %dt Client ID:
+ %dd
+ %samp= @application.uid
+ .panel-row
+ %dt Secret:
+ %dd
+ %samp= @application.secret
+
+.panel.panel-full
+ .panel-heading Callback URLs
+ - @application.redirect_uri.split.each do |uri|
+ .panel-row.panel-row-wider
+ %dt
+ %samp= uri
+ %dd= link_to 'Authorize', oauth_authorization_path(client_id: @application.uid, redirect_uri: uri, response_type: 'code')
+
+.page-actions
+ = link_to fa_icon('edit'), edit_oauth_application_path(@application), class: 'btn btn-iconized'
+ = link_to fa_icon('trash'), oauth_application_path(@application), method: :delete, class: 'btn btn-iconized', data: { confirm: 'Are you sure?' }
diff --git a/app/views/doorkeeper/authorized_applications/_delete_form.html.haml b/app/views/doorkeeper/authorized_applications/_delete_form.html.haml
@@ -1,3 +0,0 @@
-= form_tag oauth_authorized_application_path(application) do
- %input{type: "hidden", name: "_method", value: "delete"}
- = submit_tag 'Revoke', class: 'btn'
diff --git a/app/views/doorkeeper/authorized_applications/index.html.haml b/app/views/doorkeeper/authorized_applications/index.html.haml
@@ -8,9 +8,9 @@
%table.table
%thead
%tr
- %th= t('doorkeeper.authorized_applications.index.application')
+ %th App
%th
- @applications.each do |application|
%tr
%td= application.name
- %td= render 'delete_form', application: application
+ %td= link_to 'Revoke', oauth_authorized_application_path(application), method: :delete
diff --git a/app/views/settings/show.html.haml b/app/views/settings/show.html.haml
@@ -1,6 +1,14 @@
+- content_for :page_title do
+ Edit profile
+
= simple_form_for @account, url: settings_path, method: :put do |f|
- = f.input :display_name
- = f.input :note
- = f.input :avatar
- = f.input :header
- = f.button :submit
+ = f.error_notification
+
+ .form-inputs
+ = f.input :display_name
+ = f.input :note
+ = f.input :avatar
+ = f.input :header
+
+ .form-actions
+ = f.button :submit, 'Save changes'
