Truncate feature flag name in delete modal header

app/views/projects/feature_flags/_delete_feature_flag_modal.html.haml

-- feature_flag_name = capture do
-  %span.text-monospace= feature_flag.name
 .modal{ id: "delete-feature-flag-modal-#{feature_flag.id}",
   tabindex: -1,
   role: 'dialog' }
   .modal-dialog{ role: 'document' }
     .modal-content
       .modal-header
-        %h5.modal-title
-          = s_('FeatureFlags|Delete %{feature_flag_name}?').html_safe % { feature_flag_name: feature_flag_name }
+        %h5.modal-title.d-flex.mw-100
+          - truncated_feature_flag_name = capture do
+            %span.text-truncate.prepend-left-4.append-right-4= feature_flag.name
+          = s_('FeatureFlags|Delete %{feature_flag_name}?').html_safe % { feature_flag_name: truncated_feature_flag_name }
         %button.close{ type: 'button', data: { dismiss: 'modal' }, aria: { label: _('Close') } }
           %span{ "aria-hidden": true } ×
       .modal-body
         %p
-          = s_('FeatureFlags|Feature flag %{feature_flag_name} will be removed. Are you sure?').html_safe % { feature_flag_name: feature_flag_name }
+          - monospace_feature_flag_name = capture do
+            %span.text-monospace= feature_flag.name
+          = s_('FeatureFlags|Feature flag %{feature_flag_name} will be removed. Are you sure?').html_safe % { feature_flag_name: monospace_feature_flag_name }
       .modal-footer
         %button{ type: 'button', data: { dismiss: 'modal' }, class: 'btn btn-default' } Cancel