IBX-1498: Disabled drag and drop, fields in content type translate (#277

)

src/bundle/Resources/public/scss/_content-type-edit.scss

@@ -87,10 +87,6 @@
                         .ibexa-btn {
                             padding: calculateRem(10px);
                         }
-
-                        &:hover {
-                            cursor: grab;
-                        }
                     }
 
                     &__header-label {
@@ -106,10 +102,6 @@
                         margin-left: auto;
                     }
 
-                    &__toggle-btn:not(.ibexa-collapse__toggle-btn--status) {
-                        cursor: grab;
-                    }
-
                     &__draggable-btn {
                         cursor: grab;
 
@@ -118,6 +110,22 @@
                         }
                     }
                 }
+
+                &.ibexa-collapse {
+                    &[draggable='true'] {
+                        .ibexa-collapse {
+                            &__header {
+                                &:hover {
+                                    cursor: grab;
+                                }
+                            }
+
+                            &__toggle-btn:not(.ibexa-collapse__toggle-btn--status) {
+                                cursor: grab;
+                            }
+                        }
+                    }
+                }
             }
         }
 

src/bundle/Resources/public/scss/_dropdown.scss

@@ -133,7 +133,7 @@
         }
     }
 
-    &--single &__selected-item:not(&__selected-placeholder) {
+    &--single:not(&--disabled) &__selected-item:not(&__selected-placeholder) {
         color: $ibexa-color-dark;
     }
 

src/bundle/Resources/public/scss/mixins/_drag-and-drop.scss

@@ -105,7 +105,10 @@
     border: calculateRem(1px) solid $ibexa-color-light;
     border-radius: $ibexa-border-radius;
     box-shadow: calculateRem(4px) calculateRem(22px) calculateRem(20px) calculateRem(-7px) rgba($ibexa-color-info, 0.05);
-    cursor: grab;
+
+    &[draggable='true'] {
+        cursor: grab;
+    }
 
     &:last-of-type {
         margin-bottom: calculateRem(24px);

src/bundle/Resources/views/themes/admin/content_type/available_field_types.html.twig

@@ -13,7 +13,7 @@
     <ul class="ibexa-available-field-types__list">    
         {% for item in field_type_toolbar %}
             <li 
-                draggable="true" 
+                draggable="{{ is_draggable is not defined or is_draggable == true ? 'true' : 'false' }}"
                 class="ibexa-available-field-type" 
                 data-item-identifier="{{ item.identifier }}"
             >

src/bundle/Resources/views/themes/admin/content_type/edit.html.twig

@@ -20,6 +20,7 @@
 {% block form %}
     {{ form_start(form, { attr: { class: 'ibexa-content-type-edit ibexa-form' } }) }}
         {% set is_translation = form.vars.data.languageCode != content_type.mainLanguageCode %}
+        {% set is_draggable = is_translation == false %}
 
         {% if is_translation %}
             {% include '@ibexadesign/content_type/part/nontranslatable_fields_disabled.html.twig' %}
@@ -60,11 +61,14 @@
                     {% endblock %}
 
                     {% block left_column %}
-                        {{ include('@ibexadesign/content_type/field_definitions.html.twig', { grouped_field_defintions: form.fieldDefinitionsData }) }}
+                        {{ include('@ibexadesign/content_type/field_definitions.html.twig', {
+                            grouped_field_defintions: form.fieldDefinitionsData,
+                            is_draggable
+                        }) }}
                     {% endblock %}
 
                     {% block right_column %}
-                        {{ include('@ibexadesign/content_type/available_field_types.html.twig') }}
+                        {{ include('@ibexadesign/content_type/available_field_types.html.twig', { is_draggable }) }}
                     {% endblock %}
                 {% endembed %}
             {% endblock %}

src/bundle/Resources/views/themes/admin/content_type/field_definition.html.twig

@@ -3,7 +3,7 @@
 
 {%- embed "@ibexadesign/ui/component/collapse.html.twig" with {
     'is_expanded': false,
-    'is_draggable': true,
+    'is_draggable': is_draggable ?? true,
     'class': 'ibexa-collapse--field-definition',
     'body_id': field_definition.vars.id ~ '_collapse',
     'header_label': '%s (%s)'|format(name, field_definition.vars.value.fieldTypeIdentifier),

src/bundle/Resources/views/themes/admin/content_type/field_definitions.html.twig

@@ -35,7 +35,7 @@
                             {%- include "@ibexadesign/content_type/field_definitions_empty_group.html.twig" -%}
 
                             {% for field_definition in field_defintions %}
-                                {%- include "@ibexadesign/content_type/field_definition.html.twig" -%}
+                                {{ include('@ibexadesign/content_type/field_definition.html.twig', { is_draggable: is_draggable ?? true}) }}
                             {% endfor %}
 
                             {% set field_definitions_placeholder_class = [

src/bundle/Resources/views/themes/admin/content_type/part/nontranslatable_fields_disabled.html.twig

@@ -3,5 +3,5 @@
 {% include '@ibexadesign/ui/component/alert/alert.html.twig' with {
     type: 'warning',
     title: 'content_type.view.edit.notranslatable_fields_disabled'|trans|desc('Some of the Fields are disabled when translating a Content Type. To modify them, edit the Content Type in the main language.'),
-    class: 'mt-3 mx-5',
+    class: 'mt-3',
 } only %}