Skip to content

Commit

Permalink
Merge pull request #62 from hisea/bootstrap4
Browse files Browse the repository at this point in the history
Bootstrap 4
  • Loading branch information
dankimio authored Aug 19, 2018
2 parents 77974f5 + 720c733 commit df2b4b1
Show file tree
Hide file tree
Showing 21 changed files with 206 additions and 245 deletions.
31 changes: 10 additions & 21 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,22 +1,11 @@
/.bundle/
/.yardoc
/Gemfile.lock
/_yardoc/
/coverage/
/doc/
/pkg/
/spec/reports/
/tmp/

*.gem
*.rbc
.bundle
.config
.yardoc
Gemfile.lock
InstalledFiles
_yardoc
coverage
doc/
lib/bundler/man
pkg
rdoc
spec/reports
test/tmp
test/version_tmp
tmp
*.bundle
*.so
*.o
*.a
mkmf.log
58 changes: 24 additions & 34 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,70 +2,60 @@

Here are some of the highlights:

* Devise views with Bootstrap 3.
* Used Bootstrap responsive columns.
* I18n Support.
- Devise views with Bootstrap 4
- Used Bootstrap responsive columns
- I18n Support

***WARNING***

WARNING:
This gem copies lots of its code from [devise-i18n-views](https://github.com/mcasimir/devise-i18n-views) gem.

## Screenshot

![Screenshot](https://raw.githubusercontent.com/hisea/devise-bootstrap-views/master/Screenshot.png)

## Installation

Add these lines in the head tag of your application.html.erb:
Make sure Bootstrap 4 is installed, either as a Ruby gem or using CDN:

```html
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
```

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.css">

Add this line to your application's Gemfile:

gem 'devise-bootstrap-views'
```ruby
gem 'devise-bootstrap-views', '~> 1.0'
```

And then execute:

$ bundle

Add some minor css fix to your rails asset pipeline manifest

# SASS
*= require devise_bootstrap_views

# LESS
*= require devise_bootstrap_views_less

Then you need to install the required translations in your `config/locales`. The [devise-i18n-views](https://github.com/mcasimir/devise-i18n-views) project is no longer maintained after being merged into [devise-i18n](https://github.com/tigrish/devise-i18n), which is currently the best source for updated Devise translations. You can manually download locale dictionaries from [devise-i18n/rails/locales](https://github.com/tigrish/devise-i18n/tree/master/rails/locales) or generate them by running `devise:views:locale <chosen_locale>`:
Then you can install the required translations in your `config/locales`. Use [devise-i18n](https://github.com/tigrish/devise-i18n) — the best source for updated Devise translations. You can manually generate locale files by executing `rails generate devise:views:locale <chosen_locale>`:

``` sh
rails g devise:views:locale it
rails generate devise:views:locale de
```

will generate `config/locales/devise.views.it.yml`.
will generate `config/locales/devise.views.de.yml`.

## Customizing Views

The `devise:views:bootstrap_templates` generator will copy all views to your application, so you can modify the files as you wish:

``` sh
rails g devise:views:bootstrap_templates
```

``` sh
rails g devise:views:bootstrap_haml_templates
rails generate devise:views:bootstrap_templates
```

``` sh
rails g devise:views:bootstrap_slim_templates
```
## Remove Devise Bootstrap views

## Remove devise-bootstrap-views
If you would like to remove devise-bootstrap-views, please follow the steps below
If you would like to remove `devise-bootstrap-views`, please follow the steps below:

1. Remove `gem devise-bootstrap-views` from Gemfile
2. Delete Gemfile.lock
3. Command `bundle install`
4. Remove the contexts below from your stylesheets
2. Command `bundle install`
3. Remove the contexts below from your stylesheets

```sh
# SASS
Expand All @@ -75,11 +65,11 @@ If you would like to remove devise-bootstrap-views, please follow the steps belo
*= require devise_bootstrap_views_less
```

5. Remove devise view files
4. Remove devise view files
```sh
rails destroy devise:views
```
6. Generate devise view files again
5. Generate devise view files again
```sh
rails g devise:views
```
Expand Down
3 changes: 1 addition & 2 deletions Rakefile
Original file line number Diff line number Diff line change
@@ -1,2 +1 @@
require "bundler/gem_tasks"

require 'bundler/gem_tasks'
10 changes: 0 additions & 10 deletions app/assets/stylesheets/devise_bootstrap_views.scss
Original file line number Diff line number Diff line change
@@ -1,10 +0,0 @@
.float-none {
float: none;
}

.panel-heading {
padding: 15px;
h4 {
margin: 0px;
}
}
10 changes: 0 additions & 10 deletions app/assets/stylesheets/devise_bootstrap_views_less.less
Original file line number Diff line number Diff line change
@@ -1,10 +0,0 @@
.float-none {
float: none;
}

.panel-heading {
padding: 15px;
h4 {
margin: 0px;
}
}
22 changes: 10 additions & 12 deletions app/views/devise/confirmations/new.html.erb
Original file line number Diff line number Diff line change
@@ -1,18 +1,16 @@
<%= bootstrap_devise_error_messages! %>
<div class="panel panel-default devise-bs">
<div class="panel-heading">
<h4><%= t('.resend_confirmation_instructions', default: 'Resend confirmation instructions') %></h4>

<h1><%= t('.resend_confirmation_instructions', default: 'Resend confirmation instructions') %></h1>

<%= form_for(resource, as: resource_name, url: confirmation_path(resource_name), html: { method: :post, role: 'form' }) do |f| %>
<div class="form-group">
<%= f.label :email %>
<%= f.email_field :email, autofocus: true, class: "form-control" %>
</div>
<div class="panel-body">
<%= form_for(resource, as: resource_name, url: confirmation_path(resource_name), html: { method: :post, role: 'form' }) do |f| %>
<div class="form-group">
<%= f.label :email %>
<%= f.email_field :email, autofocus: true, class: "form-control" %>
</div>

<%= f.submit t('.resend_confirmation_instructions', default: 'Resend confirmation instructions'), class: 'btn btn-primary' %>
<% end %>
<div class="form-group">
<%= f.submit t('.resend_confirmation_instructions', default: 'Resend confirmation instructions'), class: 'btn btn-primary' %>
</div>
</div>
<% end %>

<%= render 'devise/shared/links' %>
6 changes: 4 additions & 2 deletions app/views/devise/mailer/confirmation_instructions.html.erb
Original file line number Diff line number Diff line change
Expand Up @@ -2,5 +2,7 @@

<p><%= t('.instruction', default: 'You can confirm your account email through the link below:') %></p>

<p><%= link_to t('.action', default: 'Confirm my account'),
confirmation_url(@resource, confirmation_token: @token, locale: I18n.locale) %></p>
<p>
<%= link_to t('.action', default: 'Confirm my account'),
confirmation_url(@resource, confirmation_token: @token, locale: I18n.locale) %>
</p>
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,5 @@
<p><%= link_to t('.action', default: 'Change my password'), edit_password_url(@resource, reset_password_token: @token, locale: I18n.locale) %></p>

<p><%= t('.instruction_2', default: "If you didn't request this, please ignore this email.") %></p>

<p><%= t('.instruction_3', default: "Your password won't change until you access the link above and create a new one.") %></p>
35 changes: 17 additions & 18 deletions app/views/devise/passwords/edit.html.erb
Original file line number Diff line number Diff line change
@@ -1,24 +1,23 @@
<%= bootstrap_devise_error_messages! %>
<div class="panel panel-default devise-bs">
<div class="panel-heading">
<h4><%= t('.change_your_password', default: 'Change your password') %></h4>
</div>
<div class="panel-body">
<%= form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :put, role: 'form' }) do |f| %>
<%= f.hidden_field :reset_password_token %>

<div class="form-group">
<%= f.label :password, t('.new_password', default: 'New password') %>
<%= f.password_field :password, autofocus: true, class: 'form-control' %>
</div>
<h1><%= t('.change_your_password', default: 'Change your password') %></h1>

<%= form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :put, role: 'form' }) do |f| %>
<%= f.hidden_field :reset_password_token %>

<div class="form-group">
<%= f.label :password, t('.new_password', default: 'New password') %>
<%= f.password_field :password, autofocus: true, class: 'form-control' %>
</div>

<div class="form-group">
<%= f.label :password_confirmation, t('.confirm_new_password', default: 'Confirm new password') %>
<%= f.password_field :password_confirmation, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :password_confirmation, t('.confirm_new_password', default: 'Confirm new password') %>
<%= f.password_field :password_confirmation, class: 'form-control' %>
</div>

<%= f.submit t('.change_my_password', default: 'Change my password'), class: 'btn btn-primary' %>
<% end %>
<div class="form-group">
<%= f.submit t('.change_my_password', default: 'Change my password'), class: 'btn btn-primary' %>
</div>
</div>
<% end %>

<%= render 'devise/shared/links' %>
23 changes: 11 additions & 12 deletions app/views/devise/passwords/new.html.erb
Original file line number Diff line number Diff line change
@@ -1,17 +1,16 @@
<%= bootstrap_devise_error_messages! %>
<div class="panel panel-default devise-bs">
<div class="panel-heading">
<h4><%= t('.forgot_your_password', default: 'Forgot your password?') %></h4>

<h1><%= t('.forgot_your_password', default: 'Forgot your password?') %></h1>

<%= form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :post, role: 'form' }) do |f| %>
<div class="form-group">
<%= f.label :email %>
<%= f.email_field :email, autofocus: true, class: 'form-control' %>
</div>
<div class="panel-body">
<%= form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :post, role: "form" }) do |f| %>
<div class="form-group">
<%= f.label :email %>
<%= f.email_field :email, autofocus: true, class: 'form-control' %>
</div>

<%= f.submit t('.send_me_reset_password_instructions', default: 'Send me reset password instructions'), class: 'btn btn-primary' %>
<% end %>
<div class="form-group">
<%= f.submit t('.send_me_reset_password_instructions', default: 'Send me reset password instructions'), class: 'btn btn-primary' %>
</div>
</div>
<% end %>

<%= render 'devise/shared/links' %>
47 changes: 23 additions & 24 deletions app/views/devise/registrations/edit.html.erb
Original file line number Diff line number Diff line change
@@ -1,30 +1,29 @@
<%= bootstrap_devise_error_messages! %>
<div class="panel panel-default devise-bs">
<div class="panel-heading">
<h4><%= t('.title', resource: resource_class.model_name.human , default: "Edit #{resource_name.to_s.humanize}") %></h4>

<h1><%= t('.title', resource: resource_class.model_name.human , default: "Edit #{resource_name.to_s.humanize}") %></h1>

<%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put }) do |f| %>
<div class="form-group">
<%= f.label :email %>
<%= f.email_field :email, autofocus: true, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :password %> <i>(<%= t('.leave_blank_if_you_don_t_want_to_change_it', default: "leave blank if you don't want to change it") %>)</i>
<%= f.password_field :password, autocomplete: "off", class: 'form-control' %>
</div>
<div class="panel-body">
<%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put }) do |f| %>
<div class="form-group">
<%= f.label :email %>
<%= f.email_field :email, autofocus: true, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :password %> <i>(<%= t('.leave_blank_if_you_don_t_want_to_change_it', default: "leave blank if you don't want to change it") %>)</i>
<%= f.password_field :password, autocomplete: "off", class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :password_confirmation %>
<%= f.password_field :password_confirmation, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :current_password %> <i>(<%= t('.we_need_your_current_password_to_confirm_your_changes', default: 'we need your current password to confirm your changes') %>)</i>
<%= f.password_field :current_password, class: 'form-control' %>
</div>
<%= f.submit t('.update', default: 'Update'), class: 'btn btn-primary' %>
<% end %>
<div class="form-group">
<%= f.label :password_confirmation %>
<%= f.password_field :password_confirmation, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :current_password %> <i>(<%= t('.we_need_your_current_password_to_confirm_your_changes', default: 'we need your current password to confirm your changes') %>)</i>
<%= f.password_field :current_password, class: 'form-control' %>
</div>

<div class="form-group">
<%= f.submit t('.update', default: 'Update'), class: 'btn btn-primary' %>
</div>
</div>
<% end %>

<p><%= t('.unhappy', default: 'Unhappy') %>? <%= link_to t('.cancel_my_account', default: 'Cancel my account'), registration_path(resource_name), data: { confirm: t('.are_you_sure', default: "Are you sure?") }, method: :delete %>.</p>

Expand Down
40 changes: 20 additions & 20 deletions app/views/devise/registrations/new.html.erb
Original file line number Diff line number Diff line change
@@ -1,24 +1,24 @@
<%= bootstrap_devise_error_messages! %>
<div class="panel panel-default devise-bs">
<div class="panel-heading">
<h4><%= t('.sign_up', default: 'Sign up') %></h4>

<h1><%= t('.sign_up', default: 'Sign up') %></h1>

<%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { role: 'form' }) do |f| %>
<div class="form-group">
<%= f.label :email %>
<%= f.email_field :email, autofocus: true, class: 'form-control' %>
</div>
<div class="panel-body">
<%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { role: 'form' }) do |f| %>
<div class="form-group">
<%= f.label :email %>
<%= f.email_field :email, autofocus: true, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :password %>
<%= f.password_field :password, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :password_confirmation %>
<%= f.password_field :password_confirmation, class: 'form-control' %>
</div>
<%= f.submit t('.sign_up', default: 'Sign up'), class: 'btn btn-primary' %>
<% end %>
<div class="form-group">
<%= f.label :password %>
<%= f.password_field :password, class: 'form-control' %>
</div>
</div>
<div class="form-group">
<%= f.label :password_confirmation %>
<%= f.password_field :password_confirmation, class: 'form-control' %>
</div>

<div class="form-group">
<%= f.submit t('.sign_up', default: 'Sign up'), class: 'btn btn-primary' %>
</div>
<% end %>

<%= render 'devise/shared/links' %>
Loading

0 comments on commit df2b4b1

Please sign in to comment.