wcs: add labels before layout/size values (#55860)

This commit is contained in:
Frédéric Péters 2021-07-27 14:31:31 +02:00
parent 18e4d09053
commit f285d5cf80
3 changed files with 5 additions and 8 deletions

View File

@ -9,7 +9,8 @@
{# UI to customize content layout #}
<div class="wcs-cards-cell--grid">
<div class="wcs-cards-cell--grid-options">
<span class="wcs-cards-cell--grid-layout-label">{% trans "Automatic" %}</span>
<span class="wcs-cards-cell--grid-layout-label">{% trans "Grid Layout:" %}</span>
<span class="wcs-cards-cell--grid-layout-mode">{% trans "Automatic" %}</span>
<a role="button" class="wcs-cards-cell--grid-layout-btn">
{% trans "Edit" %}
</a>

View File

@ -656,17 +656,14 @@ form .choices {
font-weight: bold;
}
.wcs-cards-cell--grid-layout-label,
.wcs-cards-cell--grid-cell-content .cell-size-label {
color: #666;
}
.wcs-cards-cell--grid-layout-label::before,
.wcs-cards-cell--grid-cell-content .cell-size-label::before {
content: " [ ";
}
.wcs-cards-cell--grid-layout-label::after,
.wcs-cards-cell--grid-cell-content .cell-size-label::after {
content: " ]";
}

View File

@ -405,7 +405,6 @@ const Card_cell_custom = function(cell) {
this.cell = cell;
this.gridSchema_default = {
"grid_class": "fx-grid--auto",
"grid_layout_label": gettext('Automatic'),
"cells": []
}
this.init();
@ -457,7 +456,7 @@ Card_cell_custom.prototype = {
$(this.cell).trigger("custom_cell:change");
},
grid__set_layout: function() {
this.grid_layout_label.textContent = this.gridSchema.grid_layout_label;
this.grid_layout_label.textContent = $(this.grid_form).find('select[name="grid-layout"] option[value="' + this.gridSchema.grid_class + '"]').text();
if (this.grid_wrapper.dataset.grid_layout) {
this.grid_wrapper.classList.remove(this.grid_wrapper.dataset.grid_layout); }
this.grid_wrapper.classList.add(this.gridSchema.grid_class);
@ -537,7 +536,7 @@ Card_cell_custom.prototype = {
let cell_display_mode_label = $(this.grid_cell_form).find('select[name="display_mode"] option[value="' + schema_cell.display_mode + '"]').text();
cell_text += '<span class="cell-display-mode-label">' + cell_display_mode_label + '</span>';
let cell_size_label = $(this.grid_cell_form).find('select[name="cell_size"] option[value="' + schema_cell.cell_size + '"]').text();
cell_text += '<span class="cell-size-label">' + cell_size_label + '</span>';
cell_text += '<span class="cell-size-label">' + gettext('Size:') + ' ' + cell_size_label + '</span>';
cell_text += '</span>';
grid_cell.contentEl.innerHTML = cell_text;
},
@ -663,7 +662,7 @@ Card_cell_custom.prototype = {
this.is_on = false;
this.grid = cell.querySelector('.wcs-cards-cell--grid');
this.edit_grid_btn = cell.querySelector('.wcs-cards-cell--grid-layout-btn');
this.grid_layout_label = cell.querySelector('.wcs-cards-cell--grid-layout-label');
this.grid_layout_label = cell.querySelector('.wcs-cards-cell--grid-layout-mode');
const grid_form_tpl_string = cell.querySelector('.wcs-cards-cell--grid-form-tpl').innerText;
this.grid_form = this.parse_string_tpl(grid_form_tpl_string);