From d5d68cecfb9a6647267e70b9ac7a733a6f4eca1e Mon Sep 17 00:00:00 2001 From: Romain Courteaud <romain@nexedi.com> Date: Tue, 18 Oct 2016 14:04:51 +0000 Subject: [PATCH] [erp5_web_renderjs_ui] Reimplement DateTimeField --- .../rjs_gadget_erp5_datetimefield_html.html | 4 +- .../rjs_gadget_erp5_datetimefield_html.xml | 8 +- .../rjs_gadget_erp5_datetimefield_js.js | 520 ++++++++++-------- .../rjs_gadget_erp5_datetimefield_js.xml | 4 +- .../rjs_gadget_erp5_nojqm_css.css | 12 + .../rjs_gadget_erp5_nojqm_css.xml | 4 +- .../erp5_web_renderjs_ui/erp5css.less.txt | 13 + 7 files changed, 318 insertions(+), 247 deletions(-) diff --git a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_html.html b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_html.html index ba33bd1417..b95cb5b2e1 100644 --- a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_html.html +++ b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_html.html @@ -3,7 +3,7 @@ <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, user-scalable=no" /> - <title>ERP5 Floatfield</title> + <title>ERP5 Datetimefield</title> <!-- renderjs --> <script src="rsvp.js" type="text/javascript"></script> @@ -13,6 +13,6 @@ </head> <body> - <input type="date" /> + <div class="datetimefield"></div> </body> </html> \ No newline at end of file diff --git a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_html.xml b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_html.xml index 943cf7babd..9d24506e3c 100644 --- a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_html.xml +++ b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_html.xml @@ -220,7 +220,7 @@ </item> <item> <key> <string>actor</string> </key> - <value> <string>romain</string> </value> + <value> <string>zope</string> </value> </item> <item> <key> <string>comment</string> </key> @@ -234,7 +234,7 @@ </item> <item> <key> <string>serial</string> </key> - <value> <string>940.50766.7916.31675</string> </value> + <value> <string>954.44229.8719.22835</string> </value> </item> <item> <key> <string>state</string> </key> @@ -252,8 +252,8 @@ </tuple> <state> <tuple> - <float>1423235572.23</float> - <string>GMT</string> + <float>1476776016.7</float> + <string>UTC</string> </tuple> </state> </object> diff --git a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_js.js b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_js.js index 3ac39746ea..fe63f12057 100644 --- a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_js.js +++ b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_js.js @@ -1,22 +1,69 @@ -/*global window, rJS, RSVP, document, loopEventListener */ -/*jslint indent: 2 */ -(function (window, rJS, RSVP, document, loopEventListener) { +/*global window, rJS, RSVP*/ +/*jslint indent: 2, maxlen: 80 */ +(function (window, rJS, RSVP) { "use strict"; + + var ZONE_LIST = [ + ["GMT-12", "-1200"], + ["GMT-11", "-1100"], + ["GMT-10", "-1000"], + ["GMT-9", "-0900"], + ["GMT-8", "-0800"], + ["GMT-7", "-0700"], + ["GMT-6", "-0600"], + ["GMT-5", "-0500"], + ["GMT-4", "-0400"], + ["GMT-3", "-0300"], + ["GMT-2", "-0200"], + ["GMT-1", "-0100"], + ["GMT", "+0000"], + ["GMT+1", "+0100"], + ["GMT+2", "+0200"], + ["GMT+3", "+0300"], + ["GMT+4", "+0400"], + ["GMT+5", "+0500"], + ["GMT+6", "+0600"], + ["GMT+7", "+0700"], + ["GMT+8", "+0800"], + ["GMT+9", "+0900"], + ["GMT+10", "+1000"], + ["GMT+11", "+1100"], + ["GMT+12", "+1200"] + ]; + rJS(window) - .ready(function (gadget) { - return gadget.getElement() - .push(function (element) { - gadget.element = element; - gadget.props = {}; - }); - }) - .declareAcquiredMethod("notifyInvalid", "notifyInvalid") - .declareAcquiredMethod("notifyValid", "notifyValid") - .declareMethod('getTextContent', function () { - return this.element.querySelector('input').getAttribute('value') || ""; - }) + .declareMethod('render', function (options) { - var input = this.element.querySelector('input'), + var field_json = options.field_json || {}, + state_dict = { + value: field_json.value || field_json.default || "", + editable: field_json.editable, + required: field_json.required, + name: field_json.key, + key: field_json.key, + title: field_json.title, + timezone_style: field_json.timezone_style, + date_only: field_json.date_only, + hide_day: field_json.hide_day, + allow_empty_time: field_json.allow_empty_time, + ampm_time_style: field_json.ampm_time_style, + subfield_ampm_key: field_json.subfield_ampm_key, + subfield_hour_key: field_json.subfield_hour_key, + subfield_minute_key: field_json.subfield_minute_key, + hidden_day_is_last_day: field_json.hidden_day_is_last_day, + subfield_year_key: field_json.subfield_year_key, + subfield_month_key: field_json.subfield_month_key, + subfield_day_key: field_json.subfield_day_key, + subfield_timezone_key: field_json.subfield_timezone_key, + start_datetime: field_json.start_datetime, + end_datetime: field_json.end_datetime + }; + return this.changeState(state_dict); + }) + + .onStateChange(function (modification_dict) { + var element = this.element.querySelector('.datetimefield'), + gadget = this, date, tmp, timezone, @@ -25,41 +72,85 @@ tmp_date, tmp_hour, tmp_minute, - select, + leap_year, time = "", - leapyear, - i, - field_json = options.field_json || {}, - lastDateOfMonth = [[31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31], - [31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]],//leapyear - select_options = ["GMT-12", "GMT-11", "GMT-10", "GMT-9", "GMT-8", "GMT-7", "GMT-6", - "GMT-5", "GMT-4", "GMT-3", "GMT-2", "GMT-1", "GMT", "GMT+1", - "GMT+2", "GMT+3", "GMT+4", "GMT+5", "GMT+6", "GMT+7", "GMT+8", - "GMT+9", "GMT+10", "GMT+11", "GMT+12"], - select_option, - value = field_json.value || field_json.default || ""; - this.props.field_json = field_json; + last_month_date = [ + [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31], + [31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31] + ],//leapyear + queue = new RSVP.Queue(), + promise_list, + input_state = { + name: gadget.state.key + '_input', + editable: gadget.state.editable, + required: gadget.state.required, + type: gadget.state.date_only ? "date" : "datetime-local" + }, + select_state = { + name: gadget.state.key + '_select', + value: "+0000", + item_list: ZONE_LIST, + editable: gadget.state.editable, + required: gadget.state.required + // name: field_json.key, + // title: field_json.title + }, + p_state = { + tag: "p" + }; - - if (field_json.timezone_style) { - //change date to local - select = document.createElement("select"); - for (i = 0; i < select_options.length; i += 1) { - select_option = document.createElement("option"); - select_option.value = select_options[i]; - select_option.innerHTML = select_options[i]; - select.appendChild(select_option); + // Create or fetch sub gadgets + if (modification_dict.hasOwnProperty('editable') || + modification_dict.hasOwnProperty('timezone_style')) { + if (gadget.state.editable) { + promise_list = [ + gadget.declareGadget('gadget_html5_input.html', {scope: 'INPUT'}) + ]; + if (gadget.state.timezone_style) { + promise_list.push(gadget.declareGadget('gadget_html5_select.html', + {scope: 'SELECT'})); + } + } else { + promise_list = [ + gadget.declareGadget('gadget_html5_element.html', {scope: 'P'}) + ]; } - select.setAttribute("class", "gmt_select"); - select.selectedIndex = 12; - this.element.appendChild(select); - } - if (field_json.date_only === 0) { - input.setAttribute("type", "datetime-local"); + queue + .push(function () { + return RSVP.all(promise_list); + }) + .push(function (result_list) { + // Clear first to DOM, append after to reduce flickering/manip + while (element.firstChild) { + element.removeChild(element.firstChild); + } + var i; + for (i = 0; i < result_list.length; i += 1) { + element.appendChild(result_list[i].element); + } + return result_list; + }); + } else { + if (gadget.state.editable) { + promise_list = [ + gadget.getDeclaredGadget('INPUT') + ]; + if (gadget.state.timezone_style) { + promise_list.push(gadget.getDeclaredGadget('SELECT')); + } + } else { + promise_list = [gadget.getDeclaredGadget('P')]; + } + queue + .push(function () { + return RSVP.all(promise_list); + }); } + + // Calculate sub gadget states //Change type to datetime/datetime local if configured in the field - if (value !== "") { - tmp = new Date(value); + if (gadget.state.value) { + tmp = new Date(gadget.state.value); //get date without timezone tmp_date = tmp.getUTCDate(); tmp_month = tmp.getUTCMonth() + 1; @@ -70,12 +161,13 @@ //timezone required //convert time to GMT - timezone = parseInt(value.slice(-5), 10) / 100; + timezone = parseInt(gadget.state.value.slice(-5), 10) / 100; - if (field_json.timezone_style) { - select.selectedIndex = timezone + 12; + if (gadget.state.timezone_style) { + select_state.value = ZONE_LIST[timezone + 12][1]; } - leapyear = (tmp_year % 4 === 0 && tmp_year % 100 !== 0) ? 1 : 0; + + leap_year = (tmp_year % 4 === 0 && tmp_year % 100 !== 0) ? 1 : 0; if (timezone !== 0) { tmp_hour += timezone; if (tmp_hour < 0) { @@ -87,12 +179,12 @@ tmp_month = 12; tmp_year -= 1; } - tmp_date = lastDateOfMonth[leapyear][tmp_month - 1]; + tmp_date = last_month_date[leap_year][tmp_month - 1]; } } else if (tmp_hour > 23) { tmp_hour -= 24; tmp_date += 1; - if (tmp_date > lastDateOfMonth[leapyear][tmp_month - 1]) { + if (tmp_date > last_month_date[leap_year][tmp_month - 1]) { tmp_date = 1; tmp_month += 1; if (tmp_month > 12) { @@ -102,208 +194,162 @@ } } } - if (field_json.date_only === 0) { - time = "T" + Math.floor(tmp_hour / 10) + tmp_hour % 10 + ":" - + Math.floor(tmp_minute / 10) + (tmp_minute % 10) + ":00"; + + if (!gadget.state.date_only) { + time = "T" + Math.floor(tmp_hour / 10) + tmp_hour % 10 + ":" + + Math.floor(tmp_minute / 10) + (tmp_minute % 10) + ":00"; } - date = tmp_year + "-" + Math.floor(tmp_month / 10) + (tmp_month % 10) + "-" - + Math.floor(tmp_date / 10) + (tmp_date % 10); + date = tmp_year + "-" + Math.floor(tmp_month / 10) + + (tmp_month % 10) + "-" + + Math.floor(tmp_date / 10) + (tmp_date % 10); - input.setAttribute( - 'value', - date + time - ); - } - input.setAttribute('name', field_json.key); - input.setAttribute('title', field_json.title); - if (field_json.required === 1) { - input.setAttribute('required', 'required'); + input_state.value = date + time; } - if (field_json.editable !== 1) { - input.setAttribute('readonly', 'readonly'); - input.setAttribute('data-wrapper-class', 'ui-state-disabled ui-state-readonly'); - input.setAttribute('disabled', 'disabled'); + + // Render + if (gadget.state.editable) { + queue + .push(function (gadget_list) { + promise_list = [ + gadget_list[0].render(input_state) + ]; + if (gadget.state.timezone_style) { + promise_list.push(gadget_list[1].render(select_state)); + } + return RSVP.all(promise_list); + }); + } else { + queue + .push(function (gadget_list) { + p_state.text_content = gadget.state.value; + return gadget_list[0].render(p_state); + }); } + return queue; }) + .declareMethod('getContent', function (options) { - var input = this.element.querySelector('input'), + var gadget = this, result = {}, - select, - year, - month, - field_json = this.props.field_json, - date, - hour, - minute, - timezone, - zone_list = {"GMT-12": "-1200", "GMT-11": "-1100", - "GMT-9": "-0900", "GMT-8": "-0800", - "GMT-7": "-0700", "GMT-6": "-0600", - "GMT-5": "-0500", "GMT-4": "-0400", - "GMT-3": "-0300", "GMT-2": "-0200", - "GMT-1": "-0100", "GMT": "+0000", - "GMT+1": "+0100", "GMT+2": "+0200", - "GMT+3": "+0300", "GMT+4": "+0400", - "GMT+5": "+0500", "GMT+6": "+0600", - "GMT+7": "+0700", "GMT+8": "+0800", - "GMT+9": "+0900", "GMT+10": "+1000", - "GMT+11": "+1100", "GMT+12": "+1200"}, - value = input.value; - if (options === undefined || options.format === "erp5") { - if (value !== "") { - if (field_json.date_only === 0) { - value += "+0000"; - } - value = new Date(value); - year = value.getUTCFullYear(); - month = value.getUTCMonth() + 1; - date = value.getUTCDate(); - if (field_json.hide_day === 1) { - date = 1; - } - //get time - if (field_json.date_only === 0) { - if (field_json.allow_empty_time === 1) { - hour = 0; - minute = 0; - } else { - hour = value.getUTCHours(); - minute = value.getUTCMinutes(); + promise_list; + if (gadget.state.editable) { + promise_list = [gadget.getDeclaredGadget('INPUT')]; + if (gadget.state.timezone_style) { + promise_list.push(gadget.getDeclaredGadget('SELECT')); + } + return new RSVP.Queue() + .push(function () { + return RSVP.all(promise_list); + }) + .push(function (result_list) { + var i; + promise_list = []; + for (i = 0; i < result_list.length; i += 1) { + promise_list.push(result_list[i].getContent()); + } + return RSVP.all(promise_list); + }) + .push(function (result_list) { + var value = result_list[0][gadget.state.key + '_input'], + timezone = "+0000", + year, + month, + date, + hour, + minute, + j; + if (gadget.state.timezone_style) { + timezone = result_list[1][gadget.state.key + '_select']; } - if (field_json.ampm_time_style === 1) { - if (hour > 12) { - result[field_json.subfield_ampm_key] = "pm"; - hour -= 12; + + if (options === undefined || options.format === "erp5") { + if (value !== "") { + if (gadget.state.date_only === 0) { + value += "+0000"; + } + value = new Date(value); + year = value.getUTCFullYear(); + month = value.getUTCMonth() + 1; + date = value.getUTCDate(); + if (gadget.state.hide_day === 1) { + date = 1; + } + //get time + if (gadget.state.date_only === 0) { + if (gadget.state.allow_empty_time === 1) { + hour = 0; + minute = 0; + } else { + hour = value.getUTCHours(); + minute = value.getUTCMinutes(); + } + if (gadget.state.ampm_time_style === 1) { + if (hour > 12) { + result[gadget.state.subfield_ampm_key] = "pm"; + hour -= 12; + } else { + result[gadget.state.subfield_ampm_key] = "am"; + } + } + result[gadget.state.subfield_hour_key] = hour; + result[gadget.state.subfield_minute_key] = minute; + } + + if (gadget.state.hidden_day_is_last_day === 1) { + if (month === 12) { + year += 1; + month = 1; + } else { + month += 1; + } + } + result[gadget.state.subfield_year_key] = year; + result[gadget.state.subfield_month_key] = month; + result[gadget.state.subfield_day_key] = date; + if (gadget.state.timezone_style) { + //set timezone + for (j = 0; j < ZONE_LIST.length; j += 1) { + if (timezone === ZONE_LIST[j][1]) { + result[gadget.state.subfield_timezone_key] = + ZONE_LIST[j][0]; + } + } + } } else { - result[field_json.subfield_ampm_key] = "am"; + //if no value, return empty data + if (gadget.state.date_only === 0) { + result[gadget.state.subfield_hour_key] = ""; + result[gadget.state.subfield_minute_key] = ""; + } + result[gadget.state.subfield_year_key] = ""; + result[gadget.state.subfield_month_key] = ""; + result[gadget.state.subfield_day_key] = ""; } + return result; } - result[field_json.subfield_hour_key] = hour; - result[field_json.subfield_minute_key] = minute; - } - - if (field_json.hidden_day_is_last_day === 1) { - if (month === 12) { - year += 1; - month = 1; - } else { - month += 1; + if (gadget.state.date_only) { + value += "T00:00"; } - } - result[field_json.subfield_year_key] = year; - result[field_json.subfield_month_key] = month; - result[field_json.subfield_day_key] = date; - if (field_json.timezone_style) { - //set timezone - select = this.element.querySelector("select"); - result[field_json.subfield_timezone_key] = select.options[select.selectedIndex].value; - } - } else { - //if no value, return empty data - if (field_json.date_only === 0) { - result[field_json.subfield_hour_key] = ""; - result[field_json.subfield_minute_key] = ""; - } - result[field_json.subfield_year_key] = ""; - result[field_json.subfield_month_key] = ""; - result[field_json.subfield_day_key] = ""; - } - return result; - } - if (field_json.date_only) { - value += "T00:00"; + result[gadget.state.key] = value + timezone; + return result; + }); } - if (field_json.timezone_style) { - //set timezone - select = this.element.querySelector("select"); - timezone = select.options[select.selectedIndex].value; - } else { - timezone = "GMT"; - } - result[field_json.key] = value + zone_list[timezone]; return result; }) - .declareMethod('checkValidity', function () { - var gadget = this, - valide = true, - start_datetime = false, - end_datetime = false, - datetime_string, - select = gadget.element.querySelector("select"), - datetime, - input = gadget.element.querySelector('input'), - field_json = gadget.props.field_json; - if (!input.checkValidity()) { - return false; - } - return new RSVP.Queue() - .push(function () { - return gadget.notifyValid(); - }) - .push(function () { - return gadget.getContent(); - }) - .push(function (result) { - datetime_string = result[field_json.subfield_month_key]; - datetime_string += "," + result[field_json.subfield_day_key]; - datetime_string += "," + result[field_json.subfield_year_key]; - if (field_json.date_only === 0) { - if (result[field_json.subfield_ampm_key] === "pm") { - result[field_json.subfield_hour_key] += 12; - } - datetime_string += " " + result[field_json.subfield_hour_key]; - datetime_string += ":" + result[field_json.subfield_minute_key] + ":00"; - datetime_string += "+0000"; - } - if (datetime_string.indexOf("NaN") !== -1) { - valide = false; - return gadget.notifyInvalid("Invalide DateTime"); - } - if (field_json.start_datetime) { - start_datetime = Date.parse(field_json.start_datetime); - } - if (field_json.end_datetime) { - end_datetime = Date.parse(field_json.end_datetime); - } - if ((start_datetime === false) && (end_datetime === false)) { - return; - } - datetime = Date.parse(datetime_string); - datetime -= (select.selectedIndex - 12) * 60 * 60 * 1000; - if (start_datetime) { - if (start_datetime > datetime) { - valide = false; - return gadget.notifyInvalid("The date and time you entered earlier than the start time"); - } - } - if (end_datetime) { - if (end_datetime <= datetime) { - valide = false; - return gadget.notifyInvalid("The date and time you entered later than the end time"); - } - } - }) - .push(function () { - return valide; - }); + + .declareMethod('getTextContent', function () { + return this.state.value || ""; }) - .declareService(function () { - //////////////////////////////////// - // Inform when the field input is invalid - //////////////////////////////////// - var field_gadget = this; - function notifyInvalid(evt) { - return field_gadget.notifyInvalid(evt.target.validationMessage); + .declareMethod('checkValidity', function () { + var gadget = this; + if (gadget.state.editable) { + return gadget.getDeclaredGadget('INPUT') + .push(function (result) { + return result.checkValidity(); + }); } - - // Listen to input change - return loopEventListener( - field_gadget.element.querySelector('input'), - 'invalid', - false, - notifyInvalid - ); + return true; }); -}(window, rJS, RSVP, document, loopEventListener)); \ No newline at end of file +}(window, rJS, RSVP)); \ No newline at end of file diff --git a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_js.xml b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_js.xml index 3ec5953858..88df139072 100644 --- a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_js.xml +++ b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_datetimefield_js.xml @@ -224,7 +224,7 @@ </item> <item> <key> <string>serial</string> </key> - <value> <string>952.4467.13140.25890</string> </value> + <value> <string>954.44614.5572.28040</string> </value> </item> <item> <key> <string>state</string> </key> @@ -242,7 +242,7 @@ </tuple> <state> <tuple> - <float>1466755364.27</float> + <float>1476799333.29</float> <string>UTC</string> </tuple> </state> diff --git a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_nojqm_css.css b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_nojqm_css.css index 2a1541e6c4..665dfd5778 100644 --- a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_nojqm_css.css +++ b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_nojqm_css.css @@ -1025,6 +1025,18 @@ div[data-gadget-scope='header'] .ui-header ul a { background-color: #2b2b2b; } /********************************************** +* Gadget: datetime field +**********************************************/ +.datetimefield { + display: flex; +} +.datetimefield div[data-gadget-scope=INPUT] { + flex: 2; +} +.datetimefield div[data-gadget-scope=SELECT] { + flex: 1; +} +/********************************************** * Listbox **********************************************/ div[data-gadget-scope='erp5_searchfield'] .ui-input-text { diff --git a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_nojqm_css.xml b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_nojqm_css.xml index 6d820c45a6..5730053993 100644 --- a/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_nojqm_css.xml +++ b/bt5/erp5_web_renderjs_ui/PathTemplateItem/web_page_module/rjs_gadget_erp5_nojqm_css.xml @@ -236,7 +236,7 @@ </item> <item> <key> <string>serial</string> </key> - <value> <string>954.22971.45413.40994</string> </value> + <value> <string>954.44246.45584.9130</string> </value> </item> <item> <key> <string>state</string> </key> @@ -254,7 +254,7 @@ </tuple> <state> <tuple> - <float>1475501272.94</float> + <float>1476777160.07</float> <string>UTC</string> </tuple> </state> diff --git a/bt5/erp5_web_renderjs_ui/SkinTemplateItem/portal_skins/erp5_web_renderjs_ui/erp5css.less.txt b/bt5/erp5_web_renderjs_ui/SkinTemplateItem/portal_skins/erp5_web_renderjs_ui/erp5css.less.txt index 76cf13d717..2472443253 100644 --- a/bt5/erp5_web_renderjs_ui/SkinTemplateItem/portal_skins/erp5_web_renderjs_ui/erp5css.less.txt +++ b/bt5/erp5_web_renderjs_ui/SkinTemplateItem/portal_skins/erp5_web_renderjs_ui/erp5css.less.txt @@ -1197,6 +1197,19 @@ div[data-gadget-scope='header'] .ui-header { } } +/********************************************** +* Gadget: datetime field +**********************************************/ +.datetimefield { + display: flex; + div[data-gadget-scope=INPUT] { + flex: 2; + } + div[data-gadget-scope=SELECT] { + flex: 1; + } +} + /********************************************** * Listbox **********************************************/ -- 2.30.9