Fix Vulnerability details text overflow #1279

Reference: #1279 Signed-off-by: John M. Horan <johnmhoran@gmail.com>
aboutcode-org · Aug 28, 2023 · b6e38d5 · b6e38d5
1 parent 2cb0e29
commit b6e38d5
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 10 deletions.
diff --git a/vulnerabilities/templates/vulnerability_details.html b/vulnerabilities/templates/vulnerability_details.html
@@ -78,7 +78,7 @@
                                 </tr>
                                 <tr>
                                     <td class="two-col-left">Summary</td>
-                                    <td class="two-col-right">{{ vulnerability.summary }}
+                                    <td class="two-col-right wrap-strings">{{ vulnerability.summary }}
                                     </td>
                                 </tr>
                             </tbody>
@@ -92,7 +92,7 @@
                         <table class="table is-bordered is-striped is-narrow is-hoverable is-fullwidth gray-header-border">
                             <tr>
                                 <th style="width: 160px;"> System </th>
-                                <th> Score </th>
+                                <th style="width: 100px;"> Score </th>
                                 <th> Found at </th>
                             </tr>
                             {% for severity in severities %}

diff --git a/vulnerablecode/static/css/custom.css b/vulnerablecode/static/css/custom.css
@@ -185,16 +185,14 @@ code {
     border-color: #dbdbdb;
 }
 
-.table td {
+/* 2023-08-28 Monday 14:55:42.  Is this still needed or does wrap-strings take its place?  Keep eyes peeled for any odd <td> displays. */
+/* .table td {
     word-wrap: break-word;
-    /* 8/24/2022 Wednesday 4:56:57 PM.  We need this for just 1 table as I recall, displaying some sort of data with few/no word breaks
-    but this messes up the look of columns that need a word-break wrap
-    TODO: identify and create separate CSS class for that table */
-    /* word-break: break-all; */
-}
+} */
+
 
 .wrap-strings {
-    word-break: break-all;
+    word-break: break-word;
 }
 
 .two-col-left {
@@ -368,4 +366,4 @@ a.small_page_button {
 
 span.tag.custom {
     margin: 0px 0px 6px 10px;
-}
+}