From fd914051aa6cdb24e7e4bc1c4723def6e64428dc Mon Sep 17 00:00:00 2001 From: Ethan Dalool <git@voussoir.net> Date: Fri, 3 Mar 2017 22:30:57 -0800 Subject: [PATCH] Add word-wrap:break-word to various elements --- static/common.css | 5 +++-- static/common.js | 2 +- templates/photo.html | 8 ++++++-- templates/search.html | 1 + 4 files changed, 11 insertions(+), 5 deletions(-) diff --git a/static/common.css b/static/common.css index aa64a9b..890dbc4 100644 --- a/static/common.css +++ b/static/common.css @@ -52,7 +52,7 @@ li .remove_tag_button, .remove_tag_button_perm { - position: absolute; + /*position: absolute;*/ top: 3px; width: 18px; height: 14px; @@ -202,10 +202,11 @@ li align-items: center; flex: 2; } -.message_positive, .message_negative +.message_bubble { width: 80%; margin: 4px; + word-wrap: break-word; } .message_positive { diff --git a/static/common.js b/static/common.js index 4018fe1..15eb815 100644 --- a/static/common.js +++ b/static/common.js @@ -5,7 +5,7 @@ function create_message_bubble(message_area, message_positivity, message_text, l lifespan = 8000; } var message = document.createElement("div"); - message.className = message_positivity; + message.className = "message_bubble " + message_positivity; var span = document.createElement("span"); span.innerHTML = message_text; message.appendChild(span); diff --git a/templates/photo.html b/templates/photo.html index 90bef36..33dc76b 100644 --- a/templates/photo.html +++ b/templates/photo.html @@ -62,6 +62,7 @@ #editor_area { flex: 3; + word-wrap: break-word; } #message_area { @@ -126,8 +127,11 @@ {% set tags = photo.sorted_tags() %} {% for tag in tags %} <li> - <a class="tag_object" href="/search?tag_musts={{tag.name}}">{{tag.qualified_name()}}</a> - <button class="remove_tag_button" onclick="remove_photo_tag('{{photo.id}}', '{{tag.name}}', receive_callback);"></button> + <a class="tag_object" href="/search?tag_musts={{tag.name}}">{{tag.qualified_name()}}</a><!-- + --><button + class="remove_tag_button" + onclick="remove_photo_tag('{{photo.id}}', '{{tag.name}}', receive_callback);"> + </button> </li> {% endfor %} <li> diff --git a/templates/search.html b/templates/search.html index a16f3f7..beedcec 100644 --- a/templates/search.html +++ b/templates/search.html @@ -43,6 +43,7 @@ form min-width: 300px; padding: 8px; flex: 1; + word-wrap: break-word; } #right {