@extends('site.layout.app')
@section('keywords')
<meta name="description" content="{!!$homeConfig->meta_description!!}">
@endsection
@section('style')
<link rel="stylesheet" type="text/css" href="/css/home.css">
@endsection

@section('content')
<section id="speed" class="background-color"
         style="background-image: url('{{$homeConfig['fieldJson']['speed-img']}}');  background-repeat:no-repeat;background-size: 100% 500px">
    <div class="container">
        <div class="row text-spacing">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 text-center speed-title">
                <h3 class="title-font">{{$homeConfig['fieldJson']['speed-title']}}</h3>
                <h5 class="title-font-5">{{$homeConfig['fieldJson']['speed-content']}}</h5>
            </div>
            <!-- ./col -->
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 text-center">
                <a href="/zh-hk/connection">
                    <button type="button" class="btn btn-default " id="button">
                        {{$mainConfig['fieldJson']['button-advisory']}}
                    </button>
                    <a>
            </div>
            <!-- ./col -->
        </div>
        <!--/.row-->
    </div>
</section>
<!-- ./speed -->

<section id="service">
    <div class="container">
        <div class="row ">
            <div class="title-distance">
                <div class="col-lg-12 text-center">
                    <h4 class="font-color-blue">{{$mainConfig['fieldJson']['service-title']}}</h4>
                    <div class="row-link"></div>
                    <h5 class="font-color-gray">{{$mainConfig['fieldJson']['service-content']}}</h5>
                </div>
            </div>
            <!-- ./col -->
        </div>
        <!-- ./row -->
        <div class="row text-center">
            @foreach ($homeConfig->fieldJson['service'] as $service)
            <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 " >
                <img src="{!!$service['service-img']!!} " class="service-img">
                <abbr class="img-title">{!!$service['service-img-title']!!}</abbr>
                <abbr class="font-color-gray">{!!$service['service-img-content']!!}</abbr>
            </div>
            @endforeach
        </div>
        <!-- ./row -->
        <div class="col-lg-12 text-center">
            <a href="/zh-hk/service">
                <button type="button" class="btn btn-primary" id="more-button">
                    {{$mainConfig['fieldJson']['more-button']}}
                </button>
            </a>
        </div>
    </div>
</section>
<!-- /develop  -->
<section id="technology">
    <div class="container">
        <div class="row text-spacing">
            <div class="title-distance">
                <div class="col-lg-12 text-center ">
                    <h4 class="font-color-blue">{{$homeConfig['fieldJson']['technology-title']}}</h4>
                    <div class="row-link"></div>
                    <h5 class="font-color-gray">{{$homeConfig['fieldJson']['technology-content']}}</h5>
                </div>
                <!-- ./col -->
            </div>
        </div>
        <!--   ./row -->
        <div class="row design " id="technology-first-row">
            <div class="col-sm-5 col-md-5 col-xs-12 ">
                <div class="design-detail ">
                    <img class="img-responsive technology-img"
                         src="{{$homeConfig['fieldJson']['technology-first-img']}}" alt="UI">
                </div>
            </div>
            <!--/.col-->
            <div class="col-sm-7 col-md-7 col-xs-12 bq-detail ">
                <h4 class="img-title">{{$homeConfig['fieldJson']['technology-first-img-title']}}</h4>
                <h5 class=" font-h5">{{$homeConfig['fieldJson']['technology-first-img-subtitle']}}</h5>
                <h5 class="technology-content">{{$homeConfig['fieldJson']['technology-first-img-content']}}
                </h5>
            </div>
            <!--/.col-->
        </div>
        <!--/.row-->

        <div class="row design">
            <div class="col-sm-7 col-md-7 col-xs-12 bq-detail ">
                <h4 class="img-title">{{$homeConfig['fieldJson']['technology-second-img-title']}}</h4>
                <h5 class=" font-h5">{{$homeConfig['fieldJson']['technology-second-img-subtitle']}}</h5>
                <h5 class="technology-content">{{$homeConfig['fieldJson']['technology-second-img-content']}}
                </h5>
            </div>
            <!--/.col-->
            <div class="col-sm-5 col-md-5 col-xs-12">
                <div class="design-detail text-left">
                    <img class="img-responsive home-img" src="{{$homeConfig['fieldJson']['technology-second-img']}}"
                         alt="UI">
                </div>
            </div>
            <!--/.col-->
        </div>
        <!--/.row-->
        <div class="row design" id="technology-last-row">
            <div class="col-sm-5 col-md-5 col-xs-12">
                <div class="design-detail ">
                    <img class="img-responsive technology-img"
                         src="{{$homeConfig['fieldJson']['technology-third-img']}}" alt="UI">
                </div>
            </div>
            <!--/.col-->
            <div class="col-sm-7 col-md-7 col-xs-12 bq-detail font-h5">
                <h4 class="img-title">{{$homeConfig['fieldJson']['technology-third-img-title']}}</h4>
                <h5 class="font-h5">{{$homeConfig['fieldJson']['technology-third-img-subtitle']}}</h5>
                <h5 class="technology-content">{{$homeConfig['fieldJson']['technology-third-img-content']}}
                </h5>
            </div>
            <!--/.col-->
        </div>
        <!--/.row-->
    </div>
</section>
<!-- /#service  -->
<section id="case">
    <div class="row">
        <div class="title-distance">
            <div class="col-lg-12 text-center">
                <a name="case"></a>
                <h4 class="font-color-blue">{{$mainConfig['fieldJson']['Case-title']}}</h4>
                <div class="row-link"></div>
                <h5 class="font-color-gray">{{$homeConfig['fieldJson']['Case-content']}}</h5>
            </div>
            <!--/.col-->
        </div>
    </div>

    <!-- /.row -->
    <div class="row case-spacing">
        @foreach ($homeConfig->fieldJson['Case'] as $Case)
        <div class="col-sm-4">
            <div class="team-member popup-gallery">
                <a href="{!!$Case['Case-img']!!}" style="font-size: 300%" title="">
                    <figure class="profile-pic">
                        <img src="{!!$Case['Case-img']!!}" alt=""
                             class="portfolio-pic img-responsive img-thumbnail ">
                    </figure>
                    <div class="details">{!!$Case['case-img-name']!!}</div>
                </a>
            </div>
        </div>
        @endforeach
    </div>
    <!-- /.row -->

    <div class="container">
        <div class="col-lg-12 text-center ">
            <a href="/zh-hk/case">
                <button type="button" class="btn btn-primary " id="more-button">
                    {{$mainConfig['fieldJson']['more-button']}}
                </button>
            </a>
        </div>
    </div>
</section>
<!-- /.portfolio -->

<section id="client">
    <div class="container">
        <div class="row text-spacing">
            <div class="title-distance">
                <div class="col-lg-12 text-center">
                    <a name="us">
                        <h4 class="font-color-blue">{{$homeConfig['fieldJson']['client-title']}}</h4>
                    </a>
                    <div class="row-link"></div>
                    <h5 class="font-color-gray">{{$homeConfig['fieldJson']['client-content']}}</h5>
                </div>
                <!-- ./col -->
            </div>
        </div>
        <!--   ./row -->
        <div class="row">

            <div class="col-sm-12">

                @foreach ($homeConfig->fieldJson['client'] as $client)
                <div class="col-md-3 col-sm-6 col-xs-12 text-center" style="padding-top:5px;padding-bottom:10px;">
                    <img src="{!!$client['client-img']!!}">
                </div>
                @endforeach
            </div>
        </div>
    </div>
    <!--   ./container -->
</section>


<section id=""
         style="background-image: url('{{$mainConfig['fieldJson']['made-img']}}');background-repeat:no-repeat;background-size: 100%  400px">
    <div class="container">
        <div class="row text-spacing made-img">
            <div class="col-lg-12 ">
                <img src="{!!$homeConfig ['fieldJson']['head-EM']!!}" alt="E=mc00" class="img-responsive ">
            </div>
            <!-- ./col -->
            <div class="col-lg-12 text-center">
                <p class="contact-font-6">
                    {{$homeConfig['fieldJson']['made-content']}}
                </p>
                <p class="contact-font-6">{{$homeConfig['fieldJson']['made-content-next']}}</p>
            </div>
            <!-- ./col -->
        </div>
        <!--/.row-->
        <div class="col-lg-12 text-center">
            <a href="/zh-hk/connection">
                <button type="button" class="btn btn-default " id="button">{{$mainConfig['fieldJson']['made-button']}}
                </button>
            </a>
        </div>
</section>

<section id="connection">
    <div class="row text-spacing">
        <div class="title-distance">
            <div class="col-lg-12 text-center ">
                <h4 class="connection-title-font">{{$mainConfig['fieldJson']['connection-title']}}</h4>
                <div class="row-link"></div>
                <h5 class="connection-content-font">{{$mainConfig['fieldJson']['connection-content']}}</h5>
            </div>
            <!-- ./col -->
        </div>
    </div>
    @include('admin.partials.notification')
    <div class="connection-logo">
        <div class="row home-contact-from">
            <div class="col-lg-6 col-md-6 col-xs-12">
                <form class="from-horizontal" method="POST" action="{{ URL('home') }}">
                    <input type="hidden" name="_token" value="{{ csrf_token() }}">
                    <div class="col-lg-6 col-md-6 col-xs-12">
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="名字"
                                   name="name"
                                   required="required">
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-xs-12">
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="電話"
                                   name="phone"
                            >
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-xs-12">
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="標題"
                                   name="title"
                                   required="required">
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-xs-12">
                        <div class="form-group">
                            <input type="email" class="form-control" placeholder="電郵地址"
                                   name="email"
                                   required="required">
                        </div>
                    </div>

                    <div class="col-lg-12 col-md-12 col-xs-12">
                        <div class="form-group">
                            <textarea type="text" class="form-control"
                                      placeholder="{{$mainConfig['fieldJson']['connection-help']}}" name="content"
                                      required="required"></textarea>
                        </div>
                    </div>
                    <!--/.col-->
                    <div class="col-lg-12 col-md-12 col-xs-12">
                        <a href="/zh-hk/priceClass">
                            <button type="submit" class="btn btn-default btn-lg " id="contact-button">
                                {{$mainConfig['fieldJson']['connection-button']}}
                            </button>
                            <a>
                    </div>
                </form>
            </div>
            <br>
            <!--/.col-->
            <div class="icon-right">
                <div class="col-lg-6 col-md-6 col-xs-12">
                <div class="col-lg-12 col-md-12 col-xs-12">
                        <div class="icon">
                            
                            <p href="#" class="contact-font-6">{{$mainConfig['fieldJson']['connection-company']}}</p>
                        </div>
                    </div>
                    <div class="col-lg-12 col-md-12 col-xs-12">
                        <div class="icon">
                            <i class="fa fa-envelope"></i>
                            <p href="#" class="contact-font-6">{{$mainConfig['fieldJson']['connection-icon-email']}}</p>
                        </div>
                    </div>
                    <!--/.col-->
                    <div class="col-lg-12 col-md-12 col-xs-12">
                        <div class="icon">
                            <i class="fa fa-map-marker"></i>
                            <a href="/zh-hk/connection?id=hk"  class="contact-font-address"
                            >
                                <p >{{$mainConfig['fieldJson']['connection-icon-address']}}</p>
                            </a>
                            <a href="/zh-hk/connection?id=china"
                               class="contact-font-address">
                                <span> {{$mainConfig['fieldJson']['connection-icon-second-address']}}</span></a>
                        </div>
                    </div>
                    <!--/.col-->
                    <div class="title-distance">
                        <div class="col-lg-12 col-md-12 col-xs-12">
                            <div class="icon">
                                <i class="fa fa-phone"></i>
                                <p title="Phone"
                                   class="contact-font-6">{{$mainConfig['fieldJson']['connection-icon-phone']}}</p>
                            </div>
                        </div>
                        <!--/.col-->
                        <div class="col-lg-12 col-md-12 col-xs-12">
                            <div class="icon">
                                <i class="fa fa-wechat"></i>
                                <p title="Wechat"
                                   class="contact-font-6">{{$mainConfig['fieldJson']['connection-icon-weichat']}}</p>
                            </div>
                        </div>
                        <!--/.col-->
                        
                    </div>
                </div>
                <!-- /.row -->
            </div>
        </div>
    </div>

    <!-- /.col -->
    <!-- /#contact  -->
</section>

@endsection