<?php

/* @var $this yii\web\View */

use common\models\HomeSlider;
use common\models\MiddleContent;
use common\models\RecentCauses;
use yii\helpers\Url;
use yii\helpers\Html;
?>
<section id="mainslider" class="dark_section">
        <div class="flexslider">
            <ul class="slides">
			<?php $sliders = HomeSlider::find()->all(); 
			foreach($sliders as $slider) {
			 $basepath = Yii::getAlias('@webroot');
			?>
				<li>
                    <img src="<?php  echo Url::home(true)?>images/homeslider/<?php echo $slider->images ?>" alt="">
                    
                    <div class="slide_description_wrapper">
                        
                            <div class="slide_description">
                                <div class="text-center"> 
                                    <p data-animation="fadeInLeft"><?php echo $slider->smallText ?></p>

                                    <h3 data-animation="fadeInLeft">
                                        <strong><span class="highlight">Some</span> Text</strong> Here<br>
                                        Can <strong>Be Given</strong>
                                    </h3>
                                    <div data-animation="fadeInRight">
                                        <a href="#" class="theme_button inverse">Read More</a>
                                    </div>
                                    
                                </div>
                            </div>
                    </div>
                </li>
			<?php }?>
				
			</ul>
        </div>
        
    </section> <!-- eof #mainslider -->
	
	<section class="darkgrey_section section_padding_0 columns_padding_0 table_section table_section_md">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-4 teaser bg_teaser text-center before_cover after_cover dark_bg_1">
                     <img src="<?php  echo Url::home(true)?>images/teaser01.jpg" alt="">
                    <div class="teaser_content ">
                        <h2>Locations</h2>
                        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
                        <?php echo Html::a('Read More', ['/site/locations'],['class' => 'theme_button teaser_button inverse']) ; ?>
                    </div>
                </div>

                <div class="col-md-4 teaser bg_teaser text-center after_cover dark_bg_2">
                     <img src="<?php  echo Url::home(true)?>images/teaser02.jpg" alt="">
                    <div class="teaser_content ">
                        <h2>Affiliations</h2>
                        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
                        <?php echo Html::a('Read More', ['/site/affliations'],['class' => 'theme_button teaser_button inverse']) ; ?>
                    </div>
                </div>

                <div class="col-md-4 teaser bg_teaser text-center after_cover dark_bg_3">
                     <img src="<?php  echo Url::home(true)?>images/teaser03.jpg" alt="">
                    <div class="teaser_content">
                        <h2>Services</h2>
                        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
						<?php echo Html::a('Read More', ['/site/services'],['class' => 'theme_button teaser_button inverse']) ; ?>
                    </div>
                </div>
            </div>
        </div>
    </section> <!-- eof main background teasers -->
	
	 <section id="donate" class="light_section parallax section_padding_bottom_50">
        <div class="container">
                <div class="col-sm-12 text-center to_animate" data-animation="fadeInDown">
                    <hr>
                    <blockquote class="blockquote-big">
					<?php $middlecontent = MiddleContent::find()->one(); 
					echo $middlecontent->content; ?>
                    </blockquote>
                </div>
            </div>
    </section> <!-- eof #donate -->

    <section id="recent" class="light_section">
        <div class="container">
            <div class="row">
                <div class="col-sm-12">
                    <h2 class="section_header text-center">
                        <strong>Recent</strong> Causes
                    </h2>
                    <div id="small-carousel" class="owl-carousel causes">
					<?php $recentcauses = RecentCauses::find()->all(); 
					foreach($recentcauses as $recentcause){ 
					$progress = rand(40,90);
					?>
					<div class="small-item">
                            <div class="item-image">
							<img src="<?php  echo Url::home(true)?>images/recentcauses/<?php echo $recentcause->image ;?>" alt="">
                                <h3> <?php  echo $recentcause->title ; ?></h3>
                            </div>
                            <div class="item-progress">
                                <div class="progress">
                                    <div class="progress-bar progress-bar-warning progress-bar-striped" role="progressbar" aria-valuenow="<?php echo $progress?>" aria-valuemin="0" aria-valuemax="100" style="width: <?php echo $progress?>%">
                                        <span class="sr-only"><?php echo $progress?>% Complete (warning)</span>
                                    </div>
                                </div>
                            </div>

                            <!--div class="post-content">
							<p> <?php //echo $recentcause->shortContent ;?> </p>
                                
                                <a href="#" class="theme_button inverse">Read more</a>
                                
                            </div-->
                            
					</div> <!-- .smal-item -->
						
				<?php	} ?>
                        
					</div> <!-- .owl-carousel -->   
                </div> <!-- .col-sm-12 -->
            </div> <!-- .row -->
        </div> <!-- .container -->
    </section>

    <section id="contact" class="light_section parallax">
        <div class="container">

            <div class="row">
                <div class="col-sm-12 text-center to_animate" data-animation="expandOpen">
                    <h2 class="section_header"><strong>Get</strong> In Touch</h2>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-4">
                    <div class="teaser text-center">
                        <div class="teaser_icon highlight size_small">
                            <i class="rt-icon-newspaper"></i>
                        </div>
                        
                        <p>
                            Phone: +12 301-670-3000<br>
                            Fax: +12 301-924-0186
                        </p>
                        
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="teaser text-center">
                        <div class="teaser_icon highlight size_small">
                            <i class="rt-icon-location2"></i>
                        </div>
                        
                        <p> 
                            PO Box 54378<br>
                            4321 Your Address,<br>
                            Your City, Your Country
                        </p>
                        
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="teaser text-center">
                        <div class="teaser_icon highlight size_small">
                            <i class="rt-icon-email2"></i>
                        </div>
                        
                        <p>info@cardiacassociates.org.com</p>
                        
                    </div>
                </div>
                
            </div>

            <div class="row">
                <div class="col-sm-12 to_animate negative_margin">
                    <form class="contact-form" method="post" action="/">
                        <div class="row">
                            
                            <div class="col-sm-6">
                                <p class="contact-form-name">
                                    <label for="name">Full Name <span class="required">*</span></label>
                                    <i class="rt-icon-user2"></i>
                                    <input type="text" aria-required="true" size="30" value="" name="name" id="name" class="form-control" placeholder="">
                                </p>
                                <p class="contact-form-email">
                                    <label for="email">Email address<span class="required">*</span></label>
                                    <i class="rt-icon-email2"></i>
                                    <input type="email" aria-required="true" size="30" value="" name="email" id="email" class="form-control" placeholder="">
                                </p>
                                <p class="contact-form-subject">
                                    <label for="subject">subject address<span class="required">*</span></label>
                                    <i class="rt-icon-sound-alt"></i>
                                    <input type="text" aria-required="true" size="30" value="" name="subject" id="subject" class="form-control" placeholder="">
                                </p>
                            </div>
                            <div class="col-sm-6">
                                
                                <p class="contact-form-message">
                                    <label for="message">Message</label>
                                    <i class="rt-icon-pen-alt-stroke"></i>
                                    <textarea aria-required="true" rows="6" cols="45" name="message" id="message" class="form-control" placeholder=""></textarea>
                                </p>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12">
                                
                                <p class="contact-form-submit text-center">
                                    <button type="submit" id="contact_form_submit" name="contact_submit" class="theme_button inverse">Send</button>
                                </p>
                            </div>
                            
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </section>
