18 lines
1.8 KiB
Plaintext
18 lines
1.8 KiB
Plaintext
component CookiePreferencesDialog {
|
|
props {
|
|
title = "Cookie preferences"
|
|
description = "Choose which optional cookies you allow. Essential cookies are always enabled."
|
|
saveLabel = "Save preferences"
|
|
acceptLabel = "Accept all"
|
|
rejectLabel = "Reject optional"
|
|
open = false
|
|
class = ""
|
|
}
|
|
state visible = open
|
|
state analytics = false
|
|
state marketing = false
|
|
view {
|
|
<div data-show="visible" class="wire-overlay {class}" role="presentation"><section role="dialog" aria-modal="true" aria-labelledby="cookie-preferences-title" class="wire-dialog wire-cookie-dialog"><h2 id="cookie-preferences-title" class="wire-dialog__title">{title}</h2><p class="wire-dialog__description">{description}</p><div class="wire-cookie-list"><label class="wire-cookie-option"><span><strong>Essential</strong><small>Required for security and core functionality.</small></span><input type="checkbox" checked disabled /></label><label class="wire-cookie-option"><span><strong>Analytics</strong><small>Helps improve product performance.</small></span><input type="checkbox" checked="{analytics}" @change="analytics = event.target.checked" /></label><label class="wire-cookie-option"><span><strong>Marketing</strong><small>Supports relevant campaigns and measurement.</small></span><input type="checkbox" checked="{marketing}" @change="marketing = event.target.checked" /></label></div><div class="wire-dialog__actions wire-dialog__actions--wrap"><button type="button" class="wire-btn wire-btn--ghost" @click="analytics = false; marketing = false">{rejectLabel}</button><button type="button" class="wire-btn wire-btn--default" @click="analytics = true; marketing = true">{acceptLabel}</button><button type="button" class="wire-btn wire-btn--primary" @click="visible = false">{saveLabel}</button></div></section></div>
|
|
}
|
|
}
|