{"id":659,"date":"2021-03-26T11:00:42","date_gmt":"2021-03-26T10:00:42","guid":{"rendered":"https:\/\/www.studentbostader.se\/search-apartment\/free-apartments\/bostad\/"},"modified":"2022-06-07T13:38:26","modified_gmt":"2022-06-07T11:38:26","slug":"apartment","status":"publish","type":"page","link":"https:\/\/www.studentbostader.se\/en\/find-apartments\/search-apartments\/apartment\/","title":{"rendered":"Apartment"},"content":{"rendered":"<!-- block-id=block_6074ac02c5fac --><div class=\"fast2-blocks alignwide search-apartment-details\">\n    <div class=\"widget-loading\">\n        <div class=\"grid grid-cols-12 lg:gap-8 gap-4\">\n            <div class=\"col-span-12 lg:col-span-7\">\n                <div data-widget=\"objektbilder\">\n                    <!-- Load image slider data from fast2-widget -->\n                    \n                        <div id=\"imageData\" class=\"hidden\">{{#.}}<p>{{url}}<\/p>{{\/.}}<\/div>\n                    \n\n                    <div x-data=\"$application.states.imageSlider()\" x-init=\"initialize()\" x-ref=\"lightBox\" class=\"relative w-full mx-auto mb-4\" :class=\"{'lightbox-fullscreen py-64': lightboxFullScreen}\">\n                        <div class=\"lightbox flex py-32 md:py-48 lg:py-64 relative\" @click=\"toggleFullScreen()\" @keydown.escape.window=\"lightboxFullScreen = false\">\n\n                            <!-- Show all images -->\n                            <button id=\"imageslider-showall-btn\" class=\"absolute bottom-0 z-10 rounded-lg hidden bg-white p-2 px-4 m-4 cursor-pointer\" :class=\"{'hidden': lightboxFullScreen}\">\n                                <i class=\"fa fa-picture-o w-8\" aria-hidden=\"true\"><\/i>\n                                Show all images                            <\/button>\n\n                            <!-- Slides -->\n                            <template x-for=\"(image, index) in images\" :key=\"index\">\n                                <figure class=\"absolute top-0 w-full h-full bg-cover bg-center hidden\" :class=\"{'hidden' : activeSlide !== index}\" :style=\"'background-image: url(' + image +')'\">\n                                    <img :src=\"image\" :alt=\"'Apartment image ' + (index+1) + ' of ' + images.length\" class=\"visually-hidden\" x-ref=\"img-1\">\n                                <\/figure>\n                            <\/template>\n\n                            <!-- Controls -->\n                            <button id=\"imageslider-first-btn\" class=\"visually-hidden\" :class=\"{'hidden': !lightboxFullScreen}\"><\/button>\n\n                            <div class=\"absolute z-10 pt-2 top-0 right-0\" :class=\"{'hidden': !lightboxFullScreen}\">\n                                <button id=\"imageslider-close-btn\" class=\"btn-icon text-white cursor-pointer p-3 mt-2 mr-4 w-5 w-auto\" @click.stop=\"toggleFullScreen()\" aria-label=\"Close\"><i class=\"fa fa-fw fa-2x fa-close\" aria-hidden=\"true\"><\/i><\/button>\n                            <\/div>\n                            <div class=\"w-full relative z-10 flex items-center hidden\" :class=\"{'hidden': !lightboxFullScreen}\">\n                                <button id=\"imageslider-prev-btn\" class=\"absolute left-0  btn-icon text-white cursor-pointer p-3 mt-2 ml-4 w-5 w-auto\" @click.stop=\"activeSlide = (activeSlide === 0 ? images.length - 1 : activeSlide - 1)\" aria-label=\"Previous image\"><i class=\"fa fa-fw fa-2x fa-chevron-left\" aria-hidden=\"true\"><\/i><\/button>\n                                <button id=\"imageslider-next-btn\" class=\"absolute right-0 btn-icon text-white cursor-pointer p-3 mt-2 mr-4 w-5 w-auto\" @click.stop=\"activeSlide = (activeSlide === images.length - 1 ? 0 : activeSlide + 1)\" aria-label=\"Next image\"><i class=\"fa fa-fw fa-2x fa-chevron-right\" aria-hidden=\"true\"><\/i><\/button>\n                            <\/div>\n\n                            <button id=\"imageslider-last-btn\" class=\"visually-hidden\" :class=\"{'hidden': !lightboxFullScreen}\"><\/button>\n                        <\/div>\n\n                        <!-- Prev\/Next Arrows and previews-->\n                        <div class=\"grid grid-cols-12 mt-8 gap-2\">\n                            <div class=\"hidden lg:block col-span-2 lg:col-span-1 text-left\">\n                                <button class=\"w-full h-12 bg-white bg-color-background cursor-pointer\" @click=\"activeSlide = (activeSlide === 0 ? images.length - 1 : activeSlide - 1)\" aria-label=\"Previous image\"><i class=\"fa fa-fw fa-chevron-left\" aria-hidden=\"true\"><\/i><\/button>\n                            <\/div>\n                            <div class=\"col-span-12 lg:col-span-10\">\n                                    <div class=\"grid grid-cols-12 gap-2\">\n\n                                        <!-- gradient -->\n                                        <!-- <div class=\"left-0 h-full bg-gradient-to-r from-white to-transparent\"><\/div> -->\n\n                                        <!-- the images list -->\n                                        <template x-for=\"(image, index) in images\" :key=\"index\">\n                                            <img class=\"col-span-4 xs:col-span-3 sm:col-span-2 lg:col-span-3 xl:col-span-2 bg-cover bg-center border-darkBlue cursor-pointer\"\n                                                :class=\"{'border-2' : activeSlide === index }\"\n                                                x-on:click=\"activeSlide = index\"\n                                                :src=\"image\"\n                                                :alt=\"'Apartment image ' + (index+1) + ' of ' + images.length\"\n                                            >\n                                        <\/template>\n\n                                        <!-- gradient -->\n                                        <!-- <div class=\"right-0 h-full bg-gradient-to-r from-transparent to-white\"><\/div> -->\n                                    <\/div>\n                            <\/div>\n                            <div class=\"hidden lg:block col-span-2 lg:col-span-1 text-right\">\n                                <button class=\"w-full h-12 bg-white bg-color-background cursor-pointer\" @click=\"activeSlide = (activeSlide === images.length - 1 ? 0 : activeSlide + 1)\" aria-label=\"Next image\"><i class=\"fa fa-fw fa-chevron-right\" aria-hidden=\"true\"><\/i><\/button>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n            <div class=\"col-span-12 lg:col-span-5\">\n                <div data-widget=\"objektinformation@lagenheter\" id=\"objektinformation-data-widget\">\n                    \n                    <div id=\"objektinformation-data\" class=\"hidden\"\n                        data-adress=\"{{adress}}\"\n                        data-typ=\"{{typ}}\"\n                        data-objektNr=\"{{objektNr}}\"\n                        data-publiceratDatum=\"{{publiceratDatum}}\"\n                        data-omrade=\"{{omrade}}\"\n                        data-omradekod=\"{{omradeKod}}\">\n                    <\/div>\n                    \n                    <h1 class=\"adress\">{{adress}}<\/h1>\n                <\/div>\n                <div data-widget=\"objektintresse\" class=\"objektintresse mt-12 mb-4 text-center\"><\/div>\n                <div data-widget=\"alert\" role=\"alert\"><\/div>\n                <div data-widget=\"objektintressestatus\" class=\"my-12 text-center\"><\/div>\n                <template id=\"searchdetail_extra_template\">\n                    \n                    <div class=\"bg-tintGray rounded px-6 mt-8 text-center\">\n                        <h2 class=\"text-2xl mt-0\">{{header}}<\/h2>\n                        <div>{{{body}}}<\/div>\n                    <\/div>\n                    \n                <\/template>\n                <div id=\"searchdetail_extra\">\n                    \n                <\/div>\n            <\/div>\n\n            <div class=\"col-span-12 lg:col-span-4 bg-lightGray p-4 py-8\">\n                <div data-widget=\"objektinformation@lagenheter\">\n                    \n                    <div class=\"ObjektInformation\">\n                        <div class=\"grid grid-cols-1 md:grid-cols-1\">\n                            <div class=\"w-full pt-2 pr-3 pl-3 row-span-3 col-span-1\">\n                                <div class=\"mt-1 border-b-2 border-linkGray\">\n                                    <p class=\"font-semibold inline-block mb-0\">Area:<\/p>\n                                    <p class=\"inline-block float-right mb-0\">{{omrade}}<\/p>\n                                <\/div>\n                                <div class=\"mt-2 border-b-2 border-linkGray mb-0\">\n                                    <p class=\"font-semibold inline-block mb-0\">Type\/Size:<\/p>\n                                    <p class=\"inline-block float-right mb-0\">{{typ}}<\/p>\n                                <\/div>\n                                <div class=\"mt-2 border-b-2 border-linkGray\">\n                                    <p class=\"font-semibold inline-block mb-0\">Space:<\/p>\n                                    <p class=\"inline-block float-right mb-0\">{{yta}}&nbsp;m<sup class=\"leading-none\">2<\/sup><\/p>\n                                <\/div>\n                                <div class=\"mt-2 border-b-2 border-linkGray\">\n                                    <p class=\"font-semibold inline-block mb-0\">Rent:<\/p>\n                                    <p class=\"inline-block float-right mb-0\">{{hyra}}&nbsp;kr<\/p>\n                                <\/div>\n                                <div class=\"mt-2 border-b-2 border-linkGray\">\n                                    <p class=\"font-semibold inline-block mb-0\">Floor:<\/p>\n                                    <p class=\"inline-block float-right mb-0\">{{vaning}} of {{antalVaningar}}<\/p>\n                                <\/div>\n                                <div class=\"mt-2 border-b-2 border-linkGray\">\n                                    <p class=\"font-semibold inline-block mb-0\">Elevator:<\/p>\n                                    <p class=\"inline-block float-right mb-0\">{{hiss}}<\/p>\n                                <\/div>\n                                <div class=\"mt-2 border-b-2 border-linkGray\">\n                                    <p class=\"font-semibold inline-block mb-0\">Available from:<\/p>\n                                    <p class=\"inline-block float-right mb-0\">{{inflyttningDatum}}<\/p>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                    \n                <\/div>\n            <\/div>\n            <div class=\"col-span-12 lg:col-span-4 bg-lightGray p-4 py-8\">\n                <div data-widget=\"objektegenskaper\"><\/div>\n            <\/div>\n\n            <div class=\"col-span-12 lg:col-span-4\">\n                <div data-widget=\"objektdokument\"><\/div>\n            <\/div>\n\n            <div class=\"col-span-12 lg:col-span-8 lg:col-start-3\">\n                <div data-widget=\"objektfritext\" ><\/div>\n            <\/div>\n\n        <\/div>\n    <\/div>\n<\/div>\n\n\n\n<div style=\"height:60px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n<div class=\"text-center\">\n      <button class=\"btn\" id=\"showMapButton\" >Show map<\/button>\n    <\/div>\n    <div data-widget=\"objektkarta\" class=\"hidden\"><\/div>\n  \n<div id=\"areamap-component\" class=\"alignfull\">\n  <area-map\n    map-type=\"detail\"\n    default-area=\"Ryd\"\n    map-display-type=\"satellite\"\n    map-zoom-level=\"13\"\n    expand-icon=\"https:\/\/www.studentbostader.se\/app\/themes\/studentbostader\/dist\/images\/add.png?id=e5d283695d7e798c38f70015daa5a7da\"\n    collapse-icon=\"https:\/\/www.studentbostader.se\/app\/themes\/studentbostader\/dist\/images\/minus.png?id=c2e8e86327fbf6b995b41e6748ca3622\"\n    lang=\"en\"\n    my-area=\"\"\n    map-aria-label=\"Map\"\n  ><\/area-map>\n<\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":656,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_relevanssi_hide_post":"on","_relevanssi_hide_content":"","_relevanssi_pin_for_all":"","_relevanssi_pin_keywords":"","_relevanssi_unpin_keywords":"","_relevanssi_related_keywords":"","_relevanssi_related_include_ids":"","_relevanssi_related_exclude_ids":"","_relevanssi_related_no_append":"","_relevanssi_related_not_related":"","_relevanssi_related_posts":"","_relevanssi_noindex_reason":"Relevanssi index exclude","footnotes":""},"page_categories":[],"acf":[],"_links":{"self":[{"href":"https:\/\/www.studentbostader.se\/en\/wp-json\/wp\/v2\/pages\/659"}],"collection":[{"href":"https:\/\/www.studentbostader.se\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.studentbostader.se\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.studentbostader.se\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.studentbostader.se\/en\/wp-json\/wp\/v2\/comments?post=659"}],"version-history":[{"count":0,"href":"https:\/\/www.studentbostader.se\/en\/wp-json\/wp\/v2\/pages\/659\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/www.studentbostader.se\/en\/wp-json\/wp\/v2\/pages\/656"}],"wp:attachment":[{"href":"https:\/\/www.studentbostader.se\/en\/wp-json\/wp\/v2\/media?parent=659"}],"wp:term":[{"taxonomy":"page_categories","embeddable":true,"href":"https:\/\/www.studentbostader.se\/en\/wp-json\/wp\/v2\/page_categories?post=659"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}