Просмотр архива веб сетка новая

{include file='_head.tpl'}
{include file='_header.tpl'}

<!-- page
header -->
<div class="page-header bg-3">
    <img
class="floating-img d-none d-md-block"
src="{$system['system_url']}/content/themes/{$system['theme']}/images/headers/undraw_product_teardown_elol.svg">

   <div class="crystal c03"></div>
    <div
class="circle-2"></div>
    <div
class="circle-3"></div>
    <div
class="inner">
        <h2>{__("Getting
Started")}</h2>
        <p>{__("This information
will let us know more about you")}</p>
   
</div>
</div>
<!-- page header -->

<!-- page
content -->
<div class="container" style="margin-top:
-25px;">
    <div class="row">
    	<div
class="col-12 col-md-10 mx-md-auto">
            <div
class="card shadow">
                <div
class="card-body">

                    <!-- nav -->

                   <ul class="nav nav-pills nav-fill nav-started
mb30 js_wizard-steps">
                        <li
class="nav-item">
                            <a
class="nav-link active" href="#step-1">
           
                    <h4 class="mb5">{__("Step
1")}</h4>
                                <p
class="mb0">{__("Upload your photo")}</p>
   
                        </a>
                        </li>
  
                     <li class="nav-item">
               
            <a class="nav-link disabled"
href="#step-2">
                                <h4
class="mb5">{__("Step 2")}</h4>
             
                  <p class="mb0">{__("Update your
info")}</p>
                            </a>
           
            </li>
                        <li
class="nav-item">
                            <a
class="nav-link disabled" href="#step-3">
         
                      <h4 class="mb5">{__("Step
3")}</h4>
                                <p
class="mb0">{__("Add Friends")}</p>
         
                  </a>
                        </li>
        
           </ul>
                    <!-- nav -->

         
          <!-- tabs -->
                    <div
class="js_wizard-content" id="step-1">
            
           <div class="text-center">
                     
      <h3 class="mb5">{__("Welcome")} <span
class="text-primary">{$user->_data['user_firstname']}</span></h3>

                           <p class="mb20">{__("Let's
start with your photo")}</p>
                       
</div>
                        
                        <!--
profile-avatar -->
                        <div
class="position-relative" style="height: 170px;">
 
                          <div class="profile-avatar-wrapper
static">
                                <img
src="{$user->_data['user_picture']}"
alt="{$user->_data['user_firstname']}
{$user->_data['user_lastname']}">

                           
    <!-- buttons -->
                                <div
class="profile-avatar-change">
                              
     <i class="fa fa-camera js_x-uploader"
data-handle="picture-user"></i>
                       
        </div>
                                <div
class="profile-avatar-change-loader">
                       
            <div class="progress x-progress">
            
                           <div class="progress-bar"
role="progressbar" aria-valuenow="0"
aria-valuemin="0" aria-valuemax="100"></div>

                                   </div>
                          
     </div>
                                <div
class="profile-avatar-crop {if $user->_data['user_picture_default']
|| !$user->_data['user_picture_id']}x-hidden{/if}">
           
                        <i class="fa fa-crop-alt
js_init-crop-picture"
data-image="{$user->_data['user_picture_full']}"
data-handle="user"
data-id="{$user->_data['user_id']}"></i>
           
                    </div>
                                <div
class="profile-avatar-delete {if
$user->_data['user_picture_default']}x-hidden{/if}">
          
                         <i class="fa fa-trash
js_delete-picture"
data-handle="picture-user"></i>
                       
        </div>
                                <!-- buttons
-->
                            </div>
                       
</div>
                        <!-- profile-avatar -->

    
                   <!-- buttons -->
                        <div
class="clearfix mt20">
                            <button
id="activate-step-2" class="btn btn-primary
float-right">{__("Next Step")}<i class="fas
fa-arrow-circle-right ml5"></i></button>
             
          </div>
                        <!-- buttons -->
   
                </div>

                    <div
class="js_wizard-content x-hidden" id="step-2">
   
                    <div class="text-center">
            
               <h3 class="mb5">{__("Update your
info")}</h3>
                            <p
class="mb20">{__("Share your information with our
community")}</p>
                        </div>

      
                 <form class="js_ajax-forms"
data-url="users/started.php">
                           
<div class="heading-small mb20">
                         
      {__("Location")}
                           
</div>
                            <div
class="pl-md-4">
                                <div
class="form-group">
                                   
<label class="form-control-label"
for="country">{__("Country")}</label>
       
                            <select class="form-control"
name="country" id="country">
                      
                 <option value="none">{__("Select
Country")}</option>
                                       
{foreach $countries as $country}
                                         
  <option {if $user->_data['user_country'] ==
$country['country_id']}selected{/if}
value="{$country['country_id']}">{$country['country_name']}</option>

                                       {/foreach}
                        
           </select>
                                </div>
 
                              <div class="row">
          
                         <div class="form-group
col-md-6">
                                        <label
class="form-control-label"
for="city">{__("Current City")}</label>
     
                                  <input type="text"
class="form-control js_geocomplete" name="city"
id="city"
value="{$user->_data['user_current_city']}">
             
                      </div>
                                   
<div class="form-group col-md-6">
                        
               <label class="form-control-label"
for="hometown">{__("Hometown")}</label>
     
                                  <input type="text"
class="form-control js_geocomplete" name="hometown"
id="hometown"
value="{$user->_data['user_hometown']}">
                 
                  </div>
                               
</div>
                            </div>

                 
          <div class="divider"></div>

            
               <div class="heading-small mb20">
          
                     {__("Work")}
                           
</div>
                            <div
class="pl-md-4">
                                <div
class="form-group">
                                   
<label class="form-control-label"
for="work_title">{__("Work Title")}</label>
 
                                  <input type="text"
class="form-control" name="work_title"
id="work_title"
value="{$user->_data['user_work_title']}">
               
                </div>
                                <div
class="row">
                                    <div
class="form-group col-md-6">
                                
       <label class="form-control-label"
for="work_place">{__("Work Place")}</label>
 
                                      <input type="text"
class="form-control" name="work_place"
id="work_place"
value="{$user->_data['user_work_place']}">
               
                    </div>
                                   
<div class="form-group col-md-6">
                        
               <label class="form-control-label"
for="work_url">{__("Work Website")}</label>
 
                                      <input type="text"
class="form-control" name="work_url"
id="work_url"
value="{$user->_data['user_work_url']}">
                 
                  </div>
                               
</div>
                            </div>
                   
            
                            <div
class="divider"></div>

                           
<div class="heading-small mb20">
                         
      {__("Education")}
                           
</div>
                            <div
class="pl-md-4">
                                <div
class="form-group">
                                   
<label class="form-control-label"
for="edu_major">{__("Major")}</label>
       
                            <input type="text"
class="form-control" name="edu_major"
id="edu_major"
value="{$user->_data['user_edu_major']}">
                
               </div>
                                <div
class="row">
                                    <div
class="form-group col-md-6">
                                
       <label class="form-control-label"
for="edu_school">{__("School")}</label>
     
                                  <input type="text"
class="form-control" name="edu_school"
id="edu_school"
value="{$user->_data['user_edu_school']}">
               
                    </div>
                                   
<div class="form-group col-md-6">
                        
               <label class="form-control-label"
for="edu_class">{__("Class")}</label>
       
                                <input type="text"
class="form-control" name="edu_class"
id="edu_class"
value="{$user->_data['user_edu_class']}">
                
                   </div>
                               
</div>
                            </div>
                   
            
                            <!-- success -->
         
                  <div class="alert alert-success
x-hidden"></div>
                            <!-- success
-->

                            <!-- error -->
               
            <div class="alert alert-danger
x-hidden"></div>
                            <!-- error
-->

                            <!-- buttons -->
             
              <div class="clearfix mt20">
                
               <div class="float-right">
                 
                  <button type="submit" class="btn
btn-success"><i class="fas fa-check-circle
mr5"></i>{__("Save Changes")}</button>
     
                              <button type="button"
class="btn btn-primary"
id="activate-step-3">{__("Next Step")}<i
class="fas fa-arrow-circle-right
ml5"></i></button>
                               
</div>
                            </div>
                   
        <!-- buttons -->
                        </form>
    
               </div>

                    <div
class="js_wizard-content x-hidden" id="step-3">
   
                    <div class="text-center">
            
               <h3 class="mb5">{__("Add
Friends")}</h3>
                            <p
class="mb20">{__("Get latest activities from our popular
users")}</p>
                        </div>
            
           
                        <!-- new people -->
           
            <ul class="row">
                           
{foreach $user->_data['new_people'] as $_user}
                        
   {include file='__feeds_user.tpl' _tpl="box"
_connection="add"}
                            {/foreach}
     
                  </ul>
                        <!-- new people
-->

                        <!-- buttons -->
                 
      <div class="clearfix mt20">
                        
   <a href="{$system['system_url']}/started/finished"
class="btn btn-danger float-right"><i class="fas
fa-check-circle mr5"></i>{__("Finish")}</a>

                       </div>
                        <!--
buttons -->
                    </div>
                   
<!-- tabs -->

                </div>
           
</div>
        </div>
    </div>
</div>
<!--
page content -->

{include file='_footer.tpl'}

<script
type="text/javascript">
    $(function() {

        var
wizard_steps = $('.js_wizard-steps li a');
        var wizard_content =
$('.js_wizard-content');

        wizard_content.hide();

       
wizard_steps.click(function(e) {
            e.preventDefault();
        
   var $target = $($(this).attr('href'));
           
if(!$(this).hasClass('disabled')) {
               
wizard_steps.removeClass('active');
               
$(this).addClass('active');
                wizard_content.hide();
      
         $target.show();
            }
        });

       
$('.js_wizard-steps li a.active').trigger('click');

       
$('#activate-step-2').on('click', function(e) {
           
$('.js_wizard-steps li:eq(1) a').removeClass('disabled');
           
$('.js_wizard-steps li a[href="#step-2"]').trigger('click');
   
    });

        $('#activate-step-3').on('click', function(e) {
       
    $('.js_wizard-steps li:eq(2) a').removeClass('disabled');
           
$('.js_wizard-steps li a[href="#step-3"]').trigger('click');
   
    });

    });
</script>