[IMP] formio: Workaround Safari with unusable Columns in a Data Grid.

Workaround for Safari 16.6 (AFAIK), with Columns in a Data Grid. The Columns become too narrow and unusable in a Data Grid. GitHub issue: formio/formio.js#5426 This workaround adds 1 CSS rule, which adds a `width: 100%` to the first `<td/>` (column) targeted in a Data Grid table. width: 100%; }
novacode-nl · Dec 8, 2023 · 447e7f7 · 447e7f7
1 parent e68c758
commit 447e7f7
Show file tree

Hide file tree

Showing 10 changed files with 136 additions and 23 deletions.
diff --git a/formio/CHANGELOG.md b/formio/CHANGELOG.md
@@ -1,10 +1,25 @@
 # Changelog
 
+## 15.0.6.14
+
+Workaround for Safari 16.6 (AFAIK), with Columns in a Data Grid.\
+The Columns become too narrow and unusable in a Data Grid.
+GitHub issue: https://github.com/formio/formio.js/issues/5426
+
+This workaround adds 1 CSS rule, which adds a `width: 100%` to the
+first `<td/>` (column) targeted in a Data Grid table.
+
+```css
+#formio_form_app table.datagrid-table tbody tr td:first-child {
+    width: 100%;
+}
+```
+
 ## 15.0.6.13
 
 Hide field `builder_id_domain` in `formio.form` form view.
 
-- Sidebar pabel disappears for long forms. This reverts some (resizing) changes from 16.0.7.0.
+- Sidebar pabel disappears for long forms. This reverts some (resizing) changes from 15.0.7.0.
 - Show the "Auto-save" setting in the dock before State.
 
 ## 15.0.6.12
@@ -33,13 +48,13 @@ Add `formio.form` (Form) `after_save_draft` method and execute it in the `/submi
 
 Fix:
 Still one Form loading regression (bug) in template `formio_form_public_embed`.\
-Due to incomplete implementation of the new (loading) spinner implementation in v16.0.6.6.
+Due to incomplete implementation of the new (loading) spinner implementation in v15.0.6.6.
 
 ## 15.0.6.7
 
 Fix:
 Form loading on portal and public/website.\
-Due to incomplete implementation of the new (loading) spinner implementation in v16.0.6.6.
+Due to incomplete implementation of the new (loading) spinner implementation in v15.0.6.6.
 
 Improvement:
 Put the form builder (loading) spinner in dedicated `<div/>` which hides when the form builder has been rendered.

diff --git a/formio/__manifest__.py b/formio/__manifest__.py
@@ -4,7 +4,7 @@
 {
     'name': 'Forms',
     'summary': 'Form Builder for backend, portal and website forms - to collect any information you need for your business.',
-    'version': '15.0.16.13',
+    'version': '15.0.16.14',
     'license': 'LGPL-3',
     'author': 'Nova Code',
     'website': 'https://www.novacode.nl',

diff --git a/formio/data/formio_asset_data.xml b/formio/data/formio_asset_data.xml
@@ -20,6 +20,22 @@ See LICENSE file for full licensing details. -->
             <field name="url">/formio/static/lib/bootstrap/4.1.3/bootstrap.min.css</field>
         </record>
 
+        <record id="css_bootstrap_4_4_1" model="ir.attachment">
+            <field name="name">bootstrap 4.4.1 bootstrap.min.css</field>
+            <field name="type">url</field>
+            <field name="res_model">formio.version.asset</field>
+            <field name="public" eval="True"/>
+            <field name="url">/formio/static/lib/bootstrap/4.4.1/bootstrap.min.css</field>
+        </record>
+
+        <record id="css_bootstrap_4_6_2" model="ir.attachment">
+            <field name="name">bootstrap 4.6.2 bootstrap.min.css</field>
+            <field name="type">url</field>
+            <field name="res_model">formio.version.asset</field>
+            <field name="public" eval="True"/>
+            <field name="url">/formio/static/lib/bootstrap/4.6.2/bootstrap.min.css</field>
+        </record>
+
         <record id="css_bootstrap_5" model="ir.attachment">
             <field name="name">bootstrap 5 bootstrap.min.css</field>
             <field name="type">url</field>

diff --git a/formio/data/formio_default_asset_css_data.xml b/formio/data/formio_default_asset_css_data.xml
@@ -12,6 +12,14 @@ See LICENSE file for full licensing details. -->
             <field name="url">/formio/static/lib/bootstrap/4.1.3/bootstrap.min.css</field>
         </record>
 
+        <record id="default_attachment_css_bootstrap_4_4_1" model="ir.attachment">
+            <field name="name">bootstrap 4.4.1 (bootstrap.min.css)</field>
+            <field name="type">url</field>
+            <field name="res_model">formio.default.asset.css</field>
+            <field name="public" eval="True"/>
+            <field name="url">/formio/static/lib/bootstrap/4.4.1/bootstrap.min.css</field>
+        </record>
+
         <record id="default_attachment_css_bootstrap_5_2_3" model="ir.attachment">
             <field name="name">bootstrap 5.2.3 (bootstrap.min.css)</field>
             <field name="type">url</field>

diff --git a/formio/data/formio_default_version_data.xml b/formio/data/formio_default_version_data.xml
@@ -1,24 +1,30 @@
 <?xml version="1.0" encoding="utf-8"?>
-<odoo noupdate="1">
-    <record id="config_param_formio_builder_js_options_default" model="ir.config_parameter">
-        <field name="key">formio.default_builder_js_options_id</field>
-        <field name="value" eval="ref('formio.formio_builder_js_options_default')"/>
-    </record>
+<odoo>
+    <!-- no update -->
+    <data noupdate="1">
+        <record id="config_param_formio_builder_js_options_default" model="ir.config_parameter">
+            <field name="key">formio.default_builder_js_options_id</field>
+            <field name="value" eval="ref('formio.formio_builder_js_options_default')"/>
+        </record>
 
-    <record id="config_param_formio_default_version" model="ir.config_parameter">
-        <field name="key">formio.default_version</field>
-        <field name="value">4.16.0</field>
-    </record>
+        <!-- administrator decides, so don't overwrite -->
+        <record id="config_param_formio_default_version" model="ir.config_parameter">
+            <field name="key">formio.default_version</field>
+            <field name="value">4.17.3</field>
+        </record>
+    </data>
 
-    <!-- formio.js v4.x.x -->
-    <record id="default_asset_css_bootstrap_4_1_3" model="formio.default.asset.css">
-        <field name="attachment_id" ref="formio.default_attachment_css_bootstrap_4_1_3"/>
-        <field name="active">True</field>
-    </record>
+    <!-- update -->
+    <data>
+        <record id="default_asset_css_bootstrap" model="formio.default.asset.css">
+            <field name="attachment_id" ref="formio.default_attachment_css_bootstrap_4_4_1"/>
+            <field name="active">True</field>
+        </record>
 
-    <!-- formio.js v5.x.x -->
-    <!-- <record id="default_asset_css_bootstrap_5_2_3" model="formio.default.asset.css"> -->
-    <!--     <field name="attachment_id" ref="formio.default_attachment_css_bootstrap_5_2_3"/> -->
-    <!--     <field name="active">False</field> -->
-    <!-- </record> -->
+        <!-- formio.js v5.x.x -->
+        <!-- <record id="default_asset_css_bootstrap" model="formio.default.asset.css"> -->
+        <!--     <field name="attachment_id" ref="formio.default_attachment_css_bootstrap_5_2_3"/> -->
+        <!--     <field name="active">False</field> -->
+        <!-- </record> -->
+    </data>
 </odoo>
diff --git a/formio/migrations/15.0.16.14/post-migration.py b/formio/migrations/15.0.16.14/post-migration.py
@@ -0,0 +1,10 @@
+# Copyright Nova Code (http://www.novacode.nl)
+# See LICENSE file for full licensing details.
+
+from odoo import api, SUPERUSER_ID
+
+
+def migrate(cr, version):
+    env = api.Environment(cr, SUPERUSER_ID, {})
+    # new/updated to: default_asset_css_bootstrap_4_4_1
+    env.ref('formio.default_asset_css_bootstrap_4_1_3').unlink()
diff --git a/formio/static/lib/bootstrap/4.4.1/bootstrap.min.css b/formio/static/lib/bootstrap/4.4.1/bootstrap.min.css
diff --git a/formio/static/lib/bootstrap/4.6.2/bootstrap.min.css b/formio/static/lib/bootstrap/4.6.2/bootstrap.min.css
diff --git a/formio/static/src/css/formio_builder_embed.css b/formio/static/src/css/formio_builder_embed.css
@@ -39,3 +39,34 @@ body {
     background-color: #d3d3d3;
     border: 1px solid #c0c0c0;
 }
+
+.formio_builder_actions {
+    text-align: left;
+    padding: 0px 10px;
+}
+
+/* actions buttons */
+
+#formio_builder_actions_bottom {
+    margin-top: 1rem;
+}
+
+.formio_builder_actions a {
+    margin: 0 0 1rem 0;
+}
+
+.formio_builder_actions a i {
+    padding-right: 0.2rem;
+}
+
+.formio_builder_actions div.formio_text {
+    margin: 0 0 1rem 0;
+}
+
+/**
+  Hack:
+  Prevent the comopnent-editor-dialog scale too much
+**/
+/* .component-edit-tabs.col-sm-6 { */
+/*     min-height: auto; */
+/* } */
diff --git a/formio/static/src/css/formio_form_embed.css b/formio/static/src/css/formio_form_embed.css
@@ -58,3 +58,16 @@ h3.formio_form_title {
     background-color: #d3d3d3;
     border: 1px solid #c0c0c0;
 }
+
+/**
+  WORKAROUND
+  ----------
+  - Browser: Safari 16.6
+  - This fixes a Data Grid with Columns inside. The columns become too
+    narrow in Safari!
+  - GitHub issue: https://github.com/formio/formio.js/issues/5426
+**/
+
+#formio_form_app table.datagrid-table tbody tr td:first-child {
+    width: 100%;
+}