summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--extensions/BMO/template/en/default/hook/flag/type_comment-form.html.tmpl202
-rw-r--r--extensions/FlagTypeComment/template/en/default/flag/type_comment.html.tmpl40
-rw-r--r--extensions/FlagTypeComment/web/js/ftc.js189
-rw-r--r--extensions/FlagTypeComment/web/styles/ftc.css58
-rw-r--r--skins/standard/attachment.css4
-rw-r--r--skins/standard/global.css61
-rw-r--r--template/en/default/flag/list.html.tmpl1
7 files changed, 522 insertions, 33 deletions
diff --git a/extensions/BMO/template/en/default/hook/flag/type_comment-form.html.tmpl b/extensions/BMO/template/en/default/hook/flag/type_comment-form.html.tmpl
new file mode 100644
index 000000000..7963af850
--- /dev/null
+++ b/extensions/BMO/template/en/default/hook/flag/type_comment-form.html.tmpl
@@ -0,0 +1,202 @@
+[%# This Source Code Form is subject to the terms of the Mozilla Public
+ # License, v. 2.0. If a copy of the MPL was not distributed with this
+ # file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ #
+ # This Source Code Form is "Incompatible With Secondary Licenses", as
+ # defined by the Mozilla Public License, v. 2.0.
+ #%]
+
+<template class="approval-request" data-flags="approval‑mozilla‑beta approval‑mozilla‑release">
+ <fieldset>
+ <legend>Beta/Release Uplift Approval Request</legend>
+ <table>
+ <tr>
+ <th id="_ar_beta_i1_label">Feature/[% terms.Bug %] causing the regression</th>
+ <td><input type="text" placeholder="[% terms.Bug %] ID" aria-labelledby="_ar_beta_i1_label" data-type="b[% %]ug"></td>
+ </tr>
+ <tr>
+ <th id="_ar_beta_i2_label">User impact if declined</th>
+ <td><textarea aria-labelledby="_ar_beta_i2_label"></textarea></td>
+ </tr>
+ <tr>
+ <th id="_ar_beta_i3_label">Is this code covered by automated tests?</th>
+ <td>
+ <div role="radiogroup" class="buttons toggle" aria-labelledby="_ar_beta_i3_label">
+ <div class="item"><input id="_ar_beta_i3_r1" type="radio" name="_ar_beta_i3_radio" value="Yes"><label for="_ar_beta_i3_r1">Yes</label></div>
+ <div class="item"><input id="_ar_beta_i3_r2" type="radio" name="_ar_beta_i3_radio" value="No"><label for="_ar_beta_i3_r2">No</label></div>
+ <div class="item"><input id="_ar_beta_i3_r3" type="radio" name="_ar_beta_i3_radio" value="Dunno"><label for="_ar_beta_i3_r3">Dunno</label></div>
+ </div>
+ </td>
+ </tr>
+ <tr>
+ <th id="_ar_beta_i4_label">Has the fix been verified in Nightly?</th>
+ <td>
+ <div role="radiogroup" class="buttons toggle" aria-labelledby="_ar_beta_i4_label">
+ <div class="item"><input id="_ar_beta_i4_r1" type="radio" name="_ar_beta_i4_radio" value="Yes"><label for="_ar_beta_i4_r1">Yes</label></div>
+ <div class="item"><input id="_ar_beta_i4_r2" type="radio" name="_ar_beta_i4_radio" value="No"><label for="_ar_beta_i4_r2">No</label></div>
+ </div>
+ </td>
+ </tr>
+ <tr>
+ <th id="_ar_beta_i5_label">Needs manual test from QE?</th>
+ <td>
+ <div role="radiogroup" class="buttons toggle" aria-labelledby="_ar_beta_i5_label">
+ <div class="item"><input id="_ar_beta_i5_r1" type="radio" name="_ar_beta_i5_radio" value="Yes"><label for="_ar_beta_i5_r1">Yes</label></div>
+ <div class="item"><input id="_ar_beta_i5_r2" type="radio" name="_ar_beta_i5_radio" value="No"><label for="_ar_beta_i5_r2">No</label></div>
+ </div>
+ </td>
+ </tr>
+ <tr>
+ <th id="_ar_beta_i6_label">If yes, steps to reproduce</th>
+ <td><textarea aria-labelledby="_ar_beta_i6_label"></textarea></td>
+ </tr>
+ <tr>
+ <th id="_ar_beta_i7_label">List of other uplifts needed</th>
+ <td><input type="text" placeholder="[% terms.Bug %] IDs" aria-labelledby="_ar_beta_i7_label" data-type="b[% %]ugs"></td>
+ </tr>
+ <tr>
+ <th id="_ar_beta_i8_label">Risk to taking this patch</th>
+ <td>
+ <div role="radiogroup" class="buttons toggle" aria-labelledby="_ar_beta_i8_label">
+ <div class="item"><input id="_ar_beta_i8_r1" type="radio" name="_ar_beta_i8_radio" value="Low"><label for="_ar_beta_i8_r1">Low</label></div>
+ <div class="item"><input id="_ar_beta_i8_r2" type="radio" name="_ar_beta_i8_radio" value="Medium"><label for="_ar_beta_i8_r2">Medium</label></div>
+ <div class="item"><input id="_ar_beta_i8_r3" type="radio" name="_ar_beta_i8_radio" value="High"><label for="_ar_beta_i8_r3">High</label></div>
+ </div>
+ </td>
+ </tr>
+ <tr>
+ <th id="_ar_beta_i9_label">Why is the change risky/not risky?<br>(and alternatives if risky)</th>
+ <td><textarea aria-labelledby="_ar_beta_i9_label"></textarea></td>
+ </tr>
+ <tr>
+ <th id="_ar_beta_i10_label">String changes made/needed</th>
+ <td><input type="text" class="long" aria-labelledby="_ar_beta_i10_label"></td>
+ </tr>
+ </table>
+ </fieldset>
+</template>
+
+<template class="approval-request" data-flags="approval‑mozilla‑esr*">
+ <fieldset>
+ <legend>ESR Uplift Approval Request</legend>
+ <table>
+ <tr>
+ <th id="_ar_esr_i1_label">If this is not a sec:{high,crit} [% terms.bug %], please state case for ESR consideration</th>
+ <td><textarea aria-labelledby="_ar_esr_i1_label"></textarea></td>
+ </tr>
+ <tr>
+ <th id="_ar_esr_i2_label">User impact if declined</th>
+ <td><textarea aria-labelledby="_ar_esr_i2_label"></textarea></td>
+ </tr>
+ <tr>
+ <th id="_ar_esr_i3_label">Fix Landed on Version</th>
+ <td><input type="text" aria-labelledby="_ar_esr_i3_label"></td>
+ </tr>
+ <tr>
+ <th id="_ar_esr_i4_label">Risk to taking this patch</th>
+ <td>
+ <div role="radiogroup" class="buttons toggle" aria-labelledby="_ar_esr_i4_label">
+ <div class="item"><input id="_ar_esr_i4_r1" type="radio" name="_ar_esr_i4_radio" value="Low"><label for="_ar_esr_i4_r1">Low</label></div>
+ <div class="item"><input id="_ar_esr_i4_r2" type="radio" name="_ar_esr_i4_radio" value="Medium"><label for="_ar_esr_i4_r2">Medium</label></div>
+ <div class="item"><input id="_ar_esr_i4_r3" type="radio" name="_ar_esr_i4_radio" value="High"><label for="_ar_esr_i4_r3">High</label></div>
+ </div>
+ </td>
+ </tr>
+ <tr>
+ <th id="_ar_esr_i5_label">Why is the change risky/not risky?<br>(and alternatives if risky)</th>
+ <td><textarea aria-labelledby="_ar_esr_i5_label"></textarea></td>
+ </tr>
+ <tr>
+ <th id="_ar_esr_i6_label">String or UUID changes made by this patch</th>
+ <td><input type="text" class="long" aria-labelledby="_ar_esr_i6_label"></td>
+ </tr>
+ </table>
+ <p>See <a href="https://wiki.mozilla.org/Release_Management/ESR_Landing_Process" target="_blank">ESR Landing Process</a> for more info.</p>
+ </fieldset>
+</template>
+
+<template class="approval-request" data-flags="approval‑mozilla‑geckoview*">
+ <fieldset>
+ <legend>GeckoView Uplift Approval Request</legend>
+ <table>
+ <tr>
+ <th id="_ar_gkv_i1_label">If this is not a sec:{high,crit} [% terms.bug %], please state case for consideration</th>
+ <td><textarea aria-labelledby="_ar_gkv_i1_label"></textarea></td>
+ </tr>
+ <tr>
+ <th id="_ar_gkv_i2_label">User impact if declined</th>
+ <td><textarea aria-labelledby="_ar_gkv_i2_label"></textarea></td>
+ </tr>
+ <tr>
+ <th id="_ar_gkv_i3_label">Fix Landed on Version</th>
+ <td><input type="text" aria-labelledby="_ar_gkv_i3_label"></td>
+ </tr>
+ <tr>
+ <th id="_ar_gkv_i4_label">Risk to taking this patch</th>
+ <td>
+ <div role="radiogroup" class="buttons toggle" aria-labelledby="_ar_gkv_i4_label">
+ <div class="item"><input id="_ar_gkv_i4_r1" type="radio" name="_ar_gkv_i4_radio" value="Low"><label for="_ar_gkv_i4_r1">Low</label></div>
+ <div class="item"><input id="_ar_gkv_i4_r2" type="radio" name="_ar_gkv_i4_radio" value="Medium"><label for="_ar_gkv_i4_r2">Medium</label></div>
+ <div class="item"><input id="_ar_gkv_i4_r3" type="radio" name="_ar_gkv_i4_radio" value="High"><label for="_ar_gkv_i4_r3">High</label></div>
+ </div>
+ </td>
+ </tr>
+ <tr>
+ <th id="_ar_gkv_i5_label">Why is the change risky/not risky?<br>(and alternatives if risky)</th>
+ <td><textarea aria-labelledby="_ar_gkv_i5_label"></textarea></td>
+ </tr>
+ <tr>
+ <th id="_ar_gkv_i6_label">String or UUID changes made by this patch</th>
+ <td><input type="text" class="long" aria-labelledby="_ar_gkv_i6_label"></td>
+ </tr>
+ </table>
+ <p>See <a href="https://wiki.mozilla.org/Release_Management/Uplift_rules" target="_blank">Patch uplifting rules</a> for more info.</p>
+ </fieldset>
+</template>
+
+<template class="approval-request" data-flags="sec‑approval">
+ <fieldset>
+ <legend>Security Approval Request</legend>
+ <table>
+ <tr>
+ <th id="_ar_sec_i1_label">How easily could an exploit be constructed based on the patch?</th>
+ <td><textarea aria-labelledby="_ar_sec_i1_label"></textarea></td>
+ </tr>
+ <tr>
+ <th id="_ar_sec_i2_label">Do comments in the patch, the check-in comment, or tests included in the patch paint a bulls-eye on the security problem?</th>
+ <td>
+ <div role="radiogroup" class="buttons toggle" aria-labelledby="_ar_sec_i2_label">
+ <div class="item"><input id="_ar_sec_i2_r1" type="radio" name="_ar_sec_i2_radio" value="Yes"><label for="_ar_sec_i2_r1">Yes</label></div>
+ <div class="item"><input id="_ar_sec_i2_r2" type="radio" name="_ar_sec_i2_radio" value="No"><label for="_ar_sec_i2_r2">No</label></div>
+ <div class="item"><input id="_ar_sec_i2_r3" type="radio" name="_ar_sec_i2_radio" value="Dunno"><label for="_ar_sec_i2_r3">Dunno</label></div>
+ </div>
+ </td>
+ </tr>
+ <tr>
+ <th id="_ar_sec_i3_label">Which older supported branches are affected by this flaw?</th>
+ <td><input type="text" aria-labelledby="_ar_sec_i3_label"></td>
+ </tr>
+ <tr>
+ <th id="_ar_sec_i4_label">If not all supported branches, which [% terms.bug %] introduced the flaw?</th>
+ <td><input type="text" placeholder="[% terms.Bug %] ID" aria-labelledby="_ar_sec_i4_label" data-type="b[% %]ug"></td>
+ </tr>
+ <tr>
+ <th id="_ar_sec_i5_label">Do you have backports for the affected branches?</th>
+ <td>
+ <div role="radiogroup" class="buttons toggle" aria-labelledby="_ar_sec_i5_label">
+ <div class="item"><input id="_ar_sec_i5_r1" type="radio" name="_ar_sec_i5_radio" value="Yes"><label for="_ar_sec_i5_r1">Yes</label></div>
+ <div class="item"><input id="_ar_sec_i5_r2" type="radio" name="_ar_sec_i5_radio" value="No"><label for="_ar_sec_i5_r2">No</label></div>
+ </div>
+ </td>
+ </tr>
+ <tr>
+ <th id="_ar_sec_i6_label">If not, how different, hard to create, and risky will they be?</th>
+ <td><textarea aria-labelledby="_ar_sec_i6_label"></textarea></td>
+ </tr>
+ <tr>
+ <th id="_ar_sec_i7_label">How likely is this patch to cause regressions; how much testing does it need?</th>
+ <td><textarea aria-labelledby="_ar_sec_i7_label"></textarea></td>
+ </tr>
+ </table>
+ </fieldset>
+</template>
diff --git a/extensions/FlagTypeComment/template/en/default/flag/type_comment.html.tmpl b/extensions/FlagTypeComment/template/en/default/flag/type_comment.html.tmpl
index 88d9d4dd7..56e03040a 100644
--- a/extensions/FlagTypeComment/template/en/default/flag/type_comment.html.tmpl
+++ b/extensions/FlagTypeComment/template/en/default/flag/type_comment.html.tmpl
@@ -20,35 +20,17 @@
# byron jones <glob@mozilla.com>
#%]
-[% IF ftc_flags.keys.size %]
- <script [% script_nonce FILTER none %]>
- YAHOO.util.Event.onDOMReady(function() {
- var selects = YAHOO.util.Dom.getElementsByClassName('flag_select');
- for (var i = 0; i < selects.length; i++) {
- YAHOO.util.Event.on(selects[i], 'change', ftc_on_change);
- }
- });
+<link rel="stylesheet" href="extensions/FlagTypeComment/web/styles/ftc.css">
+<script [% script_nonce FILTER none %] src="extensions/FlagTypeComment/web/js/ftc.js"></script>
- function ftc_on_change(ev) {
- var id = ev.target.id.split('-')[1];
- var state = ev.target.value;
- var commentEl = document.getElementById('comment');
- if (!commentEl) return;
- [% FOREACH type_id = ftc_flags.keys %]
- [% FOREACH state = ftc_states %]
- if ([% type_id FILTER none %] == id && '[% state FILTER js %]' == state) {
- var text = '[% ftc_flags.$type_id.$state FILTER js %]';
- var value = commentEl.value;
- if (value == text) {
- return;
- } else if (value == '') {
- commentEl.value = text;
- } else {
- commentEl.value = text + "\n\n" + value;
- }
- }
- [% END %]
+[% IF ftc_flags.keys.size %]
+ [%# plaintext templates from database %]
+ [% FOREACH type_id = ftc_flags.keys %]
+ [% FOREACH state = ftc_states %]
+ <meta name="ftc:[% type_id FILTER none %]:[% state FILTER html %]"
+ content="[% ftc_flags.$type_id.$state FILTER html_linebreak %]">
[% END %]
- }
- </script>
+ [% END %]
+ [%# HTML form templates from extensions %]
+ [% Hook.process("form") %]
[% END %]
diff --git a/extensions/FlagTypeComment/web/js/ftc.js b/extensions/FlagTypeComment/web/js/ftc.js
new file mode 100644
index 000000000..2682721bc
--- /dev/null
+++ b/extensions/FlagTypeComment/web/js/ftc.js
@@ -0,0 +1,189 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * This Source Code Form is "Incompatible With Secondary Licenses", as
+ * defined by the Mozilla Public License, v. 2.0. */
+
+/**
+ * Reference or define the Bugzilla app namespace.
+ * @namespace
+ */
+var Bugzilla = Bugzilla || {}; // eslint-disable-line no-var
+
+/**
+ * Provide the ability to insert a comment template when a patch's approval flag is selected.
+ */
+Bugzilla.FlagTypeComment = class FlagTypeComment {
+ /**
+ * Initialize a new FlagTypeComment instance.
+ */
+ constructor() {
+ this.templates = [...document.querySelectorAll('template.approval-request')];
+ this.$flags = document.querySelector('#flags');
+ this.$comment = document.querySelector('#comment');
+
+ if (this.$flags && this.$comment) {
+ this.selects = [...this.$flags.querySelectorAll('.flag_select')];
+ this.selects.forEach($select => $select.addEventListener('change', () => this.flag_onselect($select)));
+ this.$comment.form.addEventListener('submit', () => this.form_onsubmit());
+ }
+ }
+
+ /**
+ * Check if a `<fieldset>` is compatible with the given flag. For example, `approval‑mozilla‑beta` matches
+ * `<fieldset data-flags="approval‑mozilla‑beta approval‑mozilla‑release">` while `approval‑mozilla‑esr60`
+ * matches `<fieldset data-flags="approval‑mozilla‑esr*">`.
+ * @param {String} name Flag name, such as `approval‑mozilla‑beta`.
+ * @param {(HTMLFieldSetElement|HTMLTemplateElement)} $element `<fieldset>` or `<template>` element with the
+ * `data-flags` attribute which is a space-separated list of flag names (wildcard chars can be used).
+ * @returns {Boolean} Whether the `<fieldset>` is compatible.
+ */
+ check_compatibility(name, $element) {
+ return !!$element.dataset.flags.split(' ')
+ .find(_name => !!name.match(new RegExp(`^${_name.replace('*', '.+')}$`, 'i')));
+ }
+
+ /**
+ * Return a list of temporary `<fieldset>`s already inserted to the current page.
+ * @type {Array<HTMLFieldSetElement>}
+ */
+ get inserted_fieldsets() {
+ return [...this.$flags.parentElement.querySelectorAll('fieldset.approval-request')];
+ }
+
+ /**
+ * Find a temporary `<fieldset>` already inserted to the current page by a flag name.
+ * @param {String} name Flag name, such as `approval‑mozilla‑beta`.
+ * @returns {HTMLFieldSetElement} Any `<fieldset>` element.
+ */
+ find_inserted_fieldset(name) {
+ return this.inserted_fieldsets.find($fieldset => this.check_compatibility(name, $fieldset));
+ }
+
+ /**
+ * Find an available `<fieldset>` embedded in HTML by a flag name.
+ * @param {String} name Flag name, such as `approval‑mozilla‑beta`.
+ * @returns {HTMLFieldSetElement} Any `<fieldset>` element.
+ */
+ find_available_fieldset(name) {
+ for (const $template of this.templates) {
+ if (this.check_compatibility(name, $template)) {
+ const $fieldset = $template.content.cloneNode(true).querySelector('fieldset');
+
+ $fieldset.className = 'approval-request';
+ $fieldset.dataset.flags = $template.dataset.flags;
+
+ return $fieldset;
+ }
+ }
+
+ return null;
+ }
+
+ /**
+ * Find a `<select>` element for a requested flag that matches the given `<fieldset>`.
+ * @param {HTMLFieldSetElement} $fieldset `<fieldset>` element with the `data-flags` attribute.
+ * @returns {HTMLSelectElement} Any `<select>` element.
+ */
+ find_select($fieldset) {
+ return this.selects
+ .find($_select => $_select.value === '?' && this.check_compatibility($_select.dataset.name, $fieldset));
+ }
+
+ /**
+ * Add text to the comment box at the end of any existing comment.
+ * @param {String} text Comment text to be added.
+ */
+ add_comment(text) {
+ this.$comment.value = this.$comment.value.match(/\S+/g) ? [this.$comment.value, text].join('\n\n') : text;
+ }
+
+ /**
+ * Called whenever a flag selection is changed. Insert or remove a comment template.
+ * @param {HTMLSelectElement} $select `<select>` element that the `change` event is fired.
+ */
+ flag_onselect($select) {
+ const id = Number($select.dataset.id);
+ const { name } = $select.dataset;
+ const state = $select.value;
+ let $fieldset = this.find_inserted_fieldset(name);
+
+ // Remove the temporary `<fieldset>` if not required. One `<fieldset>` can support multiple flags, so, for example,
+ // if `approval‑mozilla‑release` is unselected but `approval‑mozilla‑beta` is still selected, keep it
+ if (state !== '?' && $fieldset && !this.find_select($fieldset)) {
+ $fieldset.remove();
+ }
+
+ // Insert a temporary `<fieldset>` if available
+ if (state === '?' && !$fieldset) {
+ $fieldset = this.find_available_fieldset(name);
+
+ if ($fieldset) {
+ this.$flags.parentElement.appendChild($fieldset);
+ }
+ }
+
+ // Insert a traditional plaintext comment template if available
+ if (!$fieldset) {
+ const $meta = document.querySelector(`meta[name="ftc:${id}:${state}"]`);
+ const text = $meta ? $meta.content : '';
+
+ if (text && this.$comment.value !== text) {
+ this.add_comment(text);
+ }
+ }
+ }
+
+ /**
+ * Convert the input values into comment text and remove the temporary `<fieldset>` before submitting the form.
+ * @returns {Boolean} Always `true` to allow submitting the form.
+ */
+ form_onsubmit() {
+ for (const $fieldset of this.inserted_fieldsets) {
+ const text = [
+ `[${$fieldset.querySelector('legend').innerText}]`,
+ ...[...$fieldset.querySelectorAll('tr')].map($tr => {
+ const checkboxes = [...$tr.querySelectorAll('input[type="checkbox"]:checked')];
+ const $radio = $tr.querySelector('input[type="radio"]:checked');
+ const $input = $tr.querySelector('textarea,select,input');
+ const label = $tr.querySelector('th').innerText.replace(/\n/g, ' ');
+ let value = '';
+
+ if (checkboxes.length) {
+ value = checkboxes.map($checkbox => $checkbox.value.trim()).join(', ');
+ } else if ($radio) {
+ value = $radio.value.trim();
+ } else if ($input) {
+ value = $input.value.trim();
+
+ if ($input.dataset.type === 'bug') {
+ if (!value) {
+ value = 'None';
+ } else if (!isNaN(value)) {
+ value = `Bug ${value}`;
+ }
+ }
+
+ if ($input.dataset.type === 'bugs') {
+ if (!value) {
+ value = 'None';
+ } else {
+ value = value.split(/,\s*/).map(str => (!isNaN(str) ? `Bug ${str}` : str)).join(', ');
+ }
+ }
+ }
+
+ return `${label}: ${value}`;
+ }),
+ ].join('\n\n');
+
+ this.add_comment(text);
+ $fieldset.remove();
+ }
+
+ return true;
+ }
+};
+
+window.addEventListener('DOMContentLoaded', () => new Bugzilla.FlagTypeComment());
diff --git a/extensions/FlagTypeComment/web/styles/ftc.css b/extensions/FlagTypeComment/web/styles/ftc.css
new file mode 100644
index 000000000..93d190935
--- /dev/null
+++ b/extensions/FlagTypeComment/web/styles/ftc.css
@@ -0,0 +1,58 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * This Source Code Form is "Incompatible With Secondary Licenses", as
+ * defined by the Mozilla Public License, v. 2.0. */
+
+fieldset.approval-request {
+ margin: 1em 0;
+}
+
+fieldset.approval-request legend {
+ font-weight: bold;
+}
+
+fieldset.approval-request th {
+ padding: .4em;
+ width: 20em;
+ line-height: 1.25;
+ font-weight: normal;
+ text-align: right;
+ vertical-align: top;
+ white-space: normal !important;
+}
+
+fieldset.approval-request td {
+ vertical-align: middle;
+}
+
+fieldset.approval-request label {
+ font-weight: normal !important;
+}
+
+fieldset.approval-request input[type="text"] {
+ width: 10em;
+}
+
+fieldset.approval-request input.long[type="text"] {
+ width: 40em;
+}
+
+fieldset.approval-request textarea {
+ width: 40em;
+ min-height: 5em;
+ font-size: inherit;
+ line-height: inherit;
+ font-family: inherit;
+ resize: vertical;
+}
+
+fieldset.approval-request div {
+ padding: 0 !important;
+}
+
+fieldset.approval-request table ~ p:last-child {
+ margin: .4em;
+ text-align: right;
+}
diff --git a/skins/standard/attachment.css b/skins/standard/attachment.css
index cec2d49e1..008bc7031 100644
--- a/skins/standard/attachment.css
+++ b/skins/standard/attachment.css
@@ -133,10 +133,6 @@ table.attachment_info td {
display: block;
}
-#smallCommentFrame, #attachment_flags {
- float: left;
-}
-
#smallCommentFrame {
margin-right: 1.5em;
}
diff --git a/skins/standard/global.css b/skins/standard/global.css
index e7028f892..81a420077 100644
--- a/skins/standard/global.css
+++ b/skins/standard/global.css
@@ -1110,6 +1110,67 @@ select, select[multiple] {
font-size: 12px;
}
+.buttons.toggle[role="radiogroup"] {
+ display: inline-flex;
+}
+
+.buttons.toggle[role="radiogroup"] .item {
+ display: flex;
+}
+
+.buttons.toggle[role="radiogroup"] input[type="radio"] {
+ position: absolute;
+ left: -99999px;
+}
+
+.buttons.toggle[role="radiogroup"] label {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ position: relative;
+ z-index: 1;
+ border: 1px solid #B2B2B2;
+ padding: 4px 12px;
+ min-width: 1em;
+ min-height: 1em;
+ background-color: #FFF;
+ box-shadow: inset 1px 1px 2px rgba(0, 0, 0, .1);
+ -moz-user-select: none;
+ -webkit-user-select: none;
+ user-select: none;
+}
+
+.buttons.toggle[role="radiogroup"] .item:first-child label {
+ border-radius: 4px 0 0 4px;
+}
+
+.buttons.toggle[role="radiogroup"] .item:last-child label {
+ border-radius: 0 4px 4px 0;
+}
+
+.buttons.toggle[role="radiogroup"] .item:not(:first-child) label {
+ margin-left: -1px;
+ border-left-color: #D2D2D2;
+}
+
+.buttons.toggle[role="radiogroup"] .item:not(:last-child) label {
+ border-right-color: #D2D2D2;
+}
+
+.buttons.toggle[role="radiogroup"] input[type="radio"]:checked + label {
+ z-index: 2;
+ border-color: #B2B2B2;
+ color: #111;
+ background-color: #DDD;
+ box-shadow: inset 1px 1px 2px rgba(0, 0, 0, .2);
+}
+
+.buttons.toggle[role="radiogroup"] input[type="radio"]:focus + label {
+ z-index: 2;
+ border-color: #42A4E0;
+ box-shadow: inset 1px 1px 2px rgba(0, 0, 0, .2), 0 0 0 2px rgba(73, 173, 227, .4);
+}
+
hr {
border: none;
height: 1px;
diff --git a/template/en/default/flag/list.html.tmpl b/template/en/default/flag/list.html.tmpl
index 6e411add9..bf1c8a6b3 100644
--- a/template/en/default/flag/list.html.tmpl
+++ b/template/en/default/flag/list.html.tmpl
@@ -131,6 +131,7 @@
title="[% type.description FILTER html %]"
onchange="toggleRequesteeField(this);"
class="flag_select flag_type-[% type.id %]"
+ data-id="[% type.id %]" data-name="[% type.name FILTER html FILTER no_break %]"
[% IF !can_edit_flag %] disabled="disabled"[% END %]>
[%# Only display statuses the user is allowed to set. %]
[% IF !flag