[Git][noosfero/noosfero][master] 2 commits: Align search buttons

[Gabriel Silva]

Gabriel Silva pushed to branch master at Noosfero / noosfero


Commits:
6cbf298c by Matheus Joranhezon at 2018-05-18T17:16:30Z
Align search buttons

- - - - -
6fe11b75 by Gabriel Silva at 2018-05-18T17:16:30Z
Merge branch 'issue_318_align_buttons' into 'master'

Align search buttons

See merge request noosfero/noosfero!1469
- - - - -


3 changed files:

- app/views/shared/_profile_search_form.html.erb
- public/stylesheets/profile-search.scss
- public/stylesheets/search.scss


Changes:

=====================================
app/views/shared/_profile_search_form.html.erb
=====================================
--- a/app/views/shared/_profile_search_form.html.erb
+++ b/app/views/shared/_profile_search_form.html.erb
@@ -1,6 +1,6 @@
 <% search_label = _("Find in %s's content") % profile.short_name %>
 <%= form_tag( { :controller => 'profile_search', :profile => profile.identifier}, :method => 'data-remote', :class => 'search_form' ) do %>
-  <div class="search-field">
+  <div class="search-field" id="profile-search">
     <span class="formfield">
       <%= search_input_with_suggestions 'q', :articles, @q, :title => search_label, :placeholder => search_label %>
       <%= submit_button(:search, _('Search'), :id => 'profile-search-button') %>


=====================================
public/stylesheets/profile-search.scss
=====================================
--- a/public/stylesheets/profile-search.scss
+++ b/public/stylesheets/profile-search.scss
@@ -5,6 +5,11 @@
   -webkit-border-radius: 5px;
 }
 
+#profile-search .formfield .button {
+  position: relative;
+  bottom: 0.25em;
+}
+
 #profile-search-results ul {
   padding-left: 0px;
   margin-left: 0px;


=====================================
public/stylesheets/search.scss
=====================================
--- a/public/stylesheets/search.scss
+++ b/public/stylesheets/search.scss
@@ -11,11 +11,13 @@
   @media only screen and (max-width: 768px) { display: block; }
   .search-form {
     display: inline-flex;
+    align-items: center;
     flex-grow: 1;
     margin-right: 8px;
     margin-top: 0;
     width: 70%;
     @media only screen and (max-width: 768px) { width: 100%; }
+
     .formfield {
       flex-grow: 8;
       @media only screen and (max-width: 768px) { flex-grow: 1; }
@@ -24,6 +26,8 @@
     }
 
     a.button {
+      position: relative;
+      bottom: 5%;
       flex-grow: 2;
       @media only screen and (max-width: 768px) { flex-grow: 0; }
       min-width: 80px;



View it on GitLab: https://gitlab.com/noosfero/noosfero/compare/8dd79eec73d915e8db1909a2aab525744e78b57f...6fe11b75c679030251143c4cd0f997e6b278b746

-- 
View it on GitLab: https://gitlab.com/noosfero/noosfero/compare/8dd79eec73d915e8db1909a2aab525744e78b57f...6fe11b75c679030251143c4cd0f997e6b278b746
You're receiving this email because of your account on gitlab.com.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://listas.softwarelivre.org/pipermail/noosfero-dev/attachments/20180518/a444166f/attachment-0001.html>