diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
index 5db78f16cf7428d6027d70a845b0ed3b7b541cf7..72738b2576c586728bb1990ed969421a3a18a1c5 100644
--- a/app/assets/stylesheets/application.scss
+++ b/app/assets/stylesheets/application.scss
@@ -274,56 +274,199 @@ header {
}
}
-footer {
- padding-top: 50px;
- color: #FFF;
-
- .main {
- background-color: #E6E6E6;
- padding: 16px 0px 0px 0px;
- min-height: 256px;
-
- .logo-footer{
- float: left;
- width: 18%;
-
- .logos-footer{
- height: 70px;
- width: auto;
+@media only screen and (min-width: 1010px) {
+/*For Desktops*/
+ footer {
+ padding-top: 50px;
+ color: #FFF;
+
+ .main {
+ background-color: #E6E6E6;
+ padding: 16px 0px 0px 0px;
+ min-height: 256px;
+
+ .container-height{
+ min-height: 200px;
+ .top-padding{
+ padding-top: 50px;
+ }
+ }
+ .logo-footer{
+ width: 18%;
+
+ .logos-footer{
+ height: 70px;
+ }
+ .ministerio-size{
+ margin-left: 60px;
+ }
+ .fnde-size{
+ height: 100px;
+ margin-top: -8%;
+ margin-left: 20px;
+ }
+ .ufpr-size{
+ margin-left: 60px;
+ }
+ .c3sl-size{
+ margin-left: 40px;
+ }
+ }
+ }
+
+ .footerbar{
+ padding: 16px;
+ background-color: #AAB1AD;
+ }
+ .footer-bar {
+ color: #FFF;
+ background-color: #2178F5;
+
+ .logo {
+ text-align: center;
+ width: 165px;
+ margin: 10px auto auto auto;
+
+ h3 {
+ margin-top: 10px;
+ font-weight: 400;
+ }
+ a {
+ color: #FFF;
+ }
}
- .normal{
- margin-left: 18%;
+ }
+ }
+}
+
+@media only screen and (min-width: 600px) and (max-width: 1009px){
+/*For tablets*/
+ footer {
+ padding-top: 30px;
+ color: #FFF;
+
+ .main {
+ background-color: #E6E6E6;
+ padding: 16px 0px 0px 0px;
+ min-height: 200px;
+
+ .container-height{
+ min-height: 140px;
+ .top-padding{
+ padding-top: 30px;
+ }
}
- .fnde-size{
- height: 100px;
- margin-top: -8%;
- margin-left: 20px;
+
+ .logo-footer{
+ width: 2%;
+ display: inline-block;
+
+ .logos-footer{
+ height: 40px;
+ }
+ .ministerio-size{
+ margin-left: 120px;
+ }
+ .fnde-size{
+ height: 60px;
+ margin-top: -8%;
+ margin-left: 170px;
+ }
+ .ufpr-size{
+ margin-left: 290px;
+ }
+ .c3sl-size{
+ margin-left: 370px;
+ }
}
- .ministerio-size{
- margin-left:80px;
+ }
+
+ .footerbar{
+ padding: 16px;
+ background-color: #AAB1AD;
+ }
+ .footer-bar {
+ color: #FFF;
+ background-color: #2178F5;
+
+ .logo {
+ text-align: center;
+ width: 165px;
+ margin: 10px auto auto auto;
+
+ h3 {
+ margin-top: 10px;
+ font-weight: 400;
+ }
+ a {
+ color: #FFF;
+ }
}
}
}
+}
- .footerbar{
- padding: 16px;
- background-color: #AAB1AD;
- }
- .footer-bar {
+@media only screen and (max-width: 599px){
+/*For Smartphones*/
+ footer {
+ padding-top: 20px;
color: #FFF;
- background-color: #2178F5;
- .logo {
- margin-left: -12px;
- margin-top: 10px;
- text-align: center;
- width: 165px;
- h3 {
- margin-top: 10px;
- font-weight: 400;
+ .main {
+ background-color: #E6E6E6;
+ padding: 5px 0px 0px 0px;
+ min-height: 156px;
+
+ .container-height{
+ min-height: 90px;
+ .top-padding{
+ padding-top: 10px;
+ }
}
- a {
- color: #FFF;
+
+ .logo-footer{
+ width: 2%;
+ display: inline-block;
+
+ .logos-footer{
+ height: 18px;
+ }
+ .ministerio-size{
+ margin-left: 40px;
+ }
+ .fnde-size{
+ height: 60px;
+ margin-top: -8%;
+ margin-left: 50px;
+ }
+ .ufpr-size{
+ margin-left: 150px;
+ }
+ .c3sl-size{
+ margin-left: 170px;
+ }
+ }
+ }
+
+ .footerbar{
+ padding: 16px;
+ background-color: #AAB1AD;
+ }
+ .footer-bar {
+ color: #FFF;
+ background-color: #2178F5;
+
+ .logo {
+ margin: 10px auto auto auto;
+ text-align: center;
+ width: 100px;
+ h3 {
+ margin-top: 5px;
+ font-weight: 300;
+ }
+ a {
+ color: #FFF;
+ }
}
}
}
diff --git a/app/views/shared/application/_footer.html.erb b/app/views/shared/application/_footer.html.erb
index 3ce3c8bd655022f683f94ec814455a1159a15964..d6c62da8734141051337b18f0aa76af323089e99 100644
--- a/app/views/shared/application/_footer.html.erb
+++ b/app/views/shared/application/_footer.html.erb
@@ -1,10 +1,10 @@
<footer>
<div class="footer-bar">
<div class="container">
- <div class="col-md-offset-5 col-md-4">
- <div class="logo" >
+ <div class="col-md-offset-4 col-md-4">
+ <div class="logo">
<%= link_to root_path do %>
- <%= image_tag image_path("logo.png"), class: "logo",style: 'margin-top:15px;'%>
+ <%= image_tag image_path("logo.png"), class: "logo",style:'margin-top:15px;'%>
<h3>CONTEÚDO EDUCACIONAL</h3>
<br/>
<% end %>
@@ -13,33 +13,33 @@
</div>
<div class="main">
- <div class="container" style="min-height: 200px;">
- <div class="col-md-12" style="padding-top: 50px">
- <div class="logo-footer">
- <%= link_to 'http://www.brasil.gov.br/' do %>
- <%= image_tag 'logo_brasil.png',class:'logos-footer normal' %>
- <% end %>
- </div>
- <div class="logo-footer">
- <%= link_to 'http://www.fnde.gov.br/' do %>
- <%= image_tag 'logo_ministerio.png',class:'logos-footer ministerio-size' %>
- <% end %>
- </div>
- <div class="logo-footer">
- <%= link_to 'http://www.fnde.gov.br/' do %>
- <%= image_tag 'fnde.png', class:'fnde-size' %>
- <% end %>
- </div>
- <div class="logo-footer">
- <%= link_to 'http://www.ufpr.br/portalufpr/' do %>
- <%= image_tag 'logo_ufpr.jpg',class:'logos-footer normal'%>
- <% end %>
- </div>
- <div class="logo-footer">
- <%= link_to 'http://www.c3sl.ufpr.br/' do %>
- <%= image_tag 'logo_c3.png', class:'logos-footer normal'%>
- <% end %>
- </div>
+ <div class="container container-height">
+ <div class="row top-padding">
+ <div class="logo-footer col-md-2">
+ <%= link_to 'http://www.brasil.gov.br/' do %>
+ <%= image_tag 'logo_brasil.png',class:'logos-footer' %>
+ <% end %>
+ </div>
+ <div class="col-md-2 logo-footer">
+ <%= link_to 'http://www.fnde.gov.br/' do %>
+ <%= image_tag 'logo_ministerio.png',class:'logos-footer ministerio-size' %>
+ <% end %>
+ </div>
+ <div class="col-md-2 logo-footer">
+ <%= link_to 'http://www.fnde.gov.br/' do %>
+ <%= image_tag 'fnde.png', class:'fnde-size' %>
+ <% end %>
+ </div>
+ <div class="col-md-2 logo-footer">
+ <%= link_to 'http://www.ufpr.br/portalufpr/' do %>
+ <%= image_tag 'logo_ufpr.jpg',class:'logos-footer ufpr-size'%>
+ <% end %>
+ </div>
+ <div class="col-md-2 logo-footer">
+ <%= link_to 'http://www.c3sl.ufpr.br/' do %>
+ <%= image_tag 'logo_c3.png', class:'logos-footer c3sl-size'%>
+ <% end %>
+ </div>
</div>
</div>