SPB Git

spb/lou-ka Public

Lou·Ka — tous les logements à louer du Québec, un seul endroit.

HTML 99.7%
9.6 KB · 190 lines html
Raw Blame History
123<div class="content-item">4    <div class="content-item">5        <ul class="unit-floor-name">6            <li>7                <p>Unit&#233;</p>8                <h3>301</h3>9            </li>10            <li>11                <p>Loyer</p>12                <h3>$1&#160;400</h3>13            </li>14        </ul>1516        <ul class="unit-floor-type">17            <li class="residential-type">R&#233;sidentiel </li>18        </ul>19    </div>20    <div class="content-item">21        <h3 class="accent_color_2">G&#233;n&#233;ral</h3>22        <ul class="main-items">23            <li>24                <p class="title">Superficie (pi.ca)</p>25                <h4>--</h4>26            </li>27                        <li>28                <p class="title">&#201;tage</p>29                <h4></h4>30            </li>31            <li>32                <p class="title">Ch. &#224; coucher</p>33                <h4>2</h4>34            </li>3536                <li>37                    <p class="title">Salles de bains</p>38                    <h4>1</h4>39                </li>404142        </ul>43    </div>44</div>45    <div class="content-item tab-slider">46        <div class="demo">47            <div class="item">48                <div class="content-slider">4950                        <a href="https://wfiles.buildingstack.com/resources/image/SL5eL3KoSMPCLqvACaOsD6TwOr1HSN5tJqPmIsrATMyPePUmcgAnDPWciPT">51                            <img src="https://wfiles.buildingstack.com/resources/image/SL5eL3KoSMPCLqvACaOsD6TwOr1HSN5tJqPmIsrATMyPePUmcgAnDPWciPT/preview" width="98" height="98">52                        </a>53                        <a href="https://wfiles.buildingstack.com/resources/image/DdD1SojiJ4SpJaLvC3PoEMj6SMqhCqymf9UxbwWqCgcnfRObjJUfCXoQefT">54                            <img src="https://wfiles.buildingstack.com/resources/image/DdD1SojiJ4SpJaLvC3PoEMj6SMqhCqymf9UxbwWqCgcnfRObjJUfCXoQefT/preview" width="98" height="98">55                        </a>56                        <a href="https://wfiles.buildingstack.com/resources/image/TNTkK3LkGIjNKJXpOKn6ScaqI6KqUd9eIqndCbDFAt9rSKLZRd5YM4CsSpD">57                            <img src="https://wfiles.buildingstack.com/resources/image/TNTkK3LkGIjNKJXpOKn6ScaqI6KqUd9eIqndCbDFAt9rSKLZRd5YM4CsSpD/preview" width="98" height="98">58                        </a>59                </div>60            </div>61        </div>62    </div>63<div class="content-item ">64        <div class="unit-notes">65            <h3 class="accent_color_2">Commentaires</h3>66                <p><p>Situé dans un quartier recherché, cet appartement offre tout le confort nécessaire.</p><p><strong>Il comprend :</strong></p><p><strong>• Pièces bien disposées</strong></p><p><strong>• Un beau salon</strong></p><p>L'appartement bénéficie d'une excellente luminosité naturelle grâce à ses fenêtres. Vous apprécierez également la proximité des commerces et/ou des écoles, et/ou des parcs et/ou des transports en commun.</p><p><strong>Caractéristiques supplémentaires :</strong></p><p><strong>•</strong></p><p><strong>Contactez PROGIM : 514-856-7781</strong></p></p>67        </div>68    <ul class="comment-links">69        <li>70            <button class="contact-button">Contactez-nous</button>71            <div class="tooltip contact-tooltip">72                <a class="close-tooltip"><img src="/Content/Images/listings/close.png" alt=""></a>73                <h3>Contactez-nous</h3>74                <div class="content-item">75                    <ul class="unit-floor-name">76                        <li>77                            <p>Unit&#233;</p>78                            <h3>301</h3>79                        </li>80                        <li>81                            <p>Loyer</p>82                            <h3>$1&#160;400</h3>83                        </li>84                    </ul>85                    <ul class="unit-floor-type">86                        <li class="residential-type">R&#233;sidentiel </li>87                    </ul>88                </div>89                <div class="content-item">90                    <ul class="main-items">91                        <li>92                            <p class="title">Superficie (pi.ca)</p>93                            <h4>--</h4>94                        </li>95                        <li>96                            <p class="title">&#201;tage</p>97                            <h4></h4>98                        </li>99                        <li>100                            <p class="title">Ch. &#224; coucher</p>101                            <h4>2</h4>102                        </li>103104                            <li>105                                <p class="title">Salles de bains</p>106                                <h4>1</h4>107                            </li>108109110                    </ul>111                </div>112                113114115116<script type="text/javascript">117    var onSuccess = function (data) {118        $(this).closest(".js-send-unit-request").html(data);119    }120</script>121122<div class="js-send-unit-request">123<form action="/Listing/Send/828354" data-ajax="true" data-ajax-method="Post" data-ajax-success="onSuccess" id="form0" method="post"><input data-val="true" data-val-number="The field [[Apartment_UnitId]] must be a number." data-val-required="The [[Apartment_UnitId]] field is required." id="Apartment_UnitId" name="Apartment.UnitId" type="hidden" value="828354" /><input data-val="true" data-val-required="[[Apartment_UnitName_RequiredAttribute]]" id="Apartment_UnitName" name="Apartment.UnitName" type="hidden" value="301" /><input data-val="true" data-val-number="The field Immeuble must be a number." data-val-required="The Immeuble field is required." id="Apartment_BuildingId" name="Apartment.BuildingId" type="hidden" value="83310" /><input data-val="true" data-val-number="The field [[Apartment_AccountId]] must be a number." data-val-required="The [[Apartment_AccountId]] field is required." id="Apartment_AccountId" name="Apartment.AccountId" type="hidden" value="1057" /><input id="buildingKey" name="buildingKey" type="hidden" value="202533705609008331018" /><input id="lang" name="lang" type="hidden" value="fr-CA" />        <div class="contact-us-box">124            <div class="input-field">125                <input class="text-box single-line input-box" data-val="true" data-val-required="Le prénom est un champ requis" id="FirstName" name="FirstName" placeholder="Prénom" type="text" value="" />126                <span class="field-validation-valid" data-valmsg-for="FirstName" data-valmsg-replace="true"></span>127            </div>128            <div class="input-field">129                <input class="text-box single-line input-box" data-val="true" data-val-required="Le nom est un champ requis" id="LastName" name="LastName" placeholder="Nom" type="text" value="" />130                <span class="field-validation-valid" data-valmsg-for="LastName" data-valmsg-replace="true"></span>131            </div>132            <div class="input-field">133                <input class="text-box single-line input-box" data-val="true" data-val-email="Adresse de courriel n&#39;est pas dans un format approprié" data-val-length="[[ListingApartmentModel_Email_StringLengthAttribute]]" data-val-length-max="255" data-val-required="L’adresse de courriel est un champ requis" id="Email" name="Email" placeholder="Courriel" type="text" value="" />134                <span class="field-validation-valid" data-valmsg-for="Email" data-valmsg-replace="true"></span>135            </div>136            <div class="input-field">137                138139<input class="text-box single-line input-box" data-inputmask="&#39;alias&#39;: &#39;phone&#39;" data-val="true" data-val-regex="Numéro de téléphone doit être dans un format international. Par exemple: +15145550123" data-val-regex-pattern="^\+[1-9]{1}[0-9()-]{7,15}$" data-val-required="Le numéro de téléphone est un champ requis" id="Phone" name="Phone" placeholder="Numéro de téléphone" type="text" value="+1" />140141142                <span class="field-validation-valid" data-valmsg-for="Phone" data-valmsg-replace="true"></span>143            </div>144            <div class="input-field">145                <textarea class="input-box" cols="20" id="QuestionsAndComments" name="QuestionsAndComments" placeholder="Questions ou commentaires?" rows="2">146</textarea>147            </div>148            <input class="send" type="submit" onclick="gtag('event', 'contact_us_unit', {'event_category': 'Lead', 'event_label': 'Contact for 301'})" value="Envoyer">149        </div>150</form></div>151152            </div>153        </li>154    </ul>155</div>156157<script>158    $(document).ready(function () {159160        $(".contact-tooltip").wrap("<div class='popup'></div>");161        $("<div class='close-popup'></div>").insertAfter(".contact-tooltip");162163        //popup164        $('.contact-button').click(function () {165            $(this).siblings('.popup').toggleClass('is-visible');166            $('body').toggleClass('body-overflow');167            $(".contact-tooltip").click(function (event) {168                event.stopPropagation();169            });170        });171172        $('.popup').on('click', function (event) {173            if ($(event.target).is('.close-popup') || $(event.target).is('.popup')) {174                event.preventDefault();175                $(this).removeClass('is-visible');176                $('body').removeClass('body-overflow');177            }178        });179180181        //close popup when clicking the esc keyboard button182        $(document).keyup(function (event) {183            if (event.which == '27') {184                $('.popup').removeClass('is-visible');185                $('body').removeClass('body-overflow');186            }187        });188189    });190</script>