How can i Add or change the CSS?

[masterpowers]

Sorry , please just give me a hitch how can i change for example i want to add logo with class=brand-logo

<a href="#" class="brand-logo">Logo</a>

if i want to add logo How will i do it?

Can you Explain how this works in gulp.js

elixir(function (mix) {
    mix.sass('app.scss')
        .copy(bowerDir + 'jquery/dist/jquery.min.js', 'public/js/vendor/jquery.js')
        .copy(materialDir + 'js/materialize.min.js', 'public/js/vendor/materialize.js')
        .copy(materialDir + 'css/materialize.min.css','public/css/materialize.css')
        .stylesIn('public/css')
        .scriptsIn('public/js/vendor');
});

Hope you can give a sample for a css and one for a js how will i compile it? :) thanks

[xrexonx]

You can edit or place your css at app.scss located at resources/assets/sass/ folder, or you can have your own css or scss files and then import it on app.scss, and then run gulp on your terminal or cmd window. Laravel Elixir is a bulit-in API of laravel 5 using gulp., it has some helper to manage your gulp tasks. for more info about elixir you can read this helpful docs -> http://laravel.com/docs/5.0/elixir. hope it helps. thankyou

[masterpowers]

Hi thanks, I got few questions since im using your repo to experiment things out...

Is materialize already a jquery? coz i added jquery.js

to use jquery validation and ajax form validation...

Its working but i got some minor difficulty changing

The Error being reflected by jquery is messing up materialized...

.< been doing this all day...

Here is my int.js

(function($){
  $(function(){
    $.ajaxSetup({
    headers: {
    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
    });

    $('.button-collapse').sideNav();

    function loader(v){
        if(v == 'on'){
            $('#login_form').css({
                opacity : 0.2
            });
            $('#xloader').show();
        }else{
            $('#login_form').css({
                opacity : 1
            });
            $('#xloader').hide();
        }
    }

    function authenticated(url){
        window.location = url;
    }

    $('#sign_in').on('click', function(e){
            e.preventDefault();
            var login_form = $('#login_form').serializeArray();
            var url = $('#login_form').attr('action');
                loader('on');
            $.post(url, login_form, function(data){
                loader('off');
                //error
                if(data == "fail"){

                    $('#xloader').addClass('red').fadeIn(2000, function(){
                        $(this).hide();
                        $(this).removeClass("red");

                    });
                    Materialize.toast('You Failed to Login', 4000,'',function(){console.log('You Failed to Login')});
                    $.each(login_form, function(i,k){
                        $('#' + k.name).val('');
                    });

                    //unverified email
                }else if(data == "notactive"){

                    $('#xloader').addClass('red').fadeIn(2000, function(){
                        $(this).hide();
                        $(this).removeClass("red");
                    });
                    Materialize.toast('Please Verify Your Email!', 4000,'',function(){console.log('Please Verify Your Email')});
                    //successful login
                }else{
                     $('#xloader').addClass('green').fadeIn(2000, function(){
                        $(this).hide();
                        $(this).removeClass("green");
                    });
                    Materialize.toast('You Have Successfully Login!', 4000,'',function(){console.log('Welcome Back!')});
                    authenticated('profile');

                }

            });
        });
    });// end of document ready

})(jQuery); // end of jQuery name space

Dont know how to call properly ajax respose sorry i dit a direct return value here

public function authenticate(Request $request)
    {
         $loginRequest = new LoginRequest();
        $validator = Validator::make($request->all(), $loginRequest->rules(), $loginRequest->messages());
        if ($validator->fails()) {
            return "fail";
        }
        $email = $request->email;
        $password = $request->password;
        if (Auth::attempt(['email' => $email, 'password' => $password, 'active' => true])) {
            return "pass";

        }
        return "notactive";

    }

Here is my login.blade.php

<div class="progress" id="xloader" style="display:none">
      <div class="indeterminate amber" ></div>
</div>

{!! Form::open([
    'route'=> 'postLogin', 
    'class' => 'col s12 login-form', 
    'id' => 'login_form']) !!}

     <input type="hidden" name="_token" value="{{ csrf_token() }}"/>

     <div class="row">
        <div class="input-field col s12">
        <i class="mdi-communication-email prefix"></i>
        <input id="email" type="email" class="validate text email required" name="email">
        <label for="email" ">Email Address</label>

    </div>
    </div>

    <div class="row">
        <div class="input-field col s12">
        <i class="mdi-action-lock-outline prefix"></i>
        <input id="password" type="password" class="validate text required" minlength="5" name="password">
        <label for="password" >Password</label>

    </div>
    </div>

    <button class="col s6  btn waves-effect waves-light form-submit" " type="submit" id="sign_in" name="action">Login <i class="material-icons right">power_settings_new</i></button>

    <a href="{{ route('password/email') }}" class="col s6  btn waves-effect waves-light deep-orange darken-4" type="submit" name="action">Forgot password</a>

{!! Form::close() !!}

Hope you can help me out with this thanks

[masterpowers]

How can i achieve here the effect Here in The return value is in jason 1.) if Email if not Register 2.) if Email is not Verified (notactive) 3.) if Password is Incorrect 5.)if Email and Pass is Incorrect 6.) If Email is Authenticated Succesfull (active)

[xrexonx]

Hi, No need to add another jquery. Materialize used jquery as their dependencies for their javascripts plugin functionalities. For this project it is already been added at elixir's .copy() method line:18 and minified at .scriptsIn() line:22 in gulpfile.js and included into resources/views/partials/footer.blade.php @ line 26.

[xrexonx]

For setting up a proper ajax response, You can use this -> response()->json();

You can try this on your code:

        $sMsg = 'notactive'; // your default return value
        if ($validator->fails()) {
            $sMsg = "fail";
        }
        $email = $request->email;
        $password = $request->password;
        if (Auth::attempt(['email' => $email, 'password' => $password, 'active' => true])) {
            $sMsg = "pass";
        }
         return response()->json(['message' => $sMsg]);

Hope it helps. for more info -> http://laravel.com/docs/5.1/responses

[masterpowers]

thanks