[TWIG][CSS] Found solution to show details content by default in desktop view. However, post_form is being rendered multiple times, it was already rendered in the Posting Component. Needs to be fixed.

public/assets/css/base.css

@@ -208,3 +208,15 @@ details[open] > div {
         transform: none;
     }
 }
+
+/* SIDE PANELS OPEN BY DEFAULT ON DESKTOP */
+@media (min-width: 900px) {
+    .panel-mobile {
+        display: none;
+    }
+}
+@media (max-width: 900px) {
+    .panel-desktop {
+        display: none;
+    }
+}

templates/base.html.twig

@@ -40,15 +40,34 @@
     {% endblock header %}
 
     <div class="container">
-        {% block leftpanel %}
-        {% endblock leftpanel %}
+        <details class="panel" id="left-container">
+            <summary>
+                {{ icon('menu', 'icon icon-left') | raw }}
+                <div class="panel-desktop">
+                    {{ block("leftpanel", "stdgrid.html.twig") }}
+                </div>
+            </summary>
+            <div class="panel-mobile">
+                {{ block("leftpanel", "stdgrid.html.twig") }}
+            </div>
+        </details>
+
 
         {% block nav %}{% endblock %}
         {% block body %}{% endblock %}
         {% block javascripts %}{% endblock javascripts %}
 
-        {% block rightpanel %}
-        {% endblock rightpanel %}
+        <details class="panel" id="right-container">
+            <summary>
+                {{ icon('drop', 'icon icon-right') | raw }}
+                <div class="panel-desktop">
+                    {{ block("rightpanel", "stdgrid.html.twig") }}
+                </div>
+            </summary>
+            <div class="panel-mobile">
+                {{ block("rightpanel", "stdgrid.html.twig") }}
+            </div>
+        </details>
     </div>
 
 </body>

templates/sidepanel/left/left.html.twig

@@ -1,7 +1,4 @@
-<details class="panel" id="left-container">
-
-    <summary>{{ icon('menu', 'icon icon-left') | raw }}</summary>
-    {% if app.user %}
+{% if app.user %}
     <div id='left-panel'>
         <div class='navbar'>
             <div class="left-nav">
@@ -50,7 +47,7 @@
             </div>
         </div>
     </div>
-    {% else %}
+{% else %}
     <div id='left-panel'>
         <div class='navbar'>
             <div class="left-nav">
@@ -66,6 +63,4 @@
             </div>
         </div>
     </div>
-    {% endif %}
-</details>
-
+{% endif %}

templates/sidepanel/right/right.html.twig

@@ -1,8 +1,9 @@
-<details class="panel" id="right-container">
-    <summary>{{ icon('drop', 'icon icon-right') | raw }}</summary>
-    <div id='right-panel'>
+<div id='right-panel'>
+
     {% if post_form is defined %}
-            {{ form_start(post_form) }}
+        {{ post_form }}
+
+        {#{{ form_start(post_form) }}
         <div class="create-notice">
             <div class="target">
                 <div class="target-top">
@@ -41,7 +42,7 @@
                 </div>
             </div>
         </div>
-            {{ form_end(post_form) }}
+        {{ form_end(post_form) }}#}
     {% endif %}
 
     {% set current_path = app.request.get('_route') %}
@@ -54,5 +55,4 @@
             {{ block | raw }}
         {% endfor %}
     {% endif %}
-    </div>
-</details>
+</div>