Update to bootstrap 4.0.0.beta3 markup

projectblacklight · Jan 7, 2018 · 74576c7 · 74576c7
1 parent 8a85235
commit 74576c7
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 14 deletions.
diff --git a/app/assets/stylesheets/blacklight/_header.scss b/app/assets/stylesheets/blacklight/_header.scss
@@ -36,19 +36,16 @@
   z-index: 1;
 
   .search-field {
-    background: transparent;
-    border: none;
+    // This prevents the widget from being squished so the text overflows
+    min-width: 7em;
   }
 
   .search-query-form {
-    @extend .col-md-8;
+    @extend .col-md-12;
+    @extend .col-lg-8;
     padding-left: 0;
   }
 
-  .input-group-addon.for-search-field {
-    padding-bottom: calc(0.5rem - 1px);
-  }
-
   .submit-search-text {
     // hide 'search' label at very small screens
     @media screen and (max-width: breakpoint-max(xs)) {

diff --git a/app/assets/stylesheets/blacklight/_twitter_typeahead.scss b/app/assets/stylesheets/blacklight/_twitter_typeahead.scss
@@ -1,6 +1,5 @@
 .twitter-typeahead {
-  float: left;
-  width: 100%;
+  flex-grow: 2;
   z-index: $zindex-typeahead;
 
   input.tt-input.form-control {

diff --git a/app/views/catalog/_search_form.html.erb b/app/views/catalog/_search_form.html.erb
@@ -1,23 +1,23 @@
 <%= form_tag search_action_url, method: :get, class: 'search-query-form', role: 'search' do %>
   <%= render_hash_as_hidden_fields(search_state.params_for_search.except(:q, :search_field, :qt, :page, :utf8)) %>
+  <% if search_fields.length > 1 %>
+    <label for="search_field" class="sr-only"><%= t('blacklight.search.form.search_field.label') %></label>
+  <% end %>
   <div class="input-group">
     <% if search_fields.length > 1 %>
-      <span class="input-group-addon for-search-field">
-        <label for="search_field" class="sr-only"><%= t('blacklight.search.form.search_field.label') %></label>
         <%= select_tag(:search_field,
                        options_for_select(search_fields, h(params[:search_field])),
                        title: t('blacklight.search.form.search_field.title'),
                        id: "search_field",
-                       class: "search-field") %>
-      </span>
+                       class: "custom-select search-field") %>
     <% elsif search_fields.length == 1 %>
       <%= hidden_field_tag :search_field, search_fields.first.last %>
     <% end %>
 
     <label for="q" class="sr-only"><%= t('blacklight.search.form.search.label') %></label>
     <%= text_field_tag :q, params[:q], placeholder: t('blacklight.search.form.search.placeholder'), class: "search_q q form-control", id: "q", autofocus: presenter.autofocus?, data: { autocomplete_enabled: presenter.autocomplete_enabled?, autocomplete_path: search_action_path(action: :suggest) }  %>
 
-    <span class="input-group-btn">
+    <span class="input-group-append">
       <button type="submit" class="btn btn-primary search-btn" id="search">
         <span class="submit-search-text"><%= t('blacklight.search.form.submit') %></span>
         <%= blacklight_icon :search %>