publify_core 10.0.4 → 11.0.0

data/app/models/user.rb

@@ -8,11 +8,12 @@ class User < ApplicationRecord
   ADMIN = "admin"
   PUBLISHER = "publisher"
   CONTRIBUTOR = "contributor"
+  MIN_PASSWORD_SCORE = 4
 
   # Include default devise modules. Others available are:
   # :confirmable, :lockable, :timeoutable and :omniauthable
   devise :database_authenticatable, :registerable,
-         :recoverable, :rememberable, :trackable, :validatable, :zxcvbnable
+         :recoverable, :rememberable, :trackable, :validatable
   include ConfigManager
   include StringLengthLimit
 
@@ -23,6 +24,7 @@ class User < ApplicationRecord
   validates :login, length: { in: 3..40 }
   validates_default_string_length :email, :text_filter_name
   validates :name, length: { maximum: 2048 }
+  validate :strong_password, if: :password_required?
 
   belongs_to :resource, optional: true
   has_many :notifications, foreign_key: "notify_user_id"
@@ -31,7 +33,7 @@ class User < ApplicationRecord
 
   has_many :articles
 
-  serialize :settings, Hash
+  serialize :settings, type: Hash, coder: YAML
 
   STATUS = %w(active inactive).freeze
 
@@ -73,24 +75,6 @@ class User < ApplicationRecord
       .map { |f| send(f) }.delete_if(&:empty?)
   end
 
-  # Authenticate users with old password hashes
-  alias devise_valid_password? valid_password?
-
-  def valid_password?(password)
-    devise_valid_password?(password)
-  rescue BCrypt::Errors::InvalidHash
-    digest = Digest::SHA1.hexdigest("#{self.class.salt}--#{password}--")
-    if digest == encrypted_password
-      # Update old SHA1 password with new Devise ByCrypt password
-      self.encrypted_password = password_digest(password)
-      save
-      true
-    else
-      # If not BCrypt password and not old SHA1 password deny access
-      false
-    end
-  end
-
   def active_for_authentication?
     super && state == "active"
   end
@@ -138,7 +122,14 @@ class User < ApplicationRecord
 
   private
 
+  def strong_password
+    return if password.blank?
+
+    test = Zxcvbn.test(password)
+    errors.add :password, :weak_password if test.score < MIN_PASSWORD_SCORE
+  end
+
   def set_default_profile
-    self.profile ||= User.count.zero? ? "admin" : "contributor"
+    self.profile ||= User.none? ? "admin" : "contributor"
   end
 end

data/app/uploaders/resource_uploader.rb

@@ -4,6 +4,7 @@ require "marcel"
 
 class ResourceUploader < CarrierWave::Uploader::Base
   include CarrierWave::MiniMagick
+
   before :process, :check_content_type!
 
   process :fix_exif_rotation, if: :image?

data/app/views/admin/articles/_form.html.erb

@@ -3,15 +3,15 @@
   <%= hidden_field_tag('article[id]', @article.id) if @article.present? %>
 </div>
 <div class="row save-bar">
-  <div class="col-md-8 col-md-offset-2" id="save-bar">
-    <div class="pull-right">
+  <div class="col-lg-8 offset-lg-2 d-flex justify-content-end" id="save-bar">
+    <div>
       <%= link_to(t('.cancel'), { action: 'index' }, { class: 'btn btn-default' }) %>
       <span id="preview_link">
         <%= link_to(t('.preview'), { controller: '/articles', action: 'preview', id: @article.id }, { target: 'new', class: 'btn btn-default' }) if @article.id %>
       </span>
-      <input id="save_draft" type="submit" value="<%= t('.save_as_draft') %>" name="article[draft]" class="btn btn-default">
+      <input id="save_draft" type="submit" value="<%= t('.save_as_draft') %>" name="article[draft]" class="btn btn-secondary">
       <!-- Button trigger modal -->
-      <button class="btn btn-success" data-toggle="modal" type="button" data-target="#publishOptions">
+      <button class="btn btn-success" data-bs-toggle="modal" type="button" data-bs-target="#publishOptions">
         <%= controller.action_name == 'new' ? t('.publish') : t('.save') %>
       </button>
     </div>
@@ -19,7 +19,7 @@
 </div>
 
 <div class="row">
-  <div class="col-md-8 col-md-offset-2" id="error-message-article">
+  <div class="col-lg-8 offset-lg-2" id="error-message-article">
     <%= render 'shared/flash', flash: flash %>
     <% if @article.errors.any? %>
       <div id="error_explanation">
@@ -36,12 +36,12 @@
 </div>
 
 <div class="row">
-  <div class="col-md-2" id="quicktags-block">
-    <div id="quicktags" class="pull-right">
+  <div class="col-lg-2" id="quicktags-block">
+    <div id="quicktags" class="float-right">
       <script type="text/javascript">edToolbar('article_body_and_extended', '<%= @article.text_filter_name %>');</script>
     </div>
   </div>
-  <div class="col-md-8">
+  <div class="col-lg-8">
     <%= text_field 'article', 'title', class: 'form-control', placeholder: t('.title') %>
     <div id="editor">
       <%= text_area('article', 'body_and_extended', class: 'form-control ', style: 'height: 360px', placeholder: t('.type_your_post')) %>
@@ -60,134 +60,128 @@
         </h2>
       </div>
       <div class="modal-body">
-        <div class="well">
-          <h4><%= t('.tags') %></h4>
-          <div class="form-group">
-            <%= text_field 'article', 'keywords', autocomplete: 'off', class: 'form-control tm-input' %>
+        <div class="card mb-3">
+          <div class="card-body">
+            <h4 class="card-title"><%= t('.tags') %></h4>
+            <div class="form-group">
+              <%= text_field 'article', 'keywords', autocomplete: 'off', class: 'form-control tm-input' %>
+            </div>
+            <p class="alert alert-warning"><%= t('.tags_explanation_html') %></p>
           </div>
-          <p class="alert alert-warning"><%= t('.tags_explanation_html') %></p>
         </div>
 
         <% post_types = @post_types || [] %>
         <% if post_types.size.zero? %>
           <%= hidden_field_tag 'article[post_type]', 'read' %>
         <% else %>
-          <div class="well">
-            <h4><%= t('.article_type') %></h4>
-            <%= select :article, :post_type, post_types.map { |pt| [pt.name, pt.permalink] }, include_blank: t('.default') %>
+          <div class="card mb-3">
+            <div class="card-body">
+              <h4 class="card-title"><%= t('.article_type') %></h4>
+              <%= select :article, :post_type, post_types.map { |pt| [pt.name, pt.permalink] }, include_blank: t('.default') %>
+            </div>
           </div>
         <% end %>
 
-        <div class="well">
-          <fieldset>
-            <legend><%= t('.publish_settings') %></legend>
-            <div class='control-group'>
-              <p>
-              <%= t('.permalink') %>:
-              <%= toggle_element('permalink') %>
-              </p>
-              <div id="permalink" class="collapse">
-                <div class="form-group">
-                  <%= text_field 'article', 'permalink', autocomplete: 'off', class: 'form-control' %>
-                </div>
+        <div class="card">
+          <div class="card-body">
+            <fieldset>
+              <legend><%= t('.publish_settings') %></legend>
+              <div class='control-group'>
                 <p>
-                <span class="btn btn-mini btn-default">
-                  <%= toggle_element('permalink', t('.ok')) %>
-                </span>
+                <%= t('.permalink') %>:
+                <%= toggle_element('permalink') %>
                 </p>
+                <div id="permalink" class="mb-3 collapse">
+                  <div class="mb-3">
+                    <%= text_field 'article', 'permalink', autocomplete: 'off', class: 'form-control' %>
+                  </div>
+                  <%= toggle_element('permalink', t('.ok'), class: "btn btn-mini btn-secondary") %>
+                </div>
               </div>
-            </div>
-            <div class="control-group">
-              <p>
-              <%= t('.status') %>: <strong><%= @article.state.to_s.downcase %></strong>
-              <%= toggle_element('status') %>
-              </p>
-              <div id="status" class="collapse">
-                <label for="article_published" class="checkbox">
-                  <%= check_box 'article', 'published?' %>
-                  <%= t('.published') %>
-                </label>
+              <div class="control-group">
                 <p>
-                <span class="btn btn-mini btn-default">
-                  <%= toggle_element 'status', t('.ok') %>
-                </span>
+                <%= t('.status') %>: <strong><%= @article.state.to_s.downcase %></strong>
+                <%= toggle_element('status') %>
                 </p>
+                <div id="status" class="mb-3 collapse">
+                  <div class="mb-3">
+                    <label for="article_published" class="checkbox">
+                      <%= check_box 'article', 'published?' %>
+                      <%= t('.published') %>
+                    </label>
+                  </div>
+                  <%= toggle_element('status', t('.ok'), class: "btn btn-mini btn-secondary") %>
+                </div>
               </div>
-            </div>
-            <div class="control-group">
-              <p>
-              <%= t('.allowed_comments_html', allow_comment: content_tag(:strong, @article.allow_comments? ? t('.allow_comments_status.enabled') : t('.allow_comments_status.disabled'))) %>
-              <%= toggle_element('conversation') %>
-              </p>
-              <div id="conversation" class="collapse">
-                <label for="article_allow_comments" class="checkbox">
-                  <%= check_box 'article', 'allow_comments' %>
-                  <%= t('.allow_comments') %>
-                </label>
+              <div class="control-group">
                 <p>
-                <span class="btn btn-mini btn-default">
-                  <%= toggle_element('conversation', t('.ok')) %>
-                </span>
+                <%= t('.allowed_comments_html', allow_comment: content_tag(:strong, @article.allow_comments? ? t('.allow_comments_status.enabled') : t('.allow_comments_status.disabled'))) %>
+                <%= toggle_element('conversation') %>
                 </p>
+                <div id="conversation" class="mb-3 collapse">
+                  <div class="mb-3">
+                    <label for="article_allow_comments" class="checkbox">
+                      <%= check_box 'article', 'allow_comments' %>
+                      <%= t('.allow_comments') %>
+                    </label>
+                  </div>
+                  <div>
+                    <%= toggle_element('conversation', t('.ok'), class: "btn btn-mini btn-secondary") %>
+                  </div>
+                </div>
               </div>
-            </div>
-            <div class="control-group">
-              <p>
-              <%= t('.published') %>
-              <strong>
-                <% if @article.published_at.present? %>
-                  <%= display_date_and_time(@article.published_at) %>
-                <% else %>
-                  <%= t('.now') %>
-                <% end %>
-              </strong>
-              <%= toggle_element('publish') %>
-              </p>
-              <div id="publish" class="collapse">
-                <%= datetime_field 'article', 'published_at' %>
+              <div class="control-group">
                 <p>
-                <span class="btn btn-mini btn-default">
-                  <%= toggle_element('publish', t('.ok')) %>
-                </span>
+                <%= t('.published') %>
+                <strong>
+                  <% if @article.published_at.present? %>
+                    <%= display_date_and_time(@article.published_at) %>
+                  <% else %>
+                    <%= t('.now') %>
+                  <% end %>
+                </strong>
+                <%= toggle_element('publish') %>
                 </p>
+                <div id="publish" class="mb-3 collapse">
+                  <div class="mb-3">
+                    <%= datetime_field 'article', 'published_at' %>
+                  </div>
+                  <%= toggle_element('publish', t('.ok'), class: "btn btn-mini btn-secondary") %>
+                </div>
               </div>
-            </div>
-            <div class="control-group">
-              <p>
-              <%= t('.visibility') %>: <strong><%= @article.password.blank? ? t('.public') : t('.protected') %></strong>
-              <%= toggle_element('visibility') %>
-              </p>
-              <div id="visibility" class="collapse">
-                <label for="article_password"><%= t('.password') %></label>
-                <%= text_field 'article', 'password', class: 'form-control' %>
+              <div class="control-group">
                 <p>
-                <span class="btn btn-mini btn-default">
-                  <%= toggle_element('visibility', t('.ok')) %>
-                </span>
+                <%= t('.visibility') %>: <strong><%= @article.password.blank? ? t('.public') : t('.protected') %></strong>
+                <%= toggle_element('visibility') %>
                 </p>
+                <div id="visibility" class="mb-3 collapse">
+                  <div class="mb-3">
+                    <label for="article_password"><%= t('.password') %></label>
+                    <%= text_field 'article', 'password', class: 'form-control' %>
+                  </div>
+                  <%= toggle_element('visibility', t('.ok'), class: "btn btn-mini btn-secondary") %>
+                </div>
               </div>
-            </div>
-            <div class="control-group">
-              <p>
-              <%= t('.article_filter') %>: <strong><%= @article.text_filter.description %></strong>
-              <%= toggle_element 'text_filter' %>
-              </p>
-              <div id="text_filter" class="collapse">
-                <select name="article[text_filter_name]" id="text_filter_name" class='form-control'>
-                  <%= options_for_select text_filter_options, @article.text_filter_name %>
-                </select>
+              <div class="control-group">
                 <p>
-                <span class="btn btn-mini btn-default">
-                  <%= toggle_element 'text_filter', 'OK' %>
-                </span>
+                <%= t('.article_filter') %>: <strong><%= @article.text_filter.description %></strong>
+                <%= toggle_element 'text_filter' %>
                 </p>
+                <div id="text_filter" class="collapse">
+                  <div class="mb-3">
+                    <select name="article[text_filter_name]" id="text_filter_name" class='form-select'>
+                      <%= options_for_select text_filter_options, @article.text_filter_name %>
+                    </select>
+                  </div>
+                  <%= toggle_element('text_filter', t('.ok'), class: "btn btn-mini btn-secondary") %>
+                </div>
               </div>
-            </div>
-          </fieldset>
+            </fieldset>
+          </div>
         </div>
       </div>
       <div class="modal-footer">
-        <button type="button" class="btn btn-default" data-dismiss="modal"><%= t('.cancel') %></button>
+        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><%= t('.cancel') %></button>
         <%= submit_tag(t('.publish'), class: 'btn btn-success') %>
       </div>
     </div>

data/app/views/admin/articles/index.html.erb

@@ -1,40 +1,32 @@
 <% content_for :page_heading do %>
   <h2>
     <%= t('.manage_articles') %>
-    <%= link_to(t('.new_article'), { controller: 'articles', action: 'new' }, { id: 'dialog-link', class: 'btn btn-info pull-right' }) %>
+    <%= link_to(t('.new_article'), { controller: 'articles', action: 'new' }, { id: 'dialog-link', class: 'btn btn-info float-right' }) %>
   </h2>
 <% end %>
 
-<%= form_tag({ action: 'index' }, { method: :get, name: 'article', remote: true, class: 'form-inline spinnable', "data-update-success": 'articleList' }) do %>
+<%= form_tag({ action: 'index' }, { method: :get, name: 'article', remote: true, class: 'spinnable', "data-update-success": 'articleList' }) do %>
 
   <% if params[:search] and params[:search]['state'] %>
     <input type="hidden" name="search[state]" value="<%= params[:search]['state'] %>">
   <% end %>
 
   <p>
-    <%= link_to(t('.all_articles'), { action: 'index' }, { class: 'label label-default' }) %>
-    <%= link_to(t('.published'), { action: 'index', search: { state: 'published' } }, { class: 'label label-success' }) %>
-    <%= link_to(t('.withdrawn'), { action: 'index', search: { state: 'withdrawn' } }, { class: 'label label-danger' }) %>
-    <%= link_to(t('.drafts'), { action: 'index', search: { state: 'drafts' } }, { class: 'label label-info' }) %>
-    <%= link_to(t('.publication_pending'), { action: 'index', search: { state: 'pending' } }, { class: 'label label-warning' }) %>
+    <%= link_to(t('.all_articles'), { action: 'index' }, { class: 'badge text-bg-secondary' }) %>
+    <%= link_to(t('.published'), { action: 'index', search: { state: 'published' } }, { class: 'badge text-bg-success' }) %>
+    <%= link_to(t('.withdrawn'), { action: 'index', search: { state: 'withdrawn' } }, { class: 'badge text-bg-danger' }) %>
+    <%= link_to(t('.drafts'), { action: 'index', search: { state: 'drafts' } }, { class: 'badge text-bg-info' }) %>
+    <%= link_to(t('.publication_pending'), { action: 'index', search: { state: 'pending' } }, { class: 'badge text-bg-warning' }) %>
   </p>
 
-  <div class="panel panel-default">
-    <div class="panel-heading clearfix">
-      <div class="pull-right">
-        <div class="form-group">
-          <%= select_tag('search[user_id]', options_from_collection_for_select(User.all, 'id', 'name'), prompt: t('.select_an_author'), class: 'form-control') %>
-        </div>
-        <div class="form-group">
-          <%= select_tag('search[published_at]', options_for_select(Article.publication_months), prompt: t('.publication_date'), class: 'form-control') %>
-        </div>
-        <div class="form-group">
-          <input id="search" type="text" name="search[searchstring]" class="form-control" autocomplete="off">
-        </div>
-        <div class="form-group">
-          <%= submit_tag(t('.search'), class: 'btn btn-success') %>
-          <span id="spinner" class="hidden"><%= image_tag('spinner.gif') %></span>
-        </div>
+  <div class="card mb-4">
+    <div class="card-header">
+      <div class="d-sm-flex">
+        <%= select_tag('search[user_id]', options_from_collection_for_select(User.all, 'id', 'name'), prompt: t('.select_an_author'), class: 'form-select ms-sm-auto me-sm-2') %>
+        <%= select_tag('search[published_at]', options_for_select(Article.publication_months), prompt: t('.publication_date'), class: 'form-select me-sm-2') %>
+        <input id="search" type="text" name="search[searchstring]" class="form-control me-sm-2" autocomplete="off">
+        <%= submit_tag(t('.search'), class: 'btn btn-success') %>
+        <span id="spinner" class="d-none"><%= image_tag('spinner.gif') %></span>
       </div>
     </div>
   </div>

data/app/views/admin/dashboard/_comment.html.erb

@@ -9,7 +9,7 @@
       <%= display_date_and_time comment.created_at %>
     </h5>
     <p>
-    <%= comment.html.strip_html.slice(0..300) %>
+    <%= comment.excerpt_text(300) %>
     </p>
     <%= button_to_conversation(comment) %>
     <hr>

data/app/views/admin/dashboard/_comments.html.erb

@@ -1,9 +1,7 @@
-<div class="panel panel-default">
-  <div class="panel-heading">
-    <h3 class='panel-title'><%= t('.latest_comments') %></h3>
-  </div>
-  <div class="panel-body">
-    <ul class='list-unstyled' id="commentList">
+<div class="card mb-4">
+  <h3 class="card-header"><%= t('.latest_comments') %></h3>
+  <div class="card-body">
+    <ul class="list-unstyled" id="commentList">
       <%= render partial: 'comment' %>
     </ul>
   </div>

data/app/views/admin/dashboard/_drafts.html.erb

@@ -1,8 +1,6 @@
-<div class="panel panel-default">
-  <div class="panel-heading">
-    <h3 class='panel-title'><%= t('.your_drafts') %></h3>
-  </div>
-  <div class="panel-body">
+<div class="card">
+  <h3 class="card-header"><%= t('.your_drafts') %></h3>
+  <div class="card-body">
     <ul class='list-unstyled'>
       <% if @drafts.empty? %>
         <li class='alert alert-info'>
@@ -15,7 +13,7 @@
             <%= link_to(post.title, controller: 'admin/articles', action: 'edit', id: post.id) %>
             <%= display_date_and_time(post.created_at) %>
           </h5>
-          <p><%= post.body&.strip_html&.slice(0, 300) %></p>
+          <p><%= post.excerpt_text(300) %></p>
           <hr>
           </li>
         <% end %>

data/app/views/admin/dashboard/_overview.html.erb

@@ -1,8 +1,5 @@
-<div class='alert alert-info'>
-  <button type="button" class="close" data-dismiss="alert">
-    <span aria-hidden="true">&times;</span>
-    <span class="sr-only">Close</span>
-  </button>
+<div class="alert alert-info alert-dismissible fade show">
+  <button type="button" class="btn-close float-right" data-bs-dismiss="alert" aria-label="Close"></button>
   <% links = []
      links << link_to(t('.write_a_post'), controller: 'articles', action: 'new') if can? :new, 'admin/articles'
      links << link_to(t('.write_a_page'), controller: 'pages', action: 'new') if can? :new, 'admin/pages'

data/app/views/admin/dashboard/_welcome.html.erb

@@ -1,27 +1,27 @@
-<div class="panel panel-default">
-  <div class="panel-heading">
-    <h3 class="panel-title"><%= t('.today') %></h3>
-  </div>
-  <div class="panel-body">
+<div class="card mb-4">
+  <h3 class="card-header"><%= t('.today') %></h3>
+  <div class="card-body">
     <p><%= t('.articles_and_comments_count_since', articles_count: @newposts_count, comments_count: @newcomments_count) %></p>
     <p><%= t('.running_publify', version: PublifyCore::VERSION) %> <%= @version_message %></p>
-    <div class='col-md-6'>
+    <div class='row'>
       <% if can? :index, 'admin/articles' %>
-        <h4 class='page-header'><%= t('.content') %></h4>
-        <p><%= link_to(t('.articles_count', count: @statposts), controller: 'admin/articles') %></p>
-        <p><%= link_to(t('.your_articles_count', count: @statuserposts), controller: 'admin/articles', 'search[user_id]' => current_user.id) %></p>
-        <p><%= link_to(t('.drafts_count', count: @statsdrafts), controller: 'admin/articles', 'search[state]' => 'drafts') %></p>
-        <p><%= link_to(t('.pages_count', count: @statspages), controller: 'admin/pages') %></p>
-        <p><%= link_to(t('.notes_count', count: @statuses), controller: 'admin/notes') %></p>
+        <div class="col-lg-6">
+          <h4 class='mb-2 pb-2 border-bottom'><%= t('.content') %></h4>
+          <p><%= link_to(t('.articles_count', count: @statposts), controller: 'admin/articles') %></p>
+          <p><%= link_to(t('.your_articles_count', count: @statuserposts), controller: 'admin/articles', 'search[user_id]' => current_user.id) %></p>
+          <p><%= link_to(t('.drafts_count', count: @statsdrafts), controller: 'admin/articles', 'search[state]' => 'drafts') %></p>
+          <p><%= link_to(t('.pages_count', count: @statspages), controller: 'admin/pages') %></p>
+          <p><%= link_to(t('.notes_count', count: @statuses), controller: 'admin/notes') %></p>
+        </div>
       <% end %>
-    </div>
-    <div class='col-md-6'>
       <% if can? :index, 'admin/feedback' %>
-        <h4 class='page-header'><%= t('.feedback') %></h4>
-        <p><%= link_to(t('.comments_count', count: @statcomments), controller: 'admin/feedback') %></p>
-        <p><%= link_to(t('.approved_count', count: @confirmed), controller: 'admin/feedback', only: 'ham') %></p>
-        <p><%= link_to(t('.unconfirmed_count', count: @unconfirmed), controller: 'admin/feedback', only: 'unapproved') %></p>
-        <p><%= link_to(t('.spam_count', count: @statspam), controller: 'admin/feedback', only: 'spam') %></p>
+        <div class="col-lg-6">
+          <h4 class='mb-2 pb-2 border-bottom'><%= t('.feedback') %></h4>
+          <p><%= link_to(t('.comments_count', count: @statcomments), controller: 'admin/feedback') %></p>
+          <p><%= link_to(t('.approved_count', count: @confirmed), controller: 'admin/feedback', only: 'ham') %></p>
+          <p><%= link_to(t('.unconfirmed_count', count: @unconfirmed), controller: 'admin/feedback', only: 'unapproved') %></p>
+          <p><%= link_to(t('.spam_count', count: @statspam), controller: 'admin/feedback', only: 'spam') %></p>
+        </div>
       <% end %>
     </div>
   </div>

data/app/views/admin/dashboard/index.html.erb

@@ -1,15 +1,15 @@
 <% content_for :page_heading do %>
-<h2 class="page-title"><%= t('.welcome_back', user_name: current_user.name) %></h2>
+  <h2 class="display-4"><%= t('.welcome_back', user_name: current_user.name) %></h2>
 <% end %>
 
 <%= render 'overview' %>
 
 <div class='row'>
-  <div class='col-md-6'>
+  <div class='col-lg-6'>
     <%= render 'welcome' %>
     <%= render 'comments' %>
   </div>
-  <div class='col-md-6'>
+  <div class='col-lg-6'>
     <%= render 'drafts' %>
   </div>
 </div>

data/app/views/admin/feedback/_button.html.erb

@@ -1,19 +1,13 @@
 <%= hidden_field_tag 'confirmed', params[:confirmed] %>
 <%= hidden_field_tag 'published', params[:published] %>
 
-<div class="panel panel-default">
-  <div class="panel-heading">
-    <div class='form-group'>
-      <button name='<%= "bulkop_#{position}" %>' class="btn btn-success btn-sm" value='Mark Checked Items as Ham'><%= t('.mark_checked_items_as_ham') %></button>
-    </div>
-    <div class='form-group'>
-      <button name='<%= "bulkop_#{position}" %>' class="btn btn-warning btn-sm" value='Mark Checked Items as Spam'><%= t('.mark_checked_items_as_spam') %></button>
-    </div>
-    <div class='form-group'>
-      <button name='<%= "bulkop_#{position}" %>' class="btn btn-danger btn-sm" value='Delete Checked Items'><%= t('.delete_checked_items') %></button>
-    </div>
-    <div class='form-group pull-right'>
-      <button name='<%= "bulkop_#{position}" %>' class="btn btn-danger btn-sm" value='Delete all spam'><%= t('.delete_all_spam') %></button>
+<div class="card mb-4">
+  <div class="card-header">
+    <div class="d-sm-flex">
+      <button name='<%= "bulkop_#{position}" %>' class="btn btn-success btn-sm me-sm-2" value='Mark Checked Items as Ham'><%= t('.mark_checked_items_as_ham') %></button>
+      <button name='<%= "bulkop_#{position}" %>' class="btn btn-warning btn-sm me-sm-2" value='Mark Checked Items as Spam'><%= t('.mark_checked_items_as_spam') %></button>
+      <button name='<%= "bulkop_#{position}" %>' class="btn btn-danger btn-sm me-sm-2" value='Delete Checked Items'><%= t('.delete_checked_items') %></button>
+      <button name='<%= "bulkop_#{position}" %>' class="btn btn-danger btn-sm ms-sm-auto" value='Delete all spam'><%= t('.delete_all_spam') %></button>
     </div>
   </div>
 </div>

data/app/views/admin/feedback/article.html.erb

@@ -4,7 +4,7 @@
   </h2>
 <% end %>
 
-<%= form_tag({ action: 'bulkops' }, { class: 'form-inline' }) do %>
+<%= form_tag({ action: 'bulkops' }) do %>
 
   <%= hidden_field_tag 'article_id', @article.id %>
 
@@ -40,35 +40,35 @@
   </table>
 <% end %>
 
-<%= form_tag action: 'create' do %>
-  <%= hidden_field_tag('article_id', @article.id) %>
-  <fieldset class='form-horizontal'>
+<%= form_with url: {action: 'create'}, local: true do |form| %>
+  <%= form.hidden_field :article_id, value: @article.id %>
+  <fieldset class='mb-4'>
     <legend><%= t('.add_a_comment') %></legend>
-    <div class="form-group">
-      <label for="comment_author" class='control-label col-sm-2'><%= t('.author') %></label>
-      <div class='col-sm-5'>
+    <div class="form-group row">
+      <label for="comment_author" class='col-form-label col-md-2'><%= t('.author') %></label>
+      <div class="col-md-5">
         <%= text_field 'comment', 'author', class: 'form-control' %>
       </div>
     </div>
-    <div class='form-group'>
-      <label for="comment_email" class='control-label col-sm-2'><%= t('.email') %></label>
-      <div class='col-sm-5'>
+    <div class="form-group row">
+      <label for="comment_email" class='col-form-label col-md-2'><%= t('.email') %></label>
+      <div class="col-md-5">
         <%= text_field 'comment', 'email', class: 'form-control' %>
       </div>
     </div>
-    <div class='form-group'>
-      <label for="comment_url" class='control-label col-sm-2'><%= t('.url') %></label>
-      <div class='col-sm-5'>
+    <div class="form-group row">
+      <label for="comment_url" class='col-form-label col-md-2'><%= t('.url') %></label>
+      <div class="col-md-5">
         <%= text_field 'comment', 'url', class: 'form-control' %>
       </div>
     </div>
-    <div class='form-group'>
-      <label for='comment_body' class='control-label col-sm-2'><%= t('.your_comment') %></label>
-      <div class='col-sm-5'>
+    <div class="form-group row">
+      <label for="comment_body" class='col-form-label col-md-2'><%= t('.your_comment') %></label>
+      <div class="col-md-5">
         <%= text_area 'comment', 'body', rows: '10', class: 'form-control' %>
       </div>
     </div>
-    <div>
+    <div class="mt-3">
       <%= t('.action_or_other_html', first_action: link_to(t('.cancel'), action: 'index'), second_action: submit_tag(t('.save'), class: 'btn btn-primary')) %>
     </div>
   </fieldset>