Merge pull request #147 from boacausa/home-page

Home page

app/controllers/ngo_area/users_controller.rb

@@ -29,7 +29,7 @@ def update
     @user.update(params_user)
 
     if current_user == @user && !@user.admin?
-      redirect_to home_index_path
+      redirect_to root_path
     else
       redirect_to ngo_area_users_path
     end

app/javascript/components/App.js

@@ -8,6 +8,7 @@ import ErrorBoundary from "./ErrorBoundary";
 import AdoptionList from "../containers/AdoptionList/AdoptionList";
 import Navigation from "./Navigation/Navigation";
 import SideNavigation from "./Navigation/SideNavigation/SideNavigation";
+import HomePage from "../containers/HomePage/HomePage";
 import DialogMessage from "./DialogMessage/DialogMessage";
 
 require('typeface-roboto');
@@ -40,7 +41,7 @@ class App extends React.Component {
                             close={this.sideDrawerCloseHandler}
                         />
                         <Switch>
-                            <Route exact path="/" render={() => window.location.href = '/'} />
+                            <Route exact path="/" component={HomePage} />
                             <Route exact path="/ongs" render={() => window.location.href = '/ongs'} />
                             <Route path="/new/ongs" render={() => <NgosList />} />
                             <Route exact path="/new/ong/:id" component={NgoPage} />

app/javascript/components/Navigation/Navigation.sass

@@ -28,7 +28,7 @@
     line-height: 23px
     color: $linkColor
     position: absolute
-    width: 96px
+    width: auto
     height: 24px
     left: 80px
     top: 21px

app/javascript/containers/HomePage/HomePage.jsx

@@ -0,0 +1,33 @@
+import React from "react"
+import classes from './HomePage.sass'
+import homePageDog from './../../images/home_page_dog.svg';
+import homePageCat from './../../images/home_page_cat.svg';
+
+const HomePage = () => {
+    return (
+        <div className={classes.HomePage}>
+            <div className={classes.initialBox} style={styles.initialBoxHeight}>
+                <div className={classes.insideBorder}>
+                    <div className={classes.texts}>
+                        <h2 className={classes.beforeTitle}>FAÇA PARTE,</h2>
+                        <h1 className={classes.title}>É POR UMA BOA CAUSA</h1>
+                        <p className={classes.paragraph}>Para fazer do mundo um lugar melhor para todos.</p>
+                    </div>
+                    <div />
+                    <div className={classes.petImages}>
+                        <img src={homePageDog} alt="Imagem de um cachorro" className={classes.imageDog} />
+                        <img src={homePageCat} alt="Imagem de um gato" className={classes.imageCat} />
+                    </div>
+                </div>
+            </div>
+        </div>
+    );
+};
+
+const styles = {
+    initialBoxHeight: {
+        height: (window.innerHeight * 0.75) + "px"
+    }
+};
+
+export default HomePage;

app/javascript/containers/HomePage/HomePage.sass

@@ -0,0 +1,75 @@
+@import "../../variables/colors"
+@import "../../variables/fonts"
+@import "../../variables/sizes"
+
+.HomePage
+  .initialBox
+    background-color: $menuColor
+    width: 100%
+    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.24)
+    padding: 60px 140px 100px
+
+  .insideBorder
+    border: 4px solid white
+    height: 100%
+    display: flex
+    flex-direction: column
+    justify-content: space-between
+
+  .texts
+    font-family: $font-family
+    color: white
+    position: absolute
+    left: 0
+    right: 0
+    top: 0
+    bottom: 0
+    width: 470px
+    height: 470px
+    margin: auto
+    text-align: right
+
+  .beforeTitle
+    font-weight: 200
+
+  .title
+    font-weight: 500
+
+  .petImages
+    display: flex
+    flex-direction: row
+    justify-content: space-between
+
+  .imageDog
+    width: 200px
+    height: 300px
+
+  .imageCat
+    width: 300px
+    height: 300px
+
+  @media #{$phone}
+    .initialBox
+      padding: 20px 40px 80px
+
+    .texts
+      width: 260px
+      height: 400px
+
+    .beforeTitle
+      font-size: 24px
+
+    .title
+      font-size: 24px
+
+    .paragraph
+      font-size: 14px
+
+    .imageDog
+      width: 90px
+      height: 160px
+
+    .imageCat
+      width: 140px
+      height: 160px
+

app/models/user.rb

@@ -12,7 +12,9 @@ class User < ApplicationRecord
   validates :name, presence: true
   validates :last_name, presence: true
   validates :email, presence: true, email: true
-  validates :cpf, presence: true, cpf: true
+  # TODO: Consider remove because of LGPD
+  # is blocking sign up. Do we really need CPF?
+  # validates :cpf, presence: true, cpf: true
 
   def self.from_omniauth(auth)
     user = User.find_by(email: auth.info.email)

config/routes.rb

@@ -9,8 +9,7 @@
 
   devise_for :users, controllers: { omniauth_callbacks: 'users/omniauth_callbacks' }
 
-  root 'home#index'
-  get 'home/index'
+  root 'static#index'
 
   localized do
     resources :ngos, only: %i[index show]

spec/controllers/ngo_area/users_controller_spec.rb

@@ -90,7 +90,7 @@
       end
 
       it 'redirects to Home' do
-        expect(response).to redirect_to(home_index_path)
+        expect(response).to redirect_to(root_path)
       end
     end
   end