Break word with CSS and not with a specific method of interfaces

machines/models.py

@@ -1626,9 +1626,6 @@ class Interface(RevMixin, AclMixin, FieldPermissionModelMixin, models.Model):
             )
         return True, None, None
 
-    def splited_name(self):
-        return str(self).replace('.',' .')
-
     def __init__(self, *args, **kwargs):
         super(Interface, self).__init__(*args, **kwargs)
         self.field_permissions = {"machine": self.can_change_machine}

templates/base.html

@@ -305,8 +305,7 @@ with this program; if not, write to the Free Software Foundation, Inc.,
                         </div>
                         <ul class="list-group">
                         {% for interface in interfaces|slice:":5" %}
-                            <div class="list-group-item visible-xs visible-lg">{{ interface }}</div>
-                            <div class="list-group-item visible-sm visible-md">{{ interface.splited_name}}</div>
+                        <div class="list-group-item" style="word-break: break-all">{{ interface }}</div>
                         {% endfor %}
                         {% if interfaces|length > 5 %}
                             <a class="list-group-item list-group-item-info" role="button" href="{% url 'users:mon-profil' %}">