Release v2.5.6
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
<div class="page-header">
|
||||
<div>
|
||||
<h2>{{#if isEdit}}Edit announcement{{#if announcement.short_label}} - {{announcement.short_label}}{{/if}}{{else}}Add announcement{{/if}}</h2>
|
||||
<p>{{#if isEdit}}Update the message, screens, color, or expiry behavior.{{else}}Give the announcement a short description, then define the full message and target screens.{{/if}}</p>
|
||||
<p>{{#if isEdit}}Update the message, screen groups, color, or expiry behavior.{{else}}Give the announcement a short description, then define the full message and target screen groups.{{/if}}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -13,41 +13,43 @@
|
||||
<h3 class="card-title">Content</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-4">
|
||||
<label for="announcement-short-label" class="form-label">{{#if isEdit}}Descriptor{{else}}Short Description{{/if}}</label>
|
||||
<input id="announcement-short-label" name="short_label" class="form-control" value="{{announcement.short_label}}" maxlength="255" placeholder="{{#if isEdit}}Power warning{{else}}Announcement Short Name{{/if}}" />
|
||||
<div class="mb-3">
|
||||
<label for="announcement-short-label" class="form-label">Short Description</label>
|
||||
<input id="announcement-short-label" name="short_label" class="form-control" value="{{announcement.short_label}}" maxlength="128" data-limit-text-length placeholder="{{#if isEdit}}Power warning{{else}}Announcement Short Name{{/if}}" />
|
||||
<div class="form-text">A short name for admin lists and page titles.</div>
|
||||
</div>
|
||||
<div class="mb-0">
|
||||
<div class="mb-3">
|
||||
<label for="announcement-message" class="form-label">Message</label>
|
||||
<textarea id="announcement-message" name="message" class="form-control" rows="6" required placeholder="{{#if isEdit}}{{else}}Maintenance starts in 10 minutes.{{/if}}">{{announcement.message}}</textarea>
|
||||
<div class="form-text">Use the full text that should appear on screens.</div>
|
||||
</div>
|
||||
<div class="row g-3 mb-0">
|
||||
<div class="col-12 col-md-6 col-xl-12">
|
||||
<label for="announcement-type" class="form-label">Type</label>
|
||||
<select id="announcement-type" name="announcement_type" class="form-select">
|
||||
{{#each announcementTypes}}
|
||||
<option value="{{value}}" {{#if (eq ../announcement.announcement_type value)}}selected{{/if}}>{{label}}</option>
|
||||
{{/each}}
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 col-xl-12">
|
||||
<label for="announcement-color" class="form-label">Color</label>
|
||||
<div class="row g-2 align-items-stretch">
|
||||
<div class="col">
|
||||
<select id="announcement-color" name="color_key" class="form-select">
|
||||
{{#each announcementColors}}
|
||||
<option value="{{value}}" {{#if (eq ../announcement.color_key value)}}selected{{/if}}>{{label}}</option>
|
||||
<div class="col-12 col-lg-6">
|
||||
<label id="announcement-type-label" class="form-label">Type</label>
|
||||
<div class="announcement-type-picker" data-announcement-type-picker-shell>
|
||||
<input id="announcement-type" name="announcement_type" type="hidden" value="{{announcement.announcement_type}}" data-announcement-type-value />
|
||||
<button type="button" class="announcement-type-picker__toggle" data-announcement-type-picker-toggle aria-expanded="false" aria-controls="announcement-type-picker-menu" title="Select a type">
|
||||
<span class="announcement-type-picker__toggle-icon" data-announcement-type-picker-icon aria-hidden="true"></span>
|
||||
<span class="announcement-type-picker__toggle-content">
|
||||
<span class="announcement-type-picker__toggle-label" data-announcement-type-picker-label>Select a type</span>
|
||||
<span class="announcement-type-picker__toggle-hint">Click to choose</span>
|
||||
</span>
|
||||
<i class="bi bi-chevron-down announcement-type-picker__caret" aria-hidden="true"></i>
|
||||
</button>
|
||||
<div id="announcement-type-picker-menu" class="announcement-type-picker__menu" data-announcement-type-picker hidden>
|
||||
<div class="announcement-type-picker__grid" role="radiogroup" aria-labelledby="announcement-type-label">
|
||||
{{#each announcementTypes}}
|
||||
<button type="button" class="announcement-type-picker__option {{#if (eq ../announcement.announcement_type value)}}is-selected{{/if}}" data-announcement-type-option data-type-key="{{value}}" data-type-label="{{label}}" data-type-icon="{{icon}}" aria-pressed="{{#if (eq ../announcement.announcement_type value)}}true{{else}}false{{/if}}" title="{{label}}">
|
||||
<span class="announcement-type-picker__option-icon" aria-hidden="true">
|
||||
<i class="bi bi-{{icon}}"></i>
|
||||
</span>
|
||||
<span class="announcement-type-picker__label">{{label}}</span>
|
||||
</button>
|
||||
{{/each}}
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="announcement-color-preview" data-announcement-color-preview aria-hidden="true"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-md-6 col-xl-12">
|
||||
<div class="col-12 col-lg-6">
|
||||
<div class="form-label">Icon</div>
|
||||
<div class="announcement-icon-picker" data-announcement-icon-picker-shell>
|
||||
<select id="announcement-icon" name="icon_key" class="d-none" tabindex="-1" aria-hidden="true">
|
||||
@@ -55,9 +57,12 @@
|
||||
<option value="{{value}}" {{#if (eq ../announcement.icon_key value)}}selected{{/if}}>{{label}}</option>
|
||||
{{/each}}
|
||||
</select>
|
||||
<button type="button" class="announcement-icon-picker__toggle" data-announcement-icon-picker-toggle aria-expanded="false" aria-controls="announcement-icon-picker-menu">
|
||||
<button type="button" class="announcement-icon-picker__toggle" data-announcement-icon-picker-toggle aria-expanded="false" aria-controls="announcement-icon-picker-menu" title="Select an icon">
|
||||
<span class="announcement-icon-picker__toggle-icon" data-announcement-icon-picker-icon aria-hidden="true"></span>
|
||||
<span class="announcement-icon-picker__toggle-label" data-announcement-icon-picker-label>Select an icon</span>
|
||||
<span class="announcement-icon-picker__toggle-content">
|
||||
<span class="announcement-icon-picker__toggle-label" data-announcement-icon-picker-label>Select an icon</span>
|
||||
<span class="announcement-icon-picker__toggle-hint">Click to choose</span>
|
||||
</span>
|
||||
<i class="bi bi-chevron-down announcement-icon-picker__caret" aria-hidden="true"></i>
|
||||
</button>
|
||||
<div id="announcement-icon-picker-menu" class="announcement-icon-picker__menu" data-announcement-icon-picker hidden>
|
||||
@@ -76,6 +81,22 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label id="announcement-color-label" class="form-label">Color</label>
|
||||
<div class="announcement-color-picker" data-announcement-color-picker-shell>
|
||||
<input id="announcement-color" name="color_key" type="hidden" value="{{announcement.color_key}}" data-announcement-color-value />
|
||||
<div class="announcement-color-picker__grid" role="radiogroup" aria-labelledby="announcement-color-label">
|
||||
{{#each announcementColors}}
|
||||
<button type="button" class="announcement-color-picker__option {{#if (eq ../announcement.color_key value)}}is-selected{{/if}}" data-announcement-color-option data-color-key="{{value}}" data-color-label="{{label}}" aria-pressed="{{#if (eq ../announcement.color_key value)}}true{{else}}false{{/if}}" title="{{label}}">
|
||||
<span class="announcement-color-picker__swatch {{#if (eq value 'light')}}text-bg-light text-dark{{else}}text-bg-{{value}}{{/if}}" aria-hidden="true">
|
||||
<i class="bi bi-check-lg announcement-color-picker__check" aria-hidden="true"></i>
|
||||
</span>
|
||||
<span class="announcement-color-picker__label">{{label}}</span>
|
||||
</button>
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -84,16 +105,16 @@
|
||||
<div class="card card-outline card-primary admin-form-card mb-3">
|
||||
<div class="card-footer d-flex flex-wrap align-items-center">
|
||||
{{#if isEdit}}
|
||||
<button type="submit" class="btn {{announcement.actionClassName}}" form="{{actionFormId}}"><i class="bi {{announcement.actionIcon}} me-1" aria-hidden="true"></i>{{announcement.actionLabel}}</button>
|
||||
<button type="submit" class="btn {{actionClassName}}" form="{{actionFormId}}" {{#if actionDisabled}}disabled title="{{actionDisabledTitle}}"{{/if}}><i class="bi {{actionIcon}} me-1" aria-hidden="true"></i>{{actionLabel}}</button>
|
||||
{{/if}}
|
||||
<div class="ms-auto d-flex flex-wrap align-items-center gap-2">
|
||||
{{{saveActionButtons formId="announcement-form" saveUrl=formAction cancelUrl=cancelUrl deleteUrl=deleteUrl deleteDisabled=deleteDisabled deleteTitle=announcement.deleteBlockedMessage showDelete=showDeleteAction showSaveAndClose=showSaveSecondaryActions showSaveAndNew=showSaveSecondaryActions}}}
|
||||
{{{saveActionButtons formId="announcement-form" saveUrl=formAction cancelUrl=cancelUrl deleteUrl=deleteUrl deleteConfirmMessage=deleteConfirmMessage deleteDisabled=deleteDisabled deleteTitle=deleteTitle showDelete=showDeleteAction showSaveAndClose=showSaveSecondaryActions showSaveAndNew=showSaveSecondaryActions}}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card card-outline card-secondary admin-form-card mb-4">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Screens</h3>
|
||||
<h3 class="card-title">Screen Groups</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="row g-3 mb-0">
|
||||
@@ -119,14 +140,27 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-md-4 col-xl-12">
|
||||
<label class="form-label" id="announcement-screens-label">Target screen groups</label>
|
||||
<div class="announcement-screen-actions">
|
||||
<button type="button" class="btn btn-sm btn-outline-primary announcement-screen-action" data-announcement-screen-select-all>Select all</button>
|
||||
<button type="button" class="btn btn-sm btn-outline-secondary announcement-screen-action" data-announcement-screen-select-none>Select none</button>
|
||||
</div>
|
||||
<div class="announcement-screen-picker" role="group" aria-labelledby="announcement-screens-label">
|
||||
{{#each announcementScreens}}
|
||||
<div class="announcement-screen-option">
|
||||
<input class="btn-check" type="checkbox" id="announcement-screen-{{id}}" name="screen_ids[]" value="{{id}}" autocomplete="off" {{#if isSelected}}checked{{/if}} />
|
||||
<label class="announcement-screen-chip" for="announcement-screen-{{id}}" title="{{name}}">
|
||||
<span class="announcement-screen-chip__text">{{name}}</span>
|
||||
<span class="announcement-screen-chip__check" aria-hidden="true">
|
||||
<i class="bi bi-check-lg announcement-screen-chip__check-icon"></i>
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<label for="announcement-screens" class="form-label">Target screens</label>
|
||||
<select id="announcement-screens" name="screen_ids[]" class="form-select" multiple size="8" required>
|
||||
{{#each announcementScreens}}
|
||||
<option value="{{id}}" {{#if isSelected}}selected{{/if}}>{{name}}{{#if slug}} ({{slug}}){{/if}}</option>
|
||||
{{/each}}
|
||||
</select>
|
||||
<div class="form-text">Select one or more screens for this announcement.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -136,5 +170,4 @@
|
||||
|
||||
{{#if isEdit}}
|
||||
<form id="announcement-action-form" method="post" action="{{announcement.actionPath}}" class="d-none" data-confirm-message="{{announcement.actionConfirmMessage}}" data-async-command></form>
|
||||
<form id="delete-announcement-form" method="post" action="/announcements/{{announcement.id}}/delete" class="d-none" data-confirm-message="Delete this announcement?"></form>
|
||||
{{/if}}
|
||||
Reference in New Issue
Block a user