Customizing the last of doorkeeper views, adding CSS for dashboard forms
Eugen Rochko
parent
3441361568
commit
25d7c1b6ea
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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 %>
|
||||
|
|
@ -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 %>
|
||||
|
|
@ -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'
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
<div class="page-header">
|
||||
<h1><%= t('.title') %></h1>
|
||||
</div>
|
||||
|
||||
<%= render 'form', application: @application %>
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
- content_for :page_title do
|
||||
Edit app
|
||||
|
||||
= render 'form', application: @application
|
||||
|
|
@ -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?' }
|
||||
|
|
|
|||
|
|
@ -1,5 +0,0 @@
|
|||
<div class="page-header">
|
||||
<h1><%= t('.title') %></h1>
|
||||
</div>
|
||||
|
||||
<%= render 'form', application: @application %>
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
- content_for :page_title do
|
||||
New app
|
||||
|
||||
= render 'form', application: @application
|
||||
|
|
@ -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>
|
||||
|
|
@ -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?' }
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
= form_tag oauth_authorized_application_path(application) do
|
||||
%input{type: "hidden", name: "_method", value: "delete"}
|
||||
= submit_tag 'Revoke', class: 'btn'
|
||||
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -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'
|
||||
|
|
|
|||
Reference in New Issue