<a href="#" style="color: white;">
                            <span if="{!user}" uk-icon="user"></span>
                            <span if="{user}">{user.first_name}</span>
                            <span if="{user}" uk-icon="triangle-down"></span>
                        </a>
                        <div uk-dropdown="mode: click" style="display: none;">
                            <ul class="uk-nav uk-dropdown-nav">
                                <li if="{!user}"><a href="#" onclick="{openSignInView}">SIGN IN</a></li>
                                <li if="{!user}"><a href="#" onclick="{openSignUpView}">SIGN UP</a></li>
                                <li if="{user}"><a href="#" onclick="{handleSignOut}">SIGN OUT</a> </li>
                            </ul>
                        </div>
                        <div id="signinmodal" uk-modal style="display: none;">
                            <div class="uk-modal-dialog uk-modal-body">
                                <h2 if="{signInView}" class="uk-modal-title">Sign In <a href="#" style="float: right; font-size: 0.5em;" onclick="{openSignUpView}">Sign Up Instead</a> </h2>
                                <h2 if="{signUpView}" class="uk-modal-title">Sign Up <a href="#" style="float: right; font-size: 0.5em;" onclick="{openSignInView}">Sign In Instead</a></h2>
                                <hr />
                                    <div if="{error}" class="uk-alert uk-alert-danger" style="margin-bottom: 0px;">
                                        <div class="uk-text-bold">
                                            <div class="uk-flex uk-flex-wrap uk-flex-wrap-around">
                                                <div class="uk-width-auto"><div uk-icon="icon: warning" style="margin-right: 15px;"></div></div>
                                                <div class="uk-width-expand">{error}</div>
                                            </div>
                                        </div>
                                    </div>
                                    <form if="{otpView}">
                                         <fieldset class="uk-fieldset">
                                             <div style="padding: 10px;">
                                             <input class="uk-input" type="text" placeholder="Your OTP" oninput="{changeOtp}">
                                             <div style="margin-top: 10px;">
                                                <a href="#" style="" onclick="{hideOtpView}">Go Back</a>
                                             </div>
                                             </div>
                                         </fieldset>
                                    </form>
                                    <form if="{!otpView}">
                                         <fieldset class="uk-fieldset">
                                             <div if="{!withEmail || signUpView}" class="uk-flex">
                                                 <div class="uk-width-auto">
                                                     <div style="padding: 10px;">
                                                     <select class="uk-select" onchange="{changeMobileCode}">
                                                        <option each="{mc in mobile_codes}" value="{mc.id}" selected="{mc.id == mobile_code}">{mc.value}</option>
                                                    </select>
                                                     </div>
                                                 </div>
                                                 <div class="uk-width-expand">
                                                     <div style="padding: 10px;">
                                                     <input class="uk-input" type="text" placeholder="Mobile Number" oninput="{changeMobile}">
                                                         <div style="font-size: 0.8em; color: #888888;">Only digits allowed.</div>
                                                     </div>
                                                 </div>
                                             </div>
                                            <div if="{withEmail || signUpView}">
                                                <div  style="width: 100%;">
                                                     <div style="padding: 10px;">
                                                         <input placeholder="Email Address"  type="text" style="opacity: 0;position: absolute;" />
                                                     <input class="uk-input" type="text" autocomplete="off" placeholder="Email Address" oninput="{changeEmail}">
                                                     </div>
                                                 </div>
                                                <div  style="width: 100%;">
                                                     <div style="padding: 10px;">
                                                         <input placeholder="" type="password" style="opacity: 0;position: absolute;" />
                                                     <input class="uk-input" type="password" autocomplete="off" placeholder="Password" oninput="{changePassword}">
                                                     </div>
                                                 </div>
                                            </div>

<div if="{signInView}" class="uk-flex uk-flex-wrap">
                                                  <div style="margin-top: 10px;padding: 10px;">
                                                    <a if="{!withEmail}" href="#" style="" onclick="{enableSignInWithEmail}">Sign In With Email?</a>
                                                    <a if="{withEmail}" href="#" style="" onclick="{enableSignInWithMobile}">Sign In With Mobile & One Time Password?</a>
                                                 </div>
                                             </div>
                                             <div if="{signUpView}" class="uk-flex uk-flex-wrap">
                                                 <div class="uk-width-1-2@m">
                                                     <div style="padding: 10px;">
                                                         <input class="uk-input" type="text" placeholder="First Name" oninput="{changeFirstName}">
                                                     </div>

</div>
                                                 <div class="uk-width-1-2@m">
                                                     <div style="padding: 10px;">
                                                     <input class="uk-input" type="text" placeholder="Last Name" oninput="{changeLastName}">
                                                     </div>
                                                 </div>

</div>
                                         </fieldset>
                                    </form>
                                <hr />
                                <p class="uk-text-right">
                                    <button class="uk-button uk-button-default uk-modal-close" type="button">Cancel</button>

<button if="{withEmail && signInView && !otpView}" disabled="{signingIn}" class="uk-button uk-button-primary" type="button" onclick="{signInWithEmail}"><img class="{ signingIn ? '' : 'uk-hidden' }" src="https://d2v8elt324ukrb.cloudfront.net/static/new_template/images/newloader.debee47f900f.gif" />{ signingIn ? '' :'Sign In'}</button></button>
                                    <button if="{!otpView && (!withEmail || (withEmail && signUpView))}" disabled="{sendingOtp}" class="uk-button uk-button-primary" type="button" onclick="{getOtp}"><img class="{ sendingOtp ? '' : 'uk-hidden' }" src="https://d2v8elt324ukrb.cloudfront.net/static/new_template/images/newloader.debee47f900f.gif" />{ sendingOtp ? '' :'Verify With OTP'}</button></button>
                                    <button if="{otpView}" disabled="{verifyingOtp}" class="uk-button uk-button-primary" type="button" onclick="{verifyOtp}"><img class="{ verifyingOtp ? '' : 'uk-hidden' }" src="https://d2v8elt324ukrb.cloudfront.net/static/new_template/images/newloader.debee47f900f.gif" /> {signUpView ? 'Sign Up':'Sign In'}</button>
                                </p>
                            </div>
                        </div>
                        <a if="{selectedCurrency}" class="menuleft" id="currencydropdownbutton" href="#" style="color: white;" >
                            <span>{selectedCurrency.id}</span>
                            <span uk-icon="triangle-down"></span>
                        </a>
                        <div id="currencydropdown" style="display: none;">
                            <div class="uk-flex uk-flex-wrap">
                                <div each="{currency in currencies}" class="uk-width-1-3"><a href="#" onclick="{changeCurrency(currency)}">{currency.value}</a></div>
                            </div>

</div>

<ul class="uk-nav uk-nav-primary uk-nav-center">
                                 <li class="uk-nav-header" if="{!signedIn || (signedIn && !propertiesExist)}">Are You A Property Owner/Manager?</li>
                                 <li class="uk-nav-header" if="{signedIn && propertiesExist}">For Property Managers/Owners</li>
                                    <li class="uk-parent">
                                         <ul class="uk-nav-sub">
                                            <li><a href="/host/create-property/">List New Property</a></li>
                                            <li if="{!signedIn}"><a href="#" onclick="{openSignIn}">Sign In To Your Dashboard</a></li>
                                            <li if="{signedIn && propertiesExist}"><a href="{dashboardUrl}">Your Listing Dashboard</a></li>
                                        </ul>
                                    </li>
                                    <li class="uk-nav-divider"></li>
                                </ul>