Add word break to annoucement modal

common/static/css/boofilsic.css

@@ -1160,6 +1160,10 @@ select::placeholder {
   margin-left: 10px;
 }
 
+.announcement-modal .announcement-modal__body .announcement__content {
+  word-break: break-all;
+}
+
 @media (max-width: 575.98px) {
   .mark-modal, .confirm-modal, .announcement-modal {
     width: 100%;

common/static/sass/_Modal.sass

@@ -113,6 +113,7 @@
                 margin-left: 10px 
 
             &__content
+                word-break: break-all
 
 
 // Small devices (landscape phones, 576px and up)

common/templates/common/home.html

@@ -359,7 +359,7 @@
                                 <h5 class="announcement__title">{{ ann.title }}</h5>
                             </a>
                             <span class="announcement__datetime">{{ ann.created_time }}</span>
-                            <p>{{ ann.get_plain_content | truncate:200 }}</p>
+                            <p class="announcement__content">{{ ann.get_plain_content | truncate:200 }}</p>
                         </li>
                         {% if not forloop.last %}
                             <div class="dividing-line" style="border-top-style: dashed;"></div>