Rename Bootstrap 3/4 grid, button and form-group classes

col-xs-N -> col-N, col-md-offset-N -> offset-md-N, row-fluid -> row,
btn-block -> w-100, btn-xs -> btn-sm, form-group -> mb-3 (Bootstrap 5 dropped
form-group), and btn-default (Bootstrap 3) -> btn-outline-secondary. The three
helpers that combined btn-default with btn-secondary keep just btn-secondary.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

app/helpers/buttons_helper.rb

@@ -3,7 +3,7 @@
 module ButtonsHelper
   include IconsHelper
 
-  def garden_plant_something_button(garden, classes: "btn btn-default")
+  def garden_plant_something_button(garden, classes: "btn btn-outline-secondary")
     return unless can? :edit, garden
 
     link_to new_planting_path(garden_id: garden.id), class: classes do
@@ -14,12 +14,12 @@ module ButtonsHelper
   def plant_something_button
     return unless can? :create, Planting
 
-    link_to new_planting_path, class: "btn btn-default" do
+    link_to new_planting_path, class: "btn btn-outline-secondary" do
       planting_icon + ' ' + t('buttons.plant_something')
     end
   end
 
-  def garden_plan_something_button(garden, classes: "btn btn-default")
+  def garden_plan_something_button(garden, classes: "btn btn-outline-secondary")
     return unless can? :edit, garden
 
     link_to new_activity_path(garden_id: garden.id), class: classes do
@@ -30,12 +30,12 @@ module ButtonsHelper
   def plan_something_button
     return unless can? :create, Activity
 
-    link_to new_activity_path, class: "btn btn-default" do
+    link_to new_activity_path, class: "btn btn-outline-secondary" do
       activity_icon + ' ' + t('buttons.new_activity')
     end
   end
 
-  def planting_plan_something_button(planting, classes: "btn btn-default")
+  def planting_plan_something_button(planting, classes: "btn btn-outline-secondary")
     return unless can? :edit, planting
 
     link_to new_activity_path(planting_id: planting.id), class: classes do
@@ -101,7 +101,7 @@ module ButtonsHelper
     end
   end
 
-  def activity_finish_button(activity, classes: 'btn btn-default btn-secondary')
+  def activity_finish_button(activity, classes: 'btn btn-secondary')
     return unless can?(:edit, activity) || activity.finished
 
     link_to activity_path(slug: activity.slug, activity: { finished: 1 }),
@@ -110,7 +110,7 @@ module ButtonsHelper
     end
   end
 
-  def planting_finish_button(planting, classes: 'btn btn-default btn-secondary')
+  def planting_finish_button(planting, classes: 'btn btn-secondary')
     return unless can?(:edit, planting) || planting.finished || planting.failed
 
     link_to planting_path(slug: planting.slug, planting: { finished: 1 }),
@@ -119,7 +119,7 @@ module ButtonsHelper
     end
   end
 
-  def planting_failed_button(planting, classes: 'btn btn-default btn-secondary')
+  def planting_failed_button(planting, classes: 'btn btn-secondary')
     return unless can?(:edit, planting) || planting.finished || planting.failed
 
     link_to planting_path(slug: planting.slug, planting: { failed: 1 }),
@@ -128,7 +128,7 @@ module ButtonsHelper
     end
   end
 
-  def seed_finish_button(seed, classes: 'btn btn-default')
+  def seed_finish_button(seed, classes: 'btn btn-outline-secondary')
     return unless can?(:create, Planting) && seed.active
 
     link_to seed_path(seed, seed: { finished: 1 }), method: :put, class: "#{classes} append-date" do
@@ -136,7 +136,7 @@ module ButtonsHelper
     end
   end
 
-  def planting_harvest_button(planting, classes: 'btn btn-default')
+  def planting_harvest_button(planting, classes: 'btn btn-outline-secondary')
     return unless planting.active && can?(:create, Harvest) && can?(:edit, planting)
 
     link_to new_planting_harvest_path(planting_slug: planting.slug), class: classes do
@@ -144,7 +144,7 @@ module ButtonsHelper
     end
   end
 
-  def planting_save_seeds_button(planting, classes: 'btn btn-default')
+  def planting_save_seeds_button(planting, classes: 'btn btn-outline-secondary')
     return unless can?(:edit, planting) && !planting.failed?
 
     link_to new_planting_seed_path(planting_slug: planting.slug), class: classes do
@@ -152,7 +152,7 @@ module ButtonsHelper
     end
   end
 
-  def add_photo_button(model, classes: "btn btn-default")
+  def add_photo_button(model, classes: "btn btn-outline-secondary")
     return unless can?(:edit, model) && can?(:create, Photo)
 
     link_to new_photo_path(id: model.id, type: model_type_for_photo(model)),
@@ -181,8 +181,8 @@ module ButtonsHelper
     ActiveModel::Name.new(model.class).to_s.downcase
   end
 
-  def button(path, button_title, icon, size = 'btn-xs')
-    link_to path, class: "btn btn-default #{size}" do
+  def button(path, button_title, icon, size = 'btn-sm')
+    link_to path, class: "btn btn-outline-secondary #{size}" do
       icon + ' ' + button_title
     end
   end

app/views/activities/show.html.haml

@@ -15,7 +15,7 @@
 
 .activity
   .row
-    .col-md-8.col-xs-12
+    .col-md-8.col-12
       .jumbotron
         .d-flex.justify-content-between
           %h1.display-3
@@ -34,10 +34,10 @@
       = render 'likes/likes', object: @activity
       = render 'activities/actions', activity: @activity
 
-    .col-md-4.col-xs-12
+    .col-md-4.col-12
       = render 'activities/owner', planting: @activity
 
-    .col-md-8.col-xs-12
+    .col-md-8.col-12
 
 
       - if @activity.garden
@@ -51,4 +51,4 @@
           = render 'plantings/card', planting: @activity.planting
 
 
-    .col-md-4.col-xs-12
+    .col-md-4.col-12

app/views/admin/roles/index.html.haml

@@ -21,11 +21,11 @@
       %td= role.description
       %td
         - if can? :edit, role
-          = link_to edit_admin_role_path(role), class: 'btn btn-default btn-xs' do 
+          = link_to edit_admin_role_path(role), class: 'btn btn-outline-secondary btn-sm' do 
             = edit_icon
             = t('.edit')
         - if can?(:destroy, role) && ! role.members.any?
-          = link_to admin_role_path(role), method: :delete, data: { confirm: t(:are_you_sure?) }, class: 'btn btn-default btn-xs text-danger' do
+          = link_to admin_role_path(role), method: :delete, data: { confirm: t(:are_you_sure?) }, class: 'btn btn-outline-secondary btn-sm text-danger' do
             = delete_icon
             = t('.delete')
 

app/views/alternate_names/_form.html.haml

@@ -19,7 +19,7 @@
           = link_to "crop wrangling guide", "https://github.com/Growstuff/growstuff/wiki/Crop-Wrangling"
           on the Growstuff wiki.
 
-      .form-group
+      .mb-3
         = f.label :crop_id, class: 'control-label col-md-2'
         .col-md-8
           = select(:alternate_name, :crop_id,
@@ -27,12 +27,12 @@
                               { selected: @alternate_name.crop_id || @crop.id },
                               class: 'form-control')
 
-      .form-group
+      .mb-3
         = f.label :name, class: 'control-label col-md-2'
         .col-md-8
           = f.text_field :name, class: 'form-control'
         .col-md-8
           = f.select :language, I18nData.languages.map {|code, name| [name.split(";").first, code] }, class: 'form-control'
-      .form-group
-        .form-actions.col-md-offset-2.col-md-8
+      .mb-3
+        .form-actions.offset-md-2.col-md-8
           = f.submit 'Save', class: 'btn btn-primary'

app/views/alternate_names/index.html.haml

@@ -17,11 +17,11 @@
       %td= link_to 'Show', alternate_name
       %td
         - if can? :edit, alternate_name
-          = link_to t('buttons.edit'), edit_alternate_name_path(alternate_name), class: 'btn btn-default btn-xs'
+          = link_to t('buttons.edit'), edit_alternate_name_path(alternate_name), class: 'btn btn-outline-secondary btn-sm'
       %td
         - if can? :destroy, alternate_name
           = link_to t('buttons.delete'), alternate_name,
                     method: :delete,
                     data: { confirm: t(:are_you_sure?) },
-                    class: 'btn btn-default btn-xs'
+                    class: 'btn btn-outline-secondary btn-sm'
 = will_paginate(@alternate_names)

app/views/alternate_names/show.html.haml

@@ -17,6 +17,6 @@
   = link_to @alternate_name.crop, @alternate_name.crop
 
 - if can? :edit, @alternate_name
-  = link_to 'Edit', edit_alternate_name_path(@alternate_name), class: 'btn btn-default btn-xs'
+  = link_to 'Edit', edit_alternate_name_path(@alternate_name), class: 'btn btn-outline-secondary btn-sm'
   \|
 = link_to 'Back', alternate_names_path

app/views/conversations/index.haml

@@ -51,7 +51,7 @@
                 - else
                   = check_box_tag 'conversation_ids[]', conversation.id, false, class: 'selectable', "aria-label": "Select for deletion"
       .offset-9.col-3
-        = button_tag(type: 'submit', class: 'btn btn-default') do
+        = button_tag(type: 'submit', class: 'btn btn-outline-secondary') do
           = icon 'fas', 'trash-alt'
           = 'Delete'
       - unless @conversations.empty?

app/views/crops/_alternate_names.html.haml

@@ -21,4 +21,4 @@
 
   %p.text-end
     - if can? :edit, crop
-      = link_to 'Add', new_alternate_name_path(crop_id: crop.id), class: 'btn btn-default btn-xs'
+      = link_to 'Add', new_alternate_name_path(crop_id: crop.id), class: 'btn btn-outline-secondary btn-sm'

app/views/crops/_form.html.haml

@@ -25,7 +25,7 @@
       -# Everyone (wranglers and requesters) sees the basic info section
       %h2 Basic information
 
-      .form-group#new_crop
+      .mb-3#new_crop
       = f.text_field :name, required: true
       %span.help-block
         The common name for the crop, in English (required).
@@ -95,7 +95,7 @@
       = button_tag "+", class: "add-sciname-row", type: "button"
       = button_tag "-", class: "remove-sciname-row", type: "button"
 
-      .form-group#scientific_names
+      .mb-3#scientific_names
         - @crop.scientific_names.each.with_index do |sci, index|
           .template.col-12{ id: "sci_template[#{index + 1}]" }
             .col-2
@@ -111,7 +111,7 @@
       = button_tag "+", class: "add-altname-row", type: "button"
       = button_tag "-", class: "remove-altname-row", type: "button"
 
-      .form-group#alternate_names
+      .mb-3#alternate_names
         - @crop.alternate_names.each.with_index do |alt, index|
           .template.col-12{ id: "alt_template[#{index + 1}]" }
             .col-2

app/views/crops/_harvests.html.haml

@@ -17,7 +17,7 @@
       %li.list-group-item= link_to "View all #{crop.name} harvests", crop_harvests_path(crop), class: 'card-link'
       - if crop.approved?
         - if current_member
-          %li.list-group-item= link_to "Harvest #{crop.name}", new_harvest_path(harvest: { crop_id: crop.id }), class: 'btn btn-block'
+          %li.list-group-item= link_to "Harvest #{crop.name}", new_harvest_path(harvest: { crop_id: crop.id }), class: 'btn w-100'
         - else
           %li.list-group-item.active
             = icon 'fas', 'user'

app/views/crops/_plantings.html.haml

@@ -14,6 +14,6 @@
   .card-footer
     - if crop.approved?
       - if current_member
-        %p= link_to "Plant #{crop.name}", new_planting_path(crop_id: crop.id), class: 'btn btn-block'
+        %p= link_to "Plant #{crop.name}", new_planting_path(crop_id: crop.id), class: 'btn w-100'
       - else
         = render partial: 'shared/signin_signup', locals: { to: "track your #{crop.name} plantings" }

app/views/crops/_posts.html.haml

@@ -6,7 +6,7 @@
     Nobody has posted about #{crop.name.pluralize} yet.
   %p
     - if can? :create, Post
-      = link_to "Post something", new_post_path(crop_id: crop.slug), class: 'btn btn-default'
+      = link_to "Post something", new_post_path(crop_id: crop.slug), class: 'btn btn-outline-secondary'
     - else
       = render partial: "shared/signin_signup",
               locals: { to: "post your tips and experiences growing #{crop.name.pluralize}" }

app/views/crops/_scientific_names.html.haml

@@ -29,4 +29,4 @@
 
   %p.text-end
     - if can? :edit, crop
-      = link_to 'Add', new_scientific_name_path(crop_id: crop.id), class: 'btn btn-default btn-xs'
+      = link_to 'Add', new_scientific_name_path(crop_id: crop.id), class: 'btn btn-outline-secondary btn-sm'

app/views/crops/_search_bar.haml

@@ -1,6 +1,6 @@
 = form_tag search_crops_path, method: :get, class: 'form-inline', id: 'navbar-search' do
   .input-group
     %input.form-control{name: 'term', "aria-label" => "Search crops", placeholder: "Search crops", type: "search", id: 'term' }/
-    %button.btn.btn-default.text-white{type: "submit"}
+    %button.btn.btn-outline-secondary.text-white{type: "submit"}
       = icon 'fas', 'search'
       .visually-hidden Search

app/views/devise/confirmations/new.html.haml

@@ -9,8 +9,8 @@
       %p Enter either your login name or your email address to resend the confirmation email.
 
       = f.text_field :login, class: 'form-control', placeholder: 'email or login name'
-      = f.submit "Resend confirmation instructions", class: 'btn btn-block my-4 btn-primary'
+      = f.submit "Resend confirmation instructions", class: 'btn w-100 my-4 btn-primary'
 
-      .form-group
-        .col-md-offset-2.col-md-8
+      .mb-3
+        .offset-md-2.col-md-8
           = render "devise/shared/links"

app/views/devise/passwords/edit.html.haml

@@ -6,18 +6,18 @@
   = render 'devise/shared/error_messages', resource: resource
   = f.hidden_field :reset_password_token
 
-  .form-group
+  .mb-3
     = f.label :password, "New password", class: 'control-label col-md-2'
     .col-md-8
       = f.password_field :password, class: 'form-control'
 
-  .form-group
+  .mb-3
     = f.label :password_confirmation, "Confirm new password", class: 'control-label col-md-2'
     .col-md-8
       = f.password_field :password_confirmation, class: 'form-control'
 
-  .form-group
-    .form-actions.col-md-offset-2.col-md-8
+  .mb-3
+    .form-actions.offset-md-2.col-md-8
       = f.submit "Change my password", class: 'btn btn-primary'
 
 = render "devise/shared/links"

app/views/devise/passwords/new.html.haml

@@ -9,6 +9,6 @@
       = render 'devise/shared/error_messages', resource: resource
 
       = f.text_field :login, class: "form-control mb-4", placeholder: "E-mail", type: "email"
-      = f.submit "Send me reset password instructions", class: 'btn btn-block my-4 btn-primary'
+      = f.submit "Send me reset password instructions", class: 'btn w-100 my-4 btn-primary'
 
     = render "devise/shared/links"

app/views/devise/registrations/_delete.html.haml

@@ -5,11 +5,11 @@
   = render 'devise/shared/error_messages', resource: resource
 
   %p Delete your account from #{ENV['GROWSTUFF_SITE_NAME']}.
-  .form-group
+  .mb-3
     = f.label :current_password, "Password required to delete", class: 'control-label col-md-2'
     .col-md-4
       = f.password_field :current_password, class: 'form-control', id: 'current_pw_for_delete'
 
-  .form-group
-    .form-actions.col-md-offset-2.col-md-8
+  .mb-3
+    .form-actions.offset-md-2.col-md-8
       = f.submit "Delete", class: 'btn btn-danger'

app/views/devise/registrations/_edit_email.html.haml

@@ -4,45 +4,45 @@
   %br/
   = render 'devise/shared/error_messages', resource: resource
 
-  .form-group
+  .mb-3
     = f.label :email, class: 'control-label col-md-2'
     .col-md-8
       = f.email_field :email, class: 'form-control'
       %span.help-block If you change your email address you will have to reconfirm.
 
-  .form-group
-    .col-md-offset-2.col-md-8.checkbox
+  .mb-3
+    .offset-md-2.col-md-8.checkbox
       %label
         = f.check_box :show_email
         Show email publicly on your profile page.
 
-  .form-group
-    .col-md-offset-2.col-md-8.checkbox
+  .mb-3
+    .offset-md-2.col-md-8.checkbox
       %label
         = f.check_box :send_notification_email
         Receive emailed copies of Inbox notifications (eg. private messages).
 
-  .form-group
-    .col-md-offset-2.col-md-8.checkbox
+  .mb-3
+    .offset-md-2.col-md-8.checkbox
       %label
         = f.check_box :send_planting_reminder
         Receive regular reminders to track your planting and harvesting.
 
-  .form-group
-    .col-md-offset-2.col-md-8.checkbox
+  .mb-3
+    .offset-md-2.col-md-8.checkbox
       %label
         = f.check_box :send_harvest_reminder
         Receive regular reminders of upcoming harvests.
 
-  .form-group
-    .col-md-offset-2.col-md-8.checkbox
+  .mb-3
+    .offset-md-2.col-md-8.checkbox
       %label
         = f.check_box :newsletter
         Subscribe to the #{ENV['GROWSTUFF_SITE_NAME']} newsletter
       .help-block
         = render partial: 'newsletter_blurb'
 
-  .form-group
-    .form-actions.col-md-offset-2.col-md-8
+  .mb-3
+    .form-actions.offset-md-2.col-md-8
       = f.submit "Save", class: 'btn btn-primary'
       = f.hidden_field(:tos_agreement, value: true)

app/views/devise/registrations/_edit_password.html.haml

@@ -4,22 +4,22 @@
   %br/
   = render 'devise/shared/error_messages', resource: resource
 
-  .form-group
+  .mb-3
     = f.label :current_password, class: 'control-label col-md-2'
     .col-md-4
       = f.password_field :current_password, class: 'form-control'
 
-  .form-group
+  .mb-3
     = f.label :password, "New password", class: 'control-label col-md-2'
     .col-md-4
       = f.password_field :password, autocomplete: "off", class: 'form-control'
 
-  .form-group
+  .mb-3
     = f.label :password_confirmation, class: 'control-label col-md-2'
     .col-md-4= f.password_field :password_confirmation, class: 'form-control'
 
-  .form-group
-    .form-actions.col-md-offset-2.col-md-8
+  .mb-3
+    .form-actions.offset-md-2.col-md-8
       = f.submit "Save", class: 'btn btn-primary'
 
       = f.hidden_field(:tos_agreement, value: true)

app/views/devise/registrations/_edit_profile.html.haml

@@ -4,43 +4,43 @@
   %br/
   = render 'devise/shared/error_messages', resource: resource
 
-  .form-group
+  .mb-3
     = f.label :location, 'Your location', class: 'control-label col-md-2'
     .col-md-8
       = f.text_field :location, autocomplete: "off", class: 'form-control'
       %span.help-block This will be displayed on a map. You can be as detailed or vague as you like.
 
-  .form-group
+  .mb-3
     = f.label :bio, class: 'control-label col-md-2'
     .col-md-8
       = f.text_area :bio, rows: 6, class: 'form-control', placeholder: "I'm am XYZ gardener interested in A, B, C"
 
-  .form-group
+  .mb-3
     = f.label :website_url, 'Website', class: 'control-label col-md-2'
     .col-md-8
       = f.url_field :website_url, class: 'form-control', placeholder: "https://you.example.com/"
 
-  .form-group
+  .mb-3
     = f.label :instagram_handle, 'Instagram', class: 'control-label col-md-2'
     .col-md-8
       = f.text_field :instagram_handle, class: 'form-control', placeholder: 'your_handle'
 
-  .form-group
+  .mb-3
     = f.label :facebook_handle, 'Facebook', class: 'control-label col-md-2'
     .col-md-8
       = f.text_field :facebook_handle, class: 'form-control', placeholder: 'your_handle'
 
-  .form-group
+  .mb-3
     = f.label :bluesky_handle, 'Bluesky', class: 'control-label col-md-2'
     .col-md-8
       = f.text_field :bluesky_handle, class: 'form-control', placeholder: 'your_handle'
 
-  .form-group
+  .mb-3
     = f.label :other_url, 'Other URL', class: 'control-label col-md-2'
     .col-md-8
       = f.url_field :other_url, class: 'form-control', placeholder: "https://you.example.com/"
 
-  .form-group
+  .mb-3
     %label.control-label.col-md-2
       Profile picture
     .col-md-8
@@ -52,7 +52,7 @@
           = succeed "." do
             = link_to 'gravatar.com', "https://gravatar.com/"
 
-  .form-group
-    .form-actions.col-md-offset-2.col-md-8
+  .mb-3
+    .form-actions.offset-md-2.col-md-8
       = f.submit "Save", class: 'btn btn-primary'
       = f.hidden_field(:tos_agreement, value: true)

app/views/devise/registrations/new.html.haml

@@ -27,7 +27,7 @@
         = f.check_box :newsletter, checked: true, label: "Subscribe to the #{ENV['GROWSTUFF_SITE_NAME']} newsletter"
       %p= render partial: 'newsletter_blurb'
 
-      = f.submit "Sign up", class: 'btn btn-block btn-success'
+      = f.submit "Sign up", class: 'btn w-100 btn-success'
 
       -# START add reCAPTCHA
       = flash[:recaptcha_error]

app/views/devise/sessions/new.html.haml

@@ -12,6 +12,6 @@
           = f.check_box :remember_me
         - if devise_mapping.recoverable? && controller_name != 'passwords'
           %p= link_to "Forgot password?", new_password_path(resource_name)
-      = f.submit "Sign in", class: 'btn btn-block btn-success'
+      = f.submit "Sign in", class: 'btn w-100 btn-success'
 
     = render "devise/shared/links"

app/views/devise/unlocks/new.html.haml

@@ -10,6 +10,6 @@
       %h2 Resend unlock instructions
       = render 'devise/shared/error_messages', resource: resource
       = f.email_field :email, class: 'form-control', placeholder: 'Email'
-      = f.submit "Resend unlock instructions", class: 'btn btn-block my-4 btn-primary'
+      = f.submit "Resend unlock instructions", class: 'btn w-100 my-4 btn-primary'
 
     = render "devise/shared/links"

app/views/forums/index.html.haml

@@ -2,7 +2,7 @@
 
 - if can? :create, Forum
   %p
-    = link_to "New forum", new_forum_path, class: 'btn btn-default'
+    = link_to "New forum", new_forum_path, class: 'btn btn-outline-secondary'
 
 - @forums.each do |forum|
   %h2= forum

app/views/forums/show.html.haml

@@ -20,7 +20,7 @@
     #{ strip_tags markdownify(@forum.description) }
 
 - if can? :edit, @forum
-  = link_to "Edit", edit_forum_path(@forum), class: 'btn btn-default btn-xs'
+  = link_to "Edit", edit_forum_path(@forum), class: 'btn btn-outline-secondary btn-sm'
 - if can? :delete, @forum
   = link_to 'Delete', @forum, method: :delete, data: { confirm: 'Are you sure?' }
 

app/views/garden_types/_form.html.haml

@@ -8,13 +8,13 @@
 
   %h2 Basic information
 
-  .form-group
+  .mb-3
     = f.label :name, class: 'control-label col-md-2'
     .col-md-8
       = f.text_field :name, class: 'form-control'
       %span.help-block
         The name for the garden_type, i.e. "organic", in English (required).
 
-  .form-group
-    .form-actions.col-md-offset-2.col-md-8
+  .mb-3
+    .form-actions.offset-md-2.col-md-8
       = f.submit 'Save', class: 'btn btn-primary'

app/views/gardens/_overview.html.haml

@@ -4,7 +4,7 @@
       = link_to garden.name, garden_path(garden)
   .panel-body
     .row
-      .col-md-2.col-xs-12.garden-info
+      .col-md-2.col-12.garden-info
         %p= render 'gardens/photo', garden: garden
         %p= display_garden_description(garden)
         - if can?(:edit, garden)
@@ -14,7 +14,7 @@
         - if garden.plantings.current.size.positive?
           .row
             - garden.plantings.current.order(created_at: :desc).includes(:crop, :photos).each do |planting|
-              .col-lg-2.col-sm-4.col-xs-6
+              .col-lg-2.col-sm-4.col-6
                 = render "plantings/thumbnail", planting: planting
         - else
           no plantings

app/views/gardens/show.html.haml

@@ -32,7 +32,7 @@
         :markdown
           #{strip_tags markdownify(@garden.description)}
         - unless @garden.description.present?
-          .row-fluid
+          .row
             %p No description available yet.
 
             - if can? :edit, @garden
@@ -174,7 +174,7 @@
 
     - if @garden.owner == current_member
       %p
-        = link_to new_garden_path, class: 'btn btn-default btn-xs' do
+        = link_to new_garden_path, class: 'btn btn-outline-secondary btn-sm' do
           Add New Garden
 
     - if can?(:edit, @garden) && can?(:create, Photo)

app/views/harvests/show.html.haml

@@ -22,7 +22,7 @@
 
 .harvest
   .row
-    .col-md-8.col-xs-12
+    .col-md-8.col-12
       .jumbotron
         .d-flex.justify-content-between
           %h1.display-3
@@ -40,9 +40,9 @@
       = render 'likes/likes', object: @harvest
       = render 'harvests/actions', harvest: @harvest
 
-    .col-md-4.col-xs-12
+    .col-md-4.col-12
       = render 'harvests/owner', harvest: @harvest
-    .col-md-8.col-xs-12
+    .col-md-8.col-12
       .index-cards.facts
         - if @harvest.plant_part
           .card
@@ -74,6 +74,6 @@
           Havested from
           = link_to @harvest.planting, @harvest.planting
 
-    .col-md-4.col-xs-12
+    .col-md-4.col-12
       = render @harvest.crop
       = render 'crops/nutritional_data', crop: @harvest.crop

app/views/home/_blurb.html.haml

@@ -6,5 +6,5 @@
   .col-md-4
     .signup
       %p= t('.perks')
-      %p= link_to(t('.sign_up'), new_member_registration_path, class: 'btn btn-primary btn-block')
+      %p= link_to(t('.sign_up'), new_member_registration_path, class: 'btn btn-primary w-100')
       %p= t('.already_html', sign_in: link_to(t('.sign_in_linktext'), new_member_session_path, class: 'btn btn-primary'))

app/views/home/_discuss.html.haml

@@ -6,4 +6,4 @@
       = render 'posts/preview', post: post
 
 %p.text-end
-  = link_to "#{t('.view_all')} »", posts_path, class: 'btn btn-block'
+  = link_to "#{t('.view_all')} »", posts_path, class: 'btn w-100'

app/views/home/_members.html.haml

@@ -6,4 +6,4 @@
       .index-cards
         = render partial: 'members/member', collection: members
     %p.text-end
-      = link_to "#{t('.view_all')} »", members_path, class: 'btn btn-block'
+      = link_to "#{t('.view_all')} »", members_path, class: 'btn w-100'

app/views/home/_releases.html.haml

@@ -8,4 +8,4 @@
         %small= release[:updated].to_date.to_s
       .card-body= release[:content].html_safe
   %p
-    = link_to 'Find out more »', 'https://github.com/Growstuff/growstuff/releases', target: "_blank", class: 'btn btn-block'
+    = link_to 'Find out more »', 'https://github.com/Growstuff/growstuff/releases', target: "_blank", class: 'btn w-100'

app/views/home/index.html.haml

@@ -28,7 +28,7 @@
     %section.crops
       %h2= t('home.crops.our_crops')
       = render 'crops'
-      = link_to "#{t('home.crops.view_all')} »", crops_path, class: 'btn btn-block'
+      = link_to "#{t('home.crops.view_all')} »", crops_path, class: 'btn w-100'
   .col-xl-3.col-12
     %section.recent-crops.card
       - cache cache_key_for(Crop, 'recent') do
@@ -39,23 +39,23 @@
     %section.plantings
       = cute_icon
       =render 'plantings'
-      %p.text-end= link_to "#{t('home.plantings.view_all')} »", plantings_path, class: 'btn btn-block'
+      %p.text-end= link_to "#{t('home.plantings.view_all')} »", plantings_path, class: 'btn w-100'
   .col-xl-4.col
     %section.harvests
       = cute_icon
       = render 'harvests'
-      %p.text-end= link_to "#{t('home.harvests.view_all')} »", harvests_path, class: 'btn btn-block'
+      %p.text-end= link_to "#{t('home.harvests.view_all')} »", harvests_path, class: 'btn w-100'
   .col-xl-4.col
     %section.activities
       = cute_icon
       = render 'activities'
-      %p.text-end= link_to "#{t('home.activities.view_all')} »", activities_path, class: 'btn btn-block'
+      %p.text-end= link_to "#{t('home.activities.view_all')} »", activities_path, class: 'btn w-100'
   .col-12.col-md-6
     %section.seeds
       = cute_icon
       = render 'seeds'
       %p.text-end
-        = link_to "#{t('home.seeds.view_all')} »", seeds_path(tradeable_to: ['locally', 'nationally', 'internationally']), class: 'btn btn-block'
+        = link_to "#{t('home.seeds.view_all')} »", seeds_path(tradeable_to: ['locally', 'nationally', 'internationally']), class: 'btn w-100'
   .col-12.col-lg-6
     %section.discussion.text-center
       = cute_icon

app/views/members/_follow_buttons.haml

@@ -2,10 +2,10 @@
   - block = current_member.get_block(member)
   - follow = current_member.get_follow(member)
   - if !block && !follow && can?(:create, Follow) # not already following, and not blocking
-    = link_to 'Follow', follows_path(followed: member), method: :post, class: 'btn btn-block btn-success'
+    = link_to 'Follow', follows_path(followed: member), method: :post, class: 'btn w-100 btn-success'
   - if follow && can?(:destroy, follow) # already following
-    = link_to 'Unfollow', follow_path(follow), method: :delete, class: 'btn btn-block'
+    = link_to 'Unfollow', follow_path(follow), method: :delete, class: 'btn w-100'
   - if !block && can?(:create, Block) # not already blocking
-    = link_to 'Block', blocks_path(blocked: member), method: :post, class: 'btn btn-block btn-danger'
+    = link_to 'Block', blocks_path(blocked: member), method: :post, class: 'btn w-100 btn-danger'
   - if block && can?(:destroy, block) # already blocking
-    = link_to 'Unblock', block_path(block), method: :delete, class: 'btn btn-block'
+    = link_to 'Unblock', block_path(block), method: :delete, class: 'btn w-100'

app/views/members/finish_signup.haml

@@ -9,27 +9,27 @@
         = msg
         %br
 
-  .form-group
+  .mb-3
     = f.label :login_name
     .controls
       = f.text_field :login_name, autofocus: true, class: 'form-control input-lg'
       %p.help-block Choose a login name
 
-  .form-group
+  .mb-3
     = f.label :email
     .controls
       = f.text_field :email, class: 'form-control input-lg', placeholder: 'Example: email@me.com'
       %p.help-block Please confirm your email address.
 
-  .form-group
-    .col-md-offset-2.col-md-8.checkbox
+  .mb-3
+    .offset-md-2.col-md-8.checkbox
       %label
         = f.check_box :tos_agreement
         I agree to the
         = succeed "." do
           = link_to 'Terms of Service', "#{root_url}/policy/tos"
-  .form-group
-    .col-md-offset-2.col-md-8.checkbox
+  .mb-3
+    .offset-md-2.col-md-8.checkbox
       %label
         = f.check_box :newsletter, checked: true
         Subscribe to the #{ENV['GROWSTUFF_SITE_NAME']} newsletter

app/views/members/show.html.haml

@@ -62,12 +62,12 @@
               = @member.last_sign_in_at&.to_fs(:default)
 
         - if can? :update, @member
-          = link_to edit_member_registration_path, class: 'btn btn-block' do
+          = link_to edit_member_registration_path, class: 'btn w-100' do
             = member_icon
             = t('members.edit_profile')
 
         - if can?(:create, Notification) && current_member != @member
-          = link_to new_message_path(recipient_id: @member.id), class: 'btn btn-block' do
+          = link_to new_message_path(recipient_id: @member.id), class: 'btn w-100' do
             = icon('fas', 'envelope')
             Send message
 
@@ -75,7 +75,7 @@
 
         - if can?(:destroy, @member)
           %hr/
-          = link_to admin_member_path(slug: @member.slug), method: :delete, data: { confirm: 'Are you sure?' }, class: 'btn btn-block btn-light text-danger' do
+          = link_to admin_member_path(slug: @member.slug), method: :delete, data: { confirm: 'Are you sure?' }, class: 'btn w-100 btn-light text-danger' do
             = icon 'fas', 'ban'
             Ban member
           %hr/
@@ -140,11 +140,11 @@
             - @activity.each do |event|
               .list-group-item.list-group-item-action.flex-column.align-items-start{:href => "#!"}
                 .d-flex.w-100.justify-content-between
-                  %h5.col-md-11.col-xs-10.text-truncate
+                  %h5.col-md-11.col-10.text-truncate
                     = icon_for_model(event.event_type)
                     = event_description(event)
                     = render 'timeline/photos', photo: resolve_model(event) if event.event_type == 'photo'
-                  %small.col-md-1.col-xs-2.text-end
+                  %small.col-md-1.col-2.text-end
                     - if event.event_at.present?
                       - if event.event_at.kind_of?(Date)
                         #{distance_of_time_in_words(event.event_at, Time.zone.now.to_date)} ago

app/views/photos/edit.html.haml

@@ -3,33 +3,33 @@
   .col-md-10
     - content_for :title, "Edit Photo"
     = form_for(@photo) do |f|
-      .form-group
+      .mb-3
         = f.label :title
         = f.text_field :title, placeholder: "title", required: true
 
-      .form-group
+      .mb-3
         = f.label :thumbnail_url
         = f.url_field :thumbnail_url
 
-      .form-group
+      .mb-3
         = f.label :fullsize_url
         = f.url_field :fullsize_url
 
-      .form-group
+      .mb-3
         = f.label :link_url
         = f.url_field :link_url
 
-      .form-group
+      .mb-3
         = f.label :license_name
         = f.text_field :license_name
 
-      .form-group
+      .mb-3
         = f.label :license_url
         = f.text_field :license_url
 
-      .form-group
+      .mb-3
         = f.label :date_taken
         = f.datetime_field :date_taken
 
-      .form-group
+      .mb-3
         .form-actions= f.submit 'Save', class: 'btn'

app/views/places/_search_form.html.haml

@@ -1,5 +1,5 @@
 %form.form-inline{ action: search_places_path, method: :get, role: 'form' }
-  .form-group
+  .mb-3
     = label_tag :new_place, "Change location:", class: 'visually-hidden'
     = text_field_tag :new_place, '', class: 'form-control', placeholder: "Search for city, suburb or state..."
   = submit_tag "Search", class: 'btn btn-primary', id: "search_button"

app/views/plant_parts/index.html.haml

@@ -20,8 +20,8 @@
       .card-footer
         %p
           - if can? :edit, plant_part
-            = link_to t('buttons.edit'), edit_plant_part_path(plant_part), class: 'btn btn-default btn-xs'
+            = link_to t('buttons.edit'), edit_plant_part_path(plant_part), class: 'btn btn-outline-secondary btn-sm'
           - if can? :destroy, plant_part
-            = link_to t('buttons.delete'), plant_part, method: :delete, data: { confirm: t(:are_you_sure?) }, class: 'btn btn-default btn-xs'
+            = link_to t('buttons.delete'), plant_part, method: :delete, data: { confirm: t(:are_you_sure?) }, class: 'btn btn-outline-secondary btn-sm'
 
 = will_paginate(@plant_parts)

app/views/plant_parts/show.html.haml

@@ -18,6 +18,6 @@
 
 %p
 - if can? :edit, @plant_part
-  = link_to 'Edit', edit_plant_part_path(@plant_part), class: 'btn btn-default btn-xs'
+  = link_to 'Edit', edit_plant_part_path(@plant_part), class: 'btn btn-outline-secondary btn-sm'
 - if can? :destroy, @plant_part
-  = link_to 'Delete', @plant_part, method: :delete, data: { confirm: 'Are you sure?' }, class: 'btn btn-default btn-xs'
+  = link_to 'Delete', @plant_part, method: :delete, data: { confirm: 'Are you sure?' }, class: 'btn btn-outline-secondary btn-sm'

app/views/plantings/_actions.html.haml

@@ -14,7 +14,7 @@
         .dropdown-divider
         .px-2
           = form_tag transplant_planting_path(planting), method: :post do
-            .form-group
+            .mb-3
               = label_tag :garden_id, 'Transplant to:'
               = select_tag :garden_id, options_from_collection_for_select(transplantable_gardens_by_owner(planting), :id, :name), class: 'form-control form-control-sm'
             = submit_tag 'Transplant', class: 'btn btn-sm btn-primary mt-2'

app/views/plantings/show.html.haml

@@ -40,7 +40,7 @@
 
 .planting
   .row
-    .col-md-8.col-xs-12
+    .col-md-8.col-12
       .jumbotron
         .d-flex.justify-content-between
           %h1.display-3
@@ -64,10 +64,10 @@
       = render 'likes/likes', object: @planting
       = render 'plantings/actions', planting: @planting
 
-    .col-md-4.col-xs-12
+    .col-md-4.col-12
       = render 'plantings/owner', planting: @planting
 
-    .col-md-8.col-xs-12
+    .col-md-8.col-12
       %section= render 'facts', planting: @planting
       - if @planting.description.present?
         = cute_icon
@@ -106,7 +106,7 @@
             - @finished_activities.each do |activity|
               = render "activities/card", activity: activity
 
-    .col-md-4.col-xs-12
+    .col-md-4.col-12
       = render @planting.crop
 
       - if @planting.location

app/views/scientific_names/_form.html.haml

@@ -14,20 +14,20 @@
       = link_to "crop wrangling guide", "https://github.com/Growstuff/growstuff/wiki/Crop-Wrangling"
       on the Growstuff wiki.
 
-  .form-group
+  .mb-3
     = f.label :crop_id, class: 'control-label col-md-2'
     .col-md-8
       = select(:scientific_name, :crop_id, Crop.order(:name).pluck(:name, :id),
         { selected: @scientific_name.crop_id || @crop.id },
         class: 'form-control')
-  .form-group
+  .mb-3
     = f.label :name, class: 'control-label col-md-2'
     .col-md-8
       = f.text_field :name, class: 'form-control'
-  .form-group
+  .mb-3
     = f.label :wikidata_id, "Wikidata ID", class: 'control-label col-md-2'
     .col-md-8
       = f.text_field :wikidata_id, class: 'form-control', pattern: 'Q[1-9][0-9]*'
-  .form-group
-    .form-actions.col-md-offset-2.col-md-8
+  .mb-3
+    .form-actions.offset-md-2.col-md-8
       = f.submit 'Save', class: 'btn btn-primary'

app/views/scientific_names/index.html.haml

@@ -17,10 +17,10 @@
       %td= link_to 'Show', scientific_name
       %td
         - if can? :edit, scientific_name
-          = link_to t('buttons.edit'), edit_scientific_name_path(scientific_name), class: 'btn btn-default btn-xs'
+          = link_to t('buttons.edit'), edit_scientific_name_path(scientific_name), class: 'btn btn-outline-secondary btn-sm'
       %td
         - if can? :destroy, scientific_name
           = link_to t('buttons.delete'), scientific_name, method: :delete, data: { confirm: t(:are_you_sure?) },
-            class: 'btn btn-default btn-xs'
+            class: 'btn btn-outline-secondary btn-sm'
 
 = will_paginate @scientific_names

app/views/scientific_names/show.html.haml

@@ -20,6 +20,6 @@
 
 
 - if can? :edit, @scientific_name
-  = link_to 'Edit', edit_scientific_name_path(@scientific_name), class: 'btn btn-default btn-xs'
+  = link_to 'Edit', edit_scientific_name_path(@scientific_name), class: 'btn btn-outline-secondary btn-sm'
   \|
 = link_to 'Back', scientific_names_path

app/views/seeds/_facts.html.haml

@@ -33,7 +33,7 @@
       - if seed.owner.location.blank?
         (from unspecified location)
         - if current_member == seed.owner
-          = link_to "Set Location", edit_registration_path(current_member), class: 'btn btn-default btn-xs'
+          = link_to "Set Location", edit_registration_path(current_member), class: 'btn btn-outline-secondary btn-sm'
       - else
         (from #{link_to seed.owner.location, place_path(seed.owner.location, anchor: "seeds")})
 

app/views/seeds/_form.html.haml

@@ -15,7 +15,7 @@
             - @seed.errors.full_messages.each do |msg|
               %li= msg
 
-      .form-group.required
+      .mb-3.required
         = f.label :crop, 'Crop'
         - if @planting
           = link_to @planting, planting_path(@planting)

app/views/shared/buttons/_delete.haml

@@ -1,4 +1,4 @@
 = link_to path, method: :delete,
-          data: { confirm: t(:are_you_sure?) }, class: 'btn btn-default btn-xs' do
+          data: { confirm: t(:are_you_sure?) }, class: 'btn btn-outline-secondary btn-sm' do
   = render 'shared/glyphicon', icon: 'trash', title: 'buttons.delete'
   =t('buttons.delete')

app/views/shared/buttons/_edit.haml

@@ -1,3 +1,3 @@
-= link_to path, class: 'btn btn-default' do
+= link_to path, class: 'btn btn-outline-secondary' do
   = render 'shared/glyphicon', icon: 'pencil', title: 'buttons.edit'
   =t('buttons.edit')