<div class="location-access-settings-container " data-module="locationAccessSettings" data-location-access-api="/data/ti-app-board-settings.json">
    <div class="location-access-settings-container__inner">
        <h3>Location access</h3>
        <div class="location-access-settings-container__description">
            Enable location access to get tailored travel tips for your current location. Your location is only used to show reccomendations.
        </div>
        <div class="location-access-settings-container__list">
            <ul>
                <li>View offers and deals nearby you</li>
                <li>Get travel inspiration based on your location</li>
                <li>Local weather warnings and useful travel information</li>
            </ul>
        </div>
        <div class="location-access-settings-container__button">
            <a href="#" class="button-p2 button-p2--full-width js-enable-location-access " role="button">Enable location access</a>
        </div>
        <div class="location-access-settings-container__enabled-message">
            Location access has been enabled. You can disable location access in the website settings of <a href='#'>Ireland.com</a> in your browser
        </div>
    </div>
    <div class="location-access-settings-modal js-enable-loc-access">
        <div class="location-access-settings-modal__inner">
            <div class="location-access-settings-modal__header">
                <a href="#" class="location-access-settings-modal__close-icon js-close-modal"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path fill-rule="evenodd" clip-rule="evenodd" d="M4.19148 19.7071C3.80096 19.3166 3.80096 18.6834 4.19148 18.2929L18.1911 4.29331C18.5816 3.90278 19.2148 3.90278 19.6053 4.29331C19.9958 4.68383 19.9958 5.317 19.6053 5.70752L5.6057 19.7071C5.21517 20.0976 4.58201 20.0976 4.19148 19.7071Z" fill="#111317" />
                        <path fill-rule="evenodd" clip-rule="evenodd" d="M4.19133 4.29304C4.58186 3.90252 5.21502 3.90252 5.60554 4.29304L19.6051 18.2926C19.9957 18.6832 19.9957 19.3163 19.6051 19.7068C19.2146 20.0974 18.5814 20.0974 18.1909 19.7068L4.19133 5.70726C3.80081 5.31673 3.80081 4.68357 4.19133 4.29304Z" fill="#111317" />
                    </svg></a>
                <svg width='33' height='33' viewBox='0 0 33 33' fill='none' xmlns='http://www.w3.org/2000/svg'>
                    <path d='M27.4579 19.5397V26.0239L22.5345 29.1647V16.9392C22.3063 16.6353 22.0455 16.2976 21.8172 15.9598C21.6542 15.7234 21.4586 15.4533 21.2955 15.2169V28.8945L16.4048 25.2471V8.63133L18.8502 10.455C18.4915 9.44185 18.2633 8.39492 18.2633 7.34799C18.2633 7.17913 18.2633 7.04404 18.2959 6.87519L15.1984 4.54492L8.38396 9.64448L0.460938 4.57869V27.4761L8.38396 32.5419L15.1984 27.4423L21.9802 32.5419L29.9033 27.4423V16.5677C29.186 17.5471 28.5012 18.3576 27.947 18.9993C27.7839 19.2019 27.6209 19.3708 27.4579 19.5397ZM7.82967 29.1984L2.90631 26.0576V9.17168L7.82967 12.2787V29.1984ZM13.9594 25.2471L9.03606 28.8945V12.2787L13.9594 8.59755V25.2471Z' fill='#5FBD00' />
                    <path d='M26.0872 0.458496C22.4681 0.458496 19.6641 3.80192 19.6641 7.71946C19.6641 8.96902 20.0553 10.2524 20.6096 11.4681C21.1639 12.6502 21.8812 13.8322 22.5985 14.8116C23.3158 15.8247 24.0331 16.669 24.5548 17.2769C24.8157 17.5809 25.0439 17.8173 25.2069 17.9861L25.4678 18.2563C25.6634 18.4252 25.8916 18.5265 26.1199 18.5265C26.3481 18.5265 26.5763 18.4252 26.772 18.2563L27.0328 17.9861C27.1958 17.8173 27.4241 17.5809 27.6849 17.2769C28.2066 16.669 28.9239 15.7909 29.6412 14.8116C30.3585 13.7984 31.0758 12.6502 31.6301 11.4681C32.1844 10.2861 32.5756 9.00279 32.5756 7.71946C32.543 3.80192 29.739 0.458496 26.0872 0.458496ZM26.0872 8.8677C25.2395 8.8677 24.5548 8.15849 24.5548 7.28042C24.5548 6.40235 25.2395 5.69314 26.0872 5.69314C26.935 5.69314 27.6197 6.40235 27.6197 7.28042C27.6197 8.15849 26.935 8.8677 26.0872 8.8677Z' fill='#5FBD00' />
                </svg>
                <h3 class="general-content">Enable location access</h3>
                <h3 class="ios-content">Location access on iOS</h3>
            </div>
            <div class="location-access-settings-modal__content location-access-settings-modal__content--general-content">
                <div class="location-access-settings-modal__list">
                    <ul>
                        <li><span>1</span>Open the website settings for this website in your browser</li>
                        <li><span>2</span>Select Location settings</li>
                        <li><span>3</span>Choose “Allow”</li>
                    </ul>
                </div>
            </div>
            <div class="location-access-settings-modal__content location-access-settings-modal__content--ios-content">
                <div class="location-access-settings-modal__list">
                    <ul>
                        <li><span>1</span>Open the My Ireland website</li>
                        <li class="list-image">
                            <figure class="image js-image image--original-size " data-module="imagelazy" data-is-small-image="">
                                <img class="image__lowres js-image-lazyload" data-src="/media/location-settings/location-ios-step-1.png" alt="Alt Text">
                                <picture class="image__container">
                                    <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="/media/location-settings/location-ios-step-1.png" />
                                    <source media="(min-width: 768px) and (max-width:1319px)" class="js-medium-image" type="image/jpeg" data-srcset="/media/location-settings/location-ios-step-1.png" />
                                    <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="/media/location-settings/location-ios-step-1.png" />
                                    <img class="js-image-lazyload js-fallback-image" data-src="" alt="Alt Text">
                                </picture>
                            </figure>
                        </li>
                        <li><span>2</span>Select the Icon below</li>
                        <li class="list-image">
                            <figure class="image js-image image--original-size " data-module="imagelazy" data-is-small-image="">
                                <img class="image__lowres js-image-lazyload" data-src="/media/location-settings/location-ios-step-2.png" alt="Alt Text">
                                <picture class="image__container">
                                    <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="/media/location-settings/location-ios-step-2.png" />
                                    <source media="(min-width: 768px) and (max-width:1319px)" class="js-medium-image" type="image/jpeg" data-srcset="/media/location-settings/location-ios-step-2.png" />
                                    <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="/media/location-settings/location-ios-step-2.png" />
                                    <img class="js-image-lazyload js-fallback-image" data-src="" alt="Alt Text">
                                </picture>
                            </figure>
                        </li>
                        <li><span>3</span>Select “Website Settings”</li>
                        <li class="list-image">
                            <figure class="image js-image image--original-size " data-module="imagelazy" data-is-small-image="">
                                <img class="image__lowres js-image-lazyload" data-src="/media/location-settings/location-ios-step-3.png" alt="Alt Text">
                                <picture class="image__container">
                                    <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="/media/location-settings/location-ios-step-3.png" />
                                    <source media="(min-width: 768px) and (max-width:1319px)" class="js-medium-image" type="image/jpeg" data-srcset="/media/location-settings/location-ios-step-3.png" />
                                    <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="/media/location-settings/location-ios-step-3.png" />
                                    <img class="js-image-lazyload js-fallback-image" data-src="" alt="Alt Text">
                                </picture>
                            </figure>
                        </li>
                        <li><span>4</span>Change “Location” to “Allow”</li>
                        <li class="list-image">
                            <figure class="image js-image image--original-size " data-module="imagelazy" data-is-small-image="">
                                <img class="image__lowres js-image-lazyload" data-src="/media/location-settings/location-ios-step-4.png" alt="Different Alt Text">
                                <picture class="image__container">
                                    <source media="(max-width: 767px)" class="js-small-image" type="image/jpeg" data-srcset="/media/location-settings/location-ios-step-4.png" />
                                    <source media="(min-width: 768px) and (max-width:1319px)" class="js-medium-image" type="image/jpeg" data-srcset="/media/location-settings/location-ios-step-4.png" />
                                    <source media="(min-width: 1320px)" class="js-large-image" type="image/jpeg" data-srcset="/media/location-settings/location-ios-step-4.png" />
                                    <img class="js-image-lazyload js-fallback-image" data-src="" alt="Different Alt Text">
                                </picture>
                            </figure>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="location-access-settings-container {{#ifEquals type "notificationSettings"}} notification-settings {{/ifEquals}}" data-module="locationAccessSettings" data-location-access-api="{{appSettingsApi}}">
    <div class="location-access-settings-container__inner">
        <h3>{{heading}}</h3>
        <div class="location-access-settings-container__description">
            {{{description}}}
        </div>
        {{#if listContent}}
            <div class="location-access-settings-container__list">
                {{{listContent}}}
            </div>
        {{/if}}
        <div class="location-access-settings-container__button">
            {{#ifEquals type "locationAccess"}}
                {{> @cp-button-secondary text=buttonText url="#" cssClasses="js-enable-location-access" modifier="full-width" }}
            {{/ifEquals}}
            {{#ifEquals type "notificationSettings"}}
                {{> @cp-button-secondary text=buttonText url="#" cssClasses="js-enable-notification-settings" modifier="full-width" }}
            {{/ifEquals}}
        </div>
        <div class="location-access-settings-container__enabled-message">
            {{{infoMessage}}}
        </div>
    </div>
    <div class="location-access-settings-modal js-enable-loc-access">
        <div class="location-access-settings-modal__inner">
            <div class="location-access-settings-modal__header">
                <a href="#" class="location-access-settings-modal__close-icon js-close-modal"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M4.19148 19.7071C3.80096 19.3166 3.80096 18.6834 4.19148 18.2929L18.1911 4.29331C18.5816 3.90278 19.2148 3.90278 19.6053 4.29331C19.9958 4.68383 19.9958 5.317 19.6053 5.70752L5.6057 19.7071C5.21517 20.0976 4.58201 20.0976 4.19148 19.7071Z" fill="#111317"/><path fill-rule="evenodd" clip-rule="evenodd" d="M4.19133 4.29304C4.58186 3.90252 5.21502 3.90252 5.60554 4.29304L19.6051 18.2926C19.9957 18.6832 19.9957 19.3163 19.6051 19.7068C19.2146 20.0974 18.5814 20.0974 18.1909 19.7068L4.19133 5.70726C3.80081 5.31673 3.80081 4.68357 4.19133 4.29304Z" fill="#111317"/></svg></a>
                {{{modalMapIcon}}}
                <h3 class="general-content">{{modalGeneralContent.heading}}</h3>
                <h3 class="ios-content">{{modalIOSContent.heading}}</h3>
            </div>
            <div class="location-access-settings-modal__content location-access-settings-modal__content--general-content">
                <div class="location-access-settings-modal__list">
                    <ul>
                        <li>{{{modalGeneralContent.step1}}}</li>
                        <li>{{{modalGeneralContent.step2}}}</li>
                        <li>{{{modalGeneralContent.step3}}}</li>
                    </ul>
                </div>
            </div>
            <div class="location-access-settings-modal__content location-access-settings-modal__content--ios-content">
                <div class="location-access-settings-modal__list">
                    <ul>
                        <li>{{{modalIOSContent.step1}}}</li>
                        <li class="list-image">
                            {{> @cp-responsive-image modalIOSContent.step1Image}}
                        </li>
                        <li>{{{modalIOSContent.step2}}}</li>
                        <li class="list-image">
                            {{> @cp-responsive-image modalIOSContent.step2Image}}
                        </li>
                        <li>{{{modalIOSContent.step3}}}</li>
                        <li class="list-image">
                            {{> @cp-responsive-image modalIOSContent.step3Image}}
                        </li>
                        <li>{{{modalIOSContent.step4}}}</li>
                        <li class="list-image">
                            {{> @cp-responsive-image modalIOSContent.step4Image}}
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
{
  "type": "locationAccess",
  "heading": "Location access",
  "description": "Enable location access to get tailored travel tips for your current location. Your location is only used to show reccomendations.",
  "listContent": "<ul><li>View offers and deals nearby you</li><li>Get travel inspiration based on your location</li><li>Local weather warnings and useful travel information</li></ul>",
  "buttonText": "Enable location access",
  "infoMessage": "Location access has been enabled. You can disable location access in the website settings of <a href='#'>Ireland.com</a> in your browser",
  "appSettingsApi": "/data/ti-app-board-settings.json",
  "modalMapIcon": "<svg width='33' height='33' viewBox='0 0 33 33' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M27.4579 19.5397V26.0239L22.5345 29.1647V16.9392C22.3063 16.6353 22.0455 16.2976 21.8172 15.9598C21.6542 15.7234 21.4586 15.4533 21.2955 15.2169V28.8945L16.4048 25.2471V8.63133L18.8502 10.455C18.4915 9.44185 18.2633 8.39492 18.2633 7.34799C18.2633 7.17913 18.2633 7.04404 18.2959 6.87519L15.1984 4.54492L8.38396 9.64448L0.460938 4.57869V27.4761L8.38396 32.5419L15.1984 27.4423L21.9802 32.5419L29.9033 27.4423V16.5677C29.186 17.5471 28.5012 18.3576 27.947 18.9993C27.7839 19.2019 27.6209 19.3708 27.4579 19.5397ZM7.82967 29.1984L2.90631 26.0576V9.17168L7.82967 12.2787V29.1984ZM13.9594 25.2471L9.03606 28.8945V12.2787L13.9594 8.59755V25.2471Z' fill='#5FBD00'/><path d='M26.0872 0.458496C22.4681 0.458496 19.6641 3.80192 19.6641 7.71946C19.6641 8.96902 20.0553 10.2524 20.6096 11.4681C21.1639 12.6502 21.8812 13.8322 22.5985 14.8116C23.3158 15.8247 24.0331 16.669 24.5548 17.2769C24.8157 17.5809 25.0439 17.8173 25.2069 17.9861L25.4678 18.2563C25.6634 18.4252 25.8916 18.5265 26.1199 18.5265C26.3481 18.5265 26.5763 18.4252 26.772 18.2563L27.0328 17.9861C27.1958 17.8173 27.4241 17.5809 27.6849 17.2769C28.2066 16.669 28.9239 15.7909 29.6412 14.8116C30.3585 13.7984 31.0758 12.6502 31.6301 11.4681C32.1844 10.2861 32.5756 9.00279 32.5756 7.71946C32.543 3.80192 29.739 0.458496 26.0872 0.458496ZM26.0872 8.8677C25.2395 8.8677 24.5548 8.15849 24.5548 7.28042C24.5548 6.40235 25.2395 5.69314 26.0872 5.69314C26.935 5.69314 27.6197 6.40235 27.6197 7.28042C27.6197 8.15849 26.935 8.8677 26.0872 8.8677Z' fill='#5FBD00'/></svg>",
  "modalGeneralContent": {
    "heading": "Enable location access",
    "step1": "<span>1</span>Open the website settings for this website in your browser",
    "step2": "<span>2</span>Select Location settings",
    "step3": "<span>3</span>Choose “Allow”"
  },
  "modalIOSContent": {
    "heading": "Location access on iOS",
    "step1": "<span>1</span>Open the My Ireland website",
    "step1Image": {
      "altText": "Alt Text",
      "lowResolutionUrl": "/media/location-settings/location-ios-step-1.png",
      "sources": [
        {
          "type": "image/jpeg",
          "largeUrl": "/media/location-settings/location-ios-step-1.png",
          "smallUrl": "/media/location-settings/location-ios-step-1.png"
        }
      ]
    },
    "step2": "<span>2</span>Select the Icon below",
    "step2Image": {
      "altText": "Alt Text",
      "lowResolutionUrl": "/media/location-settings/location-ios-step-2.png",
      "sources": [
        {
          "type": "image/jpeg",
          "largeUrl": "/media/location-settings/location-ios-step-2.png",
          "smallUrl": "/media/location-settings/location-ios-step-2.png"
        }
      ]
    },
    "step3": "<span>3</span>Select “Website Settings”",
    "step3Image": {
      "altText": "Alt Text",
      "lowResolutionUrl": "/media/location-settings/location-ios-step-3.png",
      "sources": [
        {
          "type": "image/jpeg",
          "largeUrl": "/media/location-settings/location-ios-step-3.png",
          "smallUrl": "/media/location-settings/location-ios-step-3.png"
        }
      ]
    },
    "step4": "<span>4</span>Change “Location” to “Allow”",
    "step4Image": {
      "altText": "Different Alt Text",
      "lowResolutionUrl": "/media/location-settings/location-ios-step-4.png",
      "sources": [
        {
          "type": "image/jpeg",
          "largeUrl": "/media/location-settings/location-ios-step-4.png",
          "smallUrl": "/media/location-settings/location-ios-step-4.png"
        }
      ]
    }
  }
}

There are no notes for this item.