fix mobile view

.env

@@ -19,7 +19,7 @@ APP_ENV=dev
 APP_SECRET=EDIT_ME
 ###< symfony/framework-bundle ###
 
-APP_VERSION=1.5.4
+APP_VERSION=1.5.5
 
 APP_NAME=KevaChat
 

public/css/default.css

@@ -32,6 +32,13 @@ a:hover
     text-decoration: underline;
 }
 
+hr {
+    background-color: var(--color-default);
+    border: none;
+    color: var(--color-default);
+    height: 1px;
+}
+
 body
 {
     font-size: 12px;
@@ -41,11 +48,12 @@ body
 header
 {
     background-color: Canvas;
-    border-bottom: 1px var(--color-default) solid;
     display: block;
     left: 0;
     margin: 0 auto;
     max-width: calc(var(--container-max-width) + 2px);
+    padding-left: 4px;
+    padding-right: 4px;
     padding-top: 16px;
     position: fixed;
     right: 0;
@@ -164,6 +172,7 @@ footer
 footer > form
 {
     bottom: 16px;
+    box-sizing: border-box;
     display: block;
     margin: 16px auto;
     max-width: var(--container-max-width);

templates/default/module/rooms.html.twig

@@ -20,16 +20,17 @@
 {% endif %}
 {% if list %}
     •
-    <h2>
+{% endif %}
+<h2>
     {% if form.namespace.value %}
         <a href="{{ path('room_list') }}">{{ 'more...' | trans }}</a>
     {% else %}
         {{ 'more...' | trans }}
     {% endif %}
-    </h2>
+</h2>
-    <sup>
+<sup>
     <a href="{{ path('room_list', { feed : 'rss' }) }}" title="{{ 'RSS' | trans }}" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" fill="currentColor" viewBox="0 0 16 16">
         <path d="M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zm1.5 2.5c5.523 0 10 4.477 10 10a1 1 0 1 1-2 0 8 8 0 0 0-8-8 1 1 0 0 1 0-2m0 4a6 6 0 0 1 6 6 1 1 0 1 1-2 0 4 4 0 0 0-4-4 1 1 0 0 1 0-2m.5 7a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3"/>
     </svg></a>
-    </sup>
+</sup>
-{% endif %}
+<hr />