Wrap long titles in bookmark details modal (#1150)

bookmarks/styles/bookmark-details.css

@@ -1,5 +1,13 @@
 /* Common styles */
 .bookmark-details {
+  .title {
+    word-break: break-word;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 5;
+    overflow: hidden;
+  }
+
   & .weblinks {
     display: flex;
     flex-direction: column;

bookmarks/templates/bookmarks/details/modal.html

@@ -3,7 +3,7 @@
   <div class="modal-overlay"></div>
   <div class="modal-container" role="dialog" aria-modal="true">
     <div class="modal-header">
-      <h2>{{ details.bookmark.resolved_title }}</h2>
+      <h2 class="title">{{ details.bookmark.resolved_title }}</h2>
       <button class="close" aria-label="Close dialog">
         <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke-width="2"
              stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">