break long titles

app/views/submissions/show.html.erb

@@ -2,7 +2,7 @@
   <div class="flex justify-between py-1.5 items-center pr-4 sticky top-0 md:relative z-10 bg-base-100">
     <a href="<%= signed_in? && @submission.account_id == current_account&.id ? template_path(@submission.template) : '/' %>" class="flex items-center space-x-3 py-1">
       <span><%= render 'submissions/logo' %></span>
-      <span class="text-xl md:text-3xl font-semibold focus:text-clip" style="overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;"><%= @submission.template.name %></span>
+      <span class="text-xl md:text-3xl font-semibold focus:text-clip" style="overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;"><% @submission.template.name.split(/(_)/).each do |item| %><%= item %><wbr><% end %></span>
     </a>
     <div class="space-x-3 flex items-center">
       <% if @submission.audit_trail.present? %>

app/views/templates/_title.html.erb

@@ -2,7 +2,7 @@
   <div class="relative flex items-start justify-between w-full space-x-0">
     <div>
       <h1 class="text-4xl font-semibold" style="overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;">
-        <%= template.name %>
+        <% template.name.split(/(_)/).each do |item| %><%= item %><wbr><% end %>
         <% if template.archived_at? %>
           <span class="badge badge-outline badge-lg align-middle">Archived</span>
         <% end %>