diff --git a/uber/templates/api/index.html b/uber/templates/api/index.html
index dd58652ea..f0c5d5166 100644
--- a/uber/templates/api/index.html
+++ b/uber/templates/api/index.html
@@ -101,9 +101,9 @@ <h3>
     {% if admin_account.is_super_admin %}All{% else %}Your{% endif %} Tokens
   </h3>
   {% if show_revoked %}
-    <a id="btn_show_revoked" href="index" class="btn btn-xs btn-plain">
+    <a id="btn_show_revoked" href="index" class="btn btn-sm btn-outline-secondary">
   {% else %}
-    <a id="btn_show_revoked" href="index?show_revoked=true" class="btn btn-xs btn-outline-secondary">
+    <a id="btn_show_revoked" href="index?show_revoked=true" class="btn btn-sm btn-outline-secondary">
   {% endif %}
       <i class="fa fa-filter"></i>
       Show Revoked Tokens
@@ -150,7 +150,7 @@ <h3>
                 {% else %}
                   <form method="post" action="revoke_api_token" role="form">
                     <input type="hidden" name="id" value="{{ token.id }}"/>
-                    <button class="btn btn-xs btn-danger" type="submit">Revoke</button>
+                    <button class="btn btn-sm btn-danger" type="submit">Revoke</button>
                   </form>
                 {% endif %}
               </td>
diff --git a/uber/templates/attractions_admin/checkin.html b/uber/templates/attractions_admin/checkin.html
index a61746310..a47e3ee3d 100644
--- a/uber/templates/attractions_admin/checkin.html
+++ b/uber/templates/attractions_admin/checkin.html
@@ -189,14 +189,14 @@
     };
 
     var toggleShowCheckedIn = function(isShowing) {
-      $showCheckedInButton.toggleClass('btn-plain', !isShowing);
+      $showCheckedInButton.toggleClass('btn-outline-secondary', !isShowing);
       $showCheckedInButton.toggleClass('btn-outline-secondary', isShowing);
       $container.toggleClass('show-checked-in', !isShowing);
     };
 
     $showCheckedInButton.on('click', function(event) {
       event.preventDefault();
-      toggleShowCheckedIn($showCheckedInButton.hasClass('btn-plain'));
+      toggleShowCheckedIn($showCheckedInButton.hasClass('btn-outline-secondary'));
     });
 
     $('.form-control-feedback').on('click', function(event) {
@@ -317,7 +317,7 @@ <h2 class="ident">
     </div>
   </div>
   <br/>
-  <button id="filter" class="btn btn-xs btn-xs btn-outline-secondary">
+  <button id="filter" class="btn btn-sm btn-sm btn-outline-secondary">
     <i class="fa fa-filter"></i>
     Show Already Checked In
   </button>
diff --git a/uber/templates/attractions_admin/event.html b/uber/templates/attractions_admin/event.html
index deaf8c271..4bd4167ac 100644
--- a/uber/templates/attractions_admin/event.html
+++ b/uber/templates/attractions_admin/event.html
@@ -232,14 +232,14 @@ <h2 class="attendees-title">Attendees Signed Up</h2>
           <td>#{{ signup.attendee.badge_num }}</td>
           <td>{{ signup.signup_time|datetime_local('%A, %b %-e at %-I:%M%p') }}</td>
           <td class="checkin {% if signup.is_checked_in %} checked-in{% endif %}" data-order="{{ signup.checkin_time }}">
-            <button class="btn btn-warning btn-xs checked-in-visible" data-signup-id="{{ signup.id }}">
+            <button class="btn btn-warning btn-sm checked-in-visible" data-signup-id="{{ signup.id }}">
               <i class="fa fa-check"></i>
               Undo
             </button>
             <span class="checkin_time checked-in-visible">
               {{ signup.checkin_time_local|datetime('%A, %b %-e at %-I:%M%p') }}
             </span>
-            <button class="btn btn-success btn-xs checked-in-hidden" data-signup-id="{{ signup.id }}">
+            <button class="btn btn-success btn-sm checked-in-hidden" data-signup-id="{{ signup.id }}">
               <i class="fa fa-check"></i>
               Check In Now
             </button>
@@ -248,7 +248,7 @@ <h2 class="attendees-title">Attendees Signed Up</h2>
             <span {% if signup.is_checked_in -%}
                 title="You cannot cancel a signup that has already checked in" {% endif -%}
                 style="display: inline-block;">
-              <button class="btn btn-xs btn-danger"
+              <button class="btn btn-sm btn-danger"
                   {%- if signup.is_checked_in %} disabled="disabled"{% endif %}
                   data-signup-id="{{ signup.id }}"
                   data-attendee-name="{{ signup.attendee.full_name }}">
diff --git a/uber/templates/attractions_admin/form.html b/uber/templates/attractions_admin/form.html
index b89d79a21..7a3bef09c 100644
--- a/uber/templates/attractions_admin/form.html
+++ b/uber/templates/attractions_admin/form.html
@@ -652,7 +652,7 @@ <h1>
       <input type="hidden" name="id" value="{{ attraction.id }}">
       <button
           type="submit"
-          class="btn btn-xs btn-danger"
+          class="btn btn-sm btn-danger"
           {% if attraction.features %}disabled="disabled"{% endif %}>
         <i class="fa fa-remove"></i>
         Delete Attraction
@@ -663,14 +663,14 @@ <h1>
   {% if can_admin_attraction -%}
     <button
         type="button"
-        class="btn btn-xs btn-primary"
+        class="btn btn-sm btn-primary"
         data-bs-toggle="modal"
         data-bs-target="#edit_attraction"
         title="Edit the {{ attraction.name }} Attraction">
       <i class="fa fa-cog"></i>
     </button>
   {%- endif %}
-  <a href="checkin?id={{ attraction.slug }}" class="btn btn-xs btn-primary">
+  <a href="checkin?id={{ attraction.slug }}" class="btn btn-sm btn-primary">
     <i class="fa fa-check"></i>
     Check In Attendees
   </a>
@@ -726,7 +726,7 @@ <h1>
 <h2>
   {{ attraction.name }} Features
   {% if can_admin_attraction -%}
-    <a class="btn btn-xs btn-primary"
+    <a class="btn btn-sm btn-primary"
         title="Add a new feature"
         href="feature?attraction_id={{ attraction.id }}">
       <i class="fa fa-plus"></i>
@@ -760,13 +760,13 @@ <h3>{{ feature.name }}</h3>
               <h3 class="feature-title">
                 {% if can_admin_attraction -%}
                   <div class="controls pull-right">
-                    <a class="btn btn-xs btn-primary btn-fade"
+                    <a class="btn btn-sm btn-primary btn-fade"
                         title="Export signup list for {{ feature.name }}"
                         href="export_feature?id={{ feature.id }}"
                         download="download">
                       <i class="fa fa-download-alt"></i>
                     </a>
-                    <a class="btn btn-xs btn-primary btn-fade"
+                    <a class="btn btn-sm btn-primary btn-fade"
                         title="Edit the {{ feature.name }} feature"
                         href="feature?id={{ feature.id }}">
                       <i class="fa fa-cog"></i>
@@ -779,7 +779,7 @@ <h3 class="feature-title">
                         title="Delete the {{ feature.name }} feature">
                       {{ csrf_token() }}
                       <input type="hidden" name="id" value="{{ feature.id }}">
-                      <button type="submit" class="btn btn-xs btn-danger btn-fade">
+                      <button type="submit" class="btn btn-sm btn-danger btn-fade">
                         <i class="fa fa-remove"></i>
                       </button>
                     </form>
@@ -787,7 +787,7 @@ <h3 class="feature-title">
                 {%- endif %}
                 <span>{{ feature.name }}</span>
                 {% if can_admin_attraction -%}
-                  <a class="btn btn-xs btn-primary"
+                  <a class="btn btn-sm btn-primary"
                       title="Schedule a new {{ feature.name }} event"
                       href="event?feature_id={{ feature.id }}">
                     <i class="fa fa-time"></i>
@@ -865,12 +865,12 @@ <h2 id="{{ feature.id }}_{{ location }}_{{ day }}">{{ day }}
                                   style="min-height: {{ (event.duration // 90) - 6 }}px">
                                 {% if can_admin_attraction -%}
                                   <div class="controls pull-right">
-                                    <a class="btn btn-xs btn-primary btn-fade"
+                                    <a class="btn btn-sm btn-primary btn-fade"
                                         title="Edit this event"
                                         href="event?id={{ event.id }}">
                                       <i class="fa fa-cog"></i>
                                     </a>
-                                    <button type="submit" class="btn btn-xs btn-danger btn-fade delete-event" data-event-id="{{ event.id }}" data-event-label="{{ feature.name }} at {{ event.start_time_label }}">
+                                    <button type="submit" class="btn btn-sm btn-danger btn-fade delete-event" data-event-id="{{ event.id }}" data-event-label="{{ feature.name }} at {{ event.start_time_label }}">
                                       <i class="fa fa-remove"></i>
                                     </button>
                                   </div>
diff --git a/uber/templates/attractions_admin/index.html b/uber/templates/attractions_admin/index.html
index 598cc4e27..a4be1863a 100644
--- a/uber/templates/attractions_admin/index.html
+++ b/uber/templates/attractions_admin/index.html
@@ -13,9 +13,9 @@ <h1>
     {% endif %}
   </h1>
   {% if filtered %}
-    <a class="btn btn-xs btn-plain" href="index">
+    <a class="btn btn-sm btn-outline-secondary" href="index">
   {% else %}
-    <a class="btn btn-xs btn-outline-secondary" href="index?filtered=1">
+    <a class="btn btn-sm btn-outline-secondary" href="index?filtered=1">
   {% endif %}
       <i class="fa fa-filter"></i>
       Show only my attractions
diff --git a/uber/templates/dept_admin/form.html b/uber/templates/dept_admin/form.html
index 66d72fb3a..08cb9d63e 100644
--- a/uber/templates/dept_admin/form.html
+++ b/uber/templates/dept_admin/form.html
@@ -76,7 +76,8 @@
           if (result.error) {
             showErrorMessage(result.error);
           } else {
-            $btn.toggleClass('btn-outline-secondary')
+            $btn.toggleClass('btn-secondary');
+            $btn.toggleClass('btn-outline-secondary');
           }
       }, 'json');
     });
@@ -100,7 +101,7 @@
       {%- if is_admin_dept_head -%}
       <button
           type="button"
-          class="btn btn-xs btn-inherent_role btn-{% if is_dept_head %}plain{% else %}default{% endif %}"
+          class="btn btn-sm btn-inherent_role btn-{% if not is_dept_head %}outline-{% endif %}secondary"
           data-role="dept_head"
           {% if is_dept_head %}
             title="Remove {{ attendee.full_name }} as a department head of the {{ department.name }} department"
@@ -111,7 +112,7 @@
       </button>{%- endif -%}
       <button
           type="button"
-          class="btn btn-xs btn-inherent_role btn-{% if is_poc %}plain{% else %}default{% endif %}"
+          class="btn btn-sm btn-inherent_role btn-{% if not is_poc %}outline-{% endif %}secondary"
           data-role="poc"
           {% if is_poc %}
             title="Remove {{ attendee.full_name }} as a point of contact of the {{ department.name }} department"
@@ -122,7 +123,7 @@
       </button>{#- strip whitespace -#}
       <button
           type="button"
-          class="btn btn-xs btn-inherent_role btn-{% if is_checklist_admin %}plain{% else %}default{% endif %}"
+          class="btn btn-sm btn-inherent_role btn-{% if not is_checklist_admin %}outline-{% endif %}secondary"
           data-role="checklist_admin"
           {% if is_checklist_admin %}
             title="Remove {{ attendee.full_name }} as a checklist admin of the {{ department.name }} department"
@@ -247,7 +248,7 @@ <h4 class="modal-title" id="edit_department_title">
 <h1>
   {{ department.name }} Department
   {% if is_admin_dept_head -%}
-    <button type="button" class="btn btn-xs btn-primary" data-bs-toggle="modal" data-bs-target="#edit_department">
+    <button type="button" class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#edit_department">
       <i class="fa fa-cog"></i>
     </button>
     <form
@@ -264,7 +265,7 @@ <h1>
       <input
           type="submit"
           value="Delete Department"
-          class="btn btn-xs btn-danger"
+          class="btn btn-sm btn-danger"
           {% if department.member_count > 1 %}disabled="disabled"{% endif %}>
     </form>
   {%- endif %}
@@ -315,7 +316,7 @@ <h3>
         Roles
         {% if can_admin_dept -%}
           <a
-              class="btn btn-xs btn-primary"
+              class="btn btn-sm btn-primary"
               title="Create a new department role"
               href="role?department_id={{ department.id }}">
             <i class="fa fa-plus"></i>
@@ -350,7 +351,7 @@ <h3>
                   {% if can_admin_dept -%}
                     <td class="controls">
                       <a
-                          class="btn btn-xs btn-primary"
+                          class="btn btn-sm btn-primary"
                           title="Edit the {{ role.name }} department role"
                           href="role?id={{ role.id }}">
                         <i class="fa fa-cog"></i>
@@ -363,7 +364,7 @@ <h3>
                           title="Delete the {{ role.name }} department role">
                         {{ csrf_token() }}
                         <input type="hidden" name="id" value="{{ role.id }}">
-                        <button type="submit" class="btn btn-xs btn-danger">
+                        <button type="submit" class="btn btn-sm btn-danger">
                           <i class="fa fa-remove"></i>
                         </button>
                       </form>
@@ -468,7 +469,7 @@ <h3>Members</h3>
                         {{ csrf_token() }}
                         <input type="hidden" name="department_id" value="{{ department.id }}" />
                         <input type="hidden" name="attendee_id" value="{{ attendee.id }}" />
-                        <button type="submit" class="btn btn-xs btn-danger">
+                        <button type="submit" class="btn btn-sm btn-danger">
                           <i class="fa fa-remove"></i>
                         </button>
                       </form>
diff --git a/uber/templates/dept_admin/index.html b/uber/templates/dept_admin/index.html
index d38886710..473a8dce9 100644
--- a/uber/templates/dept_admin/index.html
+++ b/uber/templates/dept_admin/index.html
@@ -5,9 +5,9 @@
   <h1>
     Departments
     {% if filtered %}
-      <a class="btn btn-xs btn-plain" href="index">
+      <a class="btn btn-sm btn-outline-secondary" href="index">
     {% else %}
-      <a class="btn btn-xs btn-outline-secondary" href="index?filtered=1">
+      <a class="btn btn-sm btn-outline-secondary" href="index?filtered=1">
     {% endif %}
         <i class="fa fa-filter"></i>
         Show only my departments
diff --git a/uber/templates/dept_admin/requests.html b/uber/templates/dept_admin/requests.html
index 4773d771d..f85fc30e4 100644
--- a/uber/templates/dept_admin/requests.html
+++ b/uber/templates/dept_admin/requests.html
@@ -53,9 +53,9 @@ <h2>
 </h2>
 <p class="subheader">
   {% if requested_any %}
-    <a class="btn btn-xs btn-plain" href="requests?department_id={{ department.id }}">
+    <a class="btn btn-sm btn-outline-secondary" href="requests?department_id={{ department.id }}">
   {% else %}
-    <a class="btn btn-xs btn-outline-secondary" href="requests?department_id={{ department.id }}&requested_any=1">
+    <a class="btn btn-sm btn-outline-secondary" href="requests?department_id={{ department.id }}&requested_any=1">
   {% endif %}
       <i class="fa fa-filter"></i>
       Include volunteers willing to help Anywhere
diff --git a/uber/templates/dept_checklist/overview.html b/uber/templates/dept_checklist/overview.html
index 395804d9a..c66e5b991 100644
--- a/uber/templates/dept_checklist/overview.html
+++ b/uber/templates/dept_checklist/overview.html
@@ -112,9 +112,9 @@
 <h2>
   Department Checklists
   {% if filtered %}
-    <a class="btn btn-xs btn-outline-secondary" href="overview">
+    <a class="btn btn-sm btn-outline-secondary" href="overview">
   {% else %}
-    <a class="btn btn-xs btn-outline-secondary" href="overview?filtered=1">
+    <a class="btn btn-sm btn-outline-secondary" href="overview?filtered=1">
   {% endif %}
       <i class="fa fa-lg fa-filter"></i>
       Show only my checklists
diff --git a/uber/templates/group_admin/guests.html b/uber/templates/group_admin/guests.html
index 803e7e079..5c4e85b12 100644
--- a/uber/templates/group_admin/guests.html
+++ b/uber/templates/group_admin/guests.html
@@ -20,8 +20,8 @@
                 {% if group.guest -%}
                   &nbsp;
                   <div class="btn-group" role="group" aria-label="...">
-                  <a href="checklist_info?id={{ group.guest.id }}" class="btn btn-xs btn-outline-secondary"><i class="fa fa-cog" data-bs-toggle="tooltip" title="{{ group.guest.group_type_label }} Info"></i></a>
-                  <a href="../guests/index?id={{ group.guest.id }}" class="btn btn-xs btn-primary"><i class="fa fa-check" data-bs-toggle="tooltip" title="{{ group.guest.group_type_label }} Checklist"></i></a>
+                  <a href="checklist_info?id={{ group.guest.id }}" class="btn btn-sm btn-outline-secondary"><i class="fa fa-cog" data-bs-toggle="tooltip" title="{{ group.guest.group_type_label }} Info"></i></a>
+                  <a href="../guests/index?id={{ group.guest.id }}" class="btn btn-sm btn-primary"><i class="fa fa-check" data-bs-toggle="tooltip" title="{{ group.guest.group_type_label }} Checklist"></i></a>
                   </div>
                 {% endif %}
             </span>
diff --git a/uber/templates/group_admin/mivs.html b/uber/templates/group_admin/mivs.html
index 201440f6d..62bfd8553 100644
--- a/uber/templates/group_admin/mivs.html
+++ b/uber/templates/group_admin/mivs.html
@@ -17,8 +17,8 @@
                 {% if group.guest -%}
                   &nbsp;
                   <div class="btn-group" role="group" aria-label="...">
-                  <a href="checklist_info?id={{ group.guest.id }}" class="btn btn-xs btn-outline-secondary"><i class="fa fa-cog" data-bs-toggle="tooltip" title="{{ group.guest.group_type_label }} Info"></i></a>
-                  <a href="../guests/index?id={{ group.guest.id }}" class="btn btn-xs btn-primary"><i class="fa fa-check" data-bs-toggle="tooltip" title="{{ group.guest.group_type_label }} Checklist"></i></a>
+                  <a href="checklist_info?id={{ group.guest.id }}" class="btn btn-sm btn-outline-secondary"><i class="fa fa-cog" data-bs-toggle="tooltip" title="{{ group.guest.group_type_label }} Info"></i></a>
+                  <a href="../guests/index?id={{ group.guest.id }}" class="btn btn-sm btn-primary"><i class="fa fa-check" data-bs-toggle="tooltip" title="{{ group.guest.group_type_label }} Checklist"></i></a>
                   </div>
                 {% endif %}
             </span>
diff --git a/uber/templates/guest_reports/rock_island.html b/uber/templates/guest_reports/rock_island.html
index 8a9bae91d..5959ddfb6 100644
--- a/uber/templates/guest_reports/rock_island.html
+++ b/uber/templates/guest_reports/rock_island.html
@@ -5,7 +5,7 @@
 
 {% macro empty_filter(only_empty) %}
   <a
-      class="filter btn btn-xs btn-{% if only_empty %}plain{% else %}default{% endif %}"
+      class="filter btn btn-sm btn-{% if only_empty %}plain{% else %}default{% endif %}"
       href="../guest_reports/rock_island{% if not only_empty %}?only_empty=1{% endif %}">
     <i class="fa fa-filter"></i>
     Show Only Empty Inventory
diff --git a/uber/templates/promo_codes/generate_promo_codes.html b/uber/templates/promo_codes/generate_promo_codes.html
index 0e6203c12..74fd434b9 100644
--- a/uber/templates/promo_codes/generate_promo_codes.html
+++ b/uber/templates/promo_codes/generate_promo_codes.html
@@ -413,7 +413,7 @@ <h1>Promo Code Words</h1>
     <div id="{{part_of_speech}}s" class="words col-sm-6 col-md-3">
       <h4>
         {{part_of_speech|title}}s
-        <button class="btn btn-clear btn-xs btn-outline-secondary pull-right" data-part_of_speech_index="{{part_of_speech_index}}">
+        <button class="btn btn-clear btn-sm btn-outline-secondary pull-right" data-part_of_speech_index="{{part_of_speech_index}}">
           Clear All
         </button>
       </h4>
diff --git a/uber/templates/registration/attendee_shifts.html b/uber/templates/registration/attendee_shifts.html
index 1df8b845d..fa0cf47ca 100644
--- a/uber/templates/registration/attendee_shifts.html
+++ b/uber/templates/registration/attendee_shifts.html
@@ -73,7 +73,7 @@ <h2>{{ attendee.full_name }} {% if c.AT_THE_CON and attendee.badge_num %}({{ att
         <select name="job_id" {% if not jobs %}disabled="disabled"{% endif %}>
             {{ options(jobs) }}
         </select>
-        <input type="submit" value="Assign" class="btn btn-xs btn-success" {% if not jobs %}disabled="disabled"{% endif %}/>
+        <input type="submit" value="Assign" class="btn btn-sm btn-success" {% if not jobs %}disabled="disabled"{% endif %}/>
       </form>
     </td>
     <td width="50%" align="right">
@@ -82,7 +82,7 @@ <h2>{{ attendee.full_name }} {% if c.AT_THE_CON and attendee.badge_num %}({{ att
         <input type="hidden" name="id" value="{{ attendee.id }}" />
         <b>Non-shift hours:</b>
         <input type="text" class="focus" name="nonshift_hours" value="{{ attendee.nonshift_minutes / 60 }}" style="width:3.5em" />
-        <input type="submit" value="Update" class="btn btn-xs btn-primary"/>
+        <input type="submit" value="Update" class="btn btn-sm btn-primary"/>
       </form>
     </td>
 </tr>
@@ -136,7 +136,7 @@ <h2>{{ attendee.full_name }} {% if c.AT_THE_CON and attendee.badge_num %}({{ att
               <form method="post" action="../shifts_admin/unassign_shift">
                 {{ csrf_token() }}
                 <input type="hidden" name="shift_id" value="{{ shift.id }}" />
-                <input type="submit" value="Unassign" class="btn btn-xs btn-warning"/>
+                <input type="submit" value="Unassign" class="btn btn-sm btn-warning"/>
               </form>
             </td>
           </tr>
diff --git a/uber/templates/shifts_admin/job_renderer.html b/uber/templates/shifts_admin/job_renderer.html
index eba6897d6..7da72efc3 100644
--- a/uber/templates/shifts_admin/job_renderer.html
+++ b/uber/templates/shifts_admin/job_renderer.html
@@ -81,7 +81,7 @@
                 ))
             .append(
                 $('<td class="text-end"></td>').append(
-                    $('<button class="btn btn-xs btn-warning">Unassign</button>').click(function() {
+                    $('<button class="btn btn-sm btn-warning">Unassign</button>').click(function() {
                         $.post('unassign', {
                             csrf_token: csrf_token,
                             id: shift.id
@@ -134,7 +134,7 @@
                     .append('<td><span class="text-nowrap">(' + job.shifts.length + '/' + job.slots + ' slots filled)</span></td>')
                     .append(
                         $('<td class="text-end"></td>').append(
-                            jobIsFull ? '' : $('<button class="btn btn-xs btn-success">Assign</button>').click(function() {
+                            jobIsFull ? '' : $('<button class="btn btn-sm btn-success">Assign</button>').click(function() {
                                 var attendee = $('#attendee').val();
                                 if (attendee) {
                                     $.post('assign', {
diff --git a/uber/templates/shifts_admin/signups.html b/uber/templates/shifts_admin/signups.html
index 653c81b76..1cf660471 100644
--- a/uber/templates/shifts_admin/signups.html
+++ b/uber/templates/shifts_admin/signups.html
@@ -29,26 +29,26 @@
   </div>
 {% endif %}
 
-<a href="signups?department_id={{ department_id }}&toggle_filter=signups_hide_filled" class="btn btn-xs 
-        {% if hide_filled %}btn-plain{% else %}btn-outline-secondary{% endif %}">
+<a href="signups?department_id={{ department_id }}&toggle_filter=signups_hide_filled" class="btn btn-sm 
+        {% if hide_filled %}btn-outline-secondary{% else %}btn-outline-secondary{% endif %}">
   <i class="fa fa-filter"></i>
   Hide Filled Shifts
 </a>
 
-<a href="signups?department_id={{ department_id }}&toggle_filter=signups_show_past_shifts" class="btn btn-xs 
-        {% if show_past_shifts %}btn-plain{% else %}btn-outline-secondary{% endif %}">
+<a href="signups?department_id={{ department_id }}&toggle_filter=signups_show_past_shifts" class="btn btn-sm 
+        {% if show_past_shifts %}btn-outline-secondary{% else %}btn-outline-secondary{% endif %}">
   <i class="fa fa-filter"></i>
   Show Past Shifts
 </a>
 
-<a href="signups?department_id={{ department_id }}&toggle_filter=signups_show_restricted" class="btn btn-xs 
-        {% if show_restricted %}btn-plain{% else %}btn-outline-secondary{% endif %}">
+<a href="signups?department_id={{ department_id }}&toggle_filter=signups_show_restricted" class="btn btn-sm 
+        {% if show_restricted %}btn-outline-secondary{% else %}btn-outline-secondary{% endif %}">
   <i class="fa fa-filter"></i>
   Show Restricted
 </a>
 
-<a href="signups?department_id={{ department_id }}&toggle_filter=signups_show_nonpublic" class="btn btn-xs 
-        {% if show_nonpublic %}btn-plain{% else %}btn-outline-secondary{% endif %}">
+<a href="signups?department_id={{ department_id }}&toggle_filter=signups_show_nonpublic" class="btn btn-sm 
+        {% if show_nonpublic %}btn-outline-secondary{% else %}btn-outline-secondary{% endif %}">
   <i class="fa fa-filter"></i>
   Show Non Public
 </a>
diff --git a/uber/templates/shifts_admin/unfilled_shifts.html b/uber/templates/shifts_admin/unfilled_shifts.html
index 607b9e935..72af59c5a 100644
--- a/uber/templates/shifts_admin/unfilled_shifts.html
+++ b/uber/templates/shifts_admin/unfilled_shifts.html
@@ -16,20 +16,20 @@
 </style>
 
 <p>
-  <a href="unfilled_shifts?department_id={{ department_id }}&toggle_filter=unfilled_show_past_shifts" class="btn btn-xs 
-          {% if show_past_shifts %}btn-plain{% else %}btn-outline-secondary{% endif %}">
+  <a href="unfilled_shifts?department_id={{ department_id }}&toggle_filter=unfilled_show_past_shifts" class="btn btn-sm 
+          {% if show_past_shifts %}btn-outline-secondary{% else %}btn-outline-secondary{% endif %}">
     <i class="fa fa-filter"></i>
     Show Past Shifts
   </a>
 
-  <a href="unfilled_shifts?department_id={{ department_id }}&toggle_filter=unfilled_show_restricted" class="btn btn-xs 
-          {% if show_restricted %}btn-plain{% else %}btn-outline-secondary{% endif %}">
+  <a href="unfilled_shifts?department_id={{ department_id }}&toggle_filter=unfilled_show_restricted" class="btn btn-sm 
+          {% if show_restricted %}btn-outline-secondary{% else %}btn-outline-secondary{% endif %}">
     <i class="fa fa-filter"></i>
     Show Restricted
   </a>
 
-  <a href="unfilled_shifts?department_id={{ department_id }}&toggle_filter=unfilled_show_nonpublic" class="btn btn-xs 
-          {% if show_nonpublic %}btn-plain{% else %}btn-outline-secondary{% endif %}">
+  <a href="unfilled_shifts?department_id={{ department_id }}&toggle_filter=unfilled_show_nonpublic" class="btn btn-sm 
+          {% if show_nonpublic %}btn-outline-secondary{% else %}btn-outline-secondary{% endif %}">
     <i class="fa fa-filter"></i>
     Show Non Public
   </a>