Fixed small display inconsistencies in the shell component with the new sidebar feature.

 fixes #556

Author: lovasoa

CHANGELOG.md

@@ -6,6 +6,7 @@
 - Updated SQL parser to [v0.50.0](https://github.com/sqlparser-rs/sqlparser-rs/blob/main/CHANGELOG.md#0500-2024-08-15)
  - Support postgres String Constants with Unicode Escapes . Fixes https://github.com/lovasoa/SQLpage/discussions/511
 - New [big_number](https://sql.datapage.app/documentation.sql?component=big_number#component) component to display key statistics and indicators in a large, easy-to-read format. Useful for displaying KPIs, metrics, and other important numbers in dashboards and reports.
+- Fixed small display inconsistencies in the shell component with the new sidebar feature.
 
 ## 0.27.0 (2024-08-17)
 

sqlpage/templates/shell.handlebars

@@ -154,7 +154,7 @@
                 <button class="navbar-toggler collapsed" type="button" data-bs-target="#sidebar-menu" aria-controls="sidebar-menu" data-bs-toggle="collapse" aria-expanded="false" aria-label="Toggle navigation">
                     <span class="navbar-toggler-icon"></span>
                 </button>
-                <h1 class="navbar-brand navbar-brand-autodark d-inline">
+                <h1 class="navbar-brand navbar-brand-autodark d-inline ps-2">
                     <a style="text-decoration: none" href="{{#if link}}{{link}}{{else}}/{{/if}}">
                         {{#if image}}
                             <img src="{{image}}" alt="{{title}}" height="32" class="navbar-brand-image">
@@ -201,16 +201,17 @@
             <main class="page-body container-xl pt-3 px-md-5 px-sm-3 {{#if fixed_top_menu}}mt-5{{#unless (eq layout 'boxed')}}pt-5{{/unless}}{{/if}}" id="sqlpage_main_wrapper">
                 {{~#each_row~}}{{~/each_row~}}
             </main>
+
+            <footer class="w-100 text-center fs-6 my-2 text-secondary" id="sqlpage_footer">
+                {{#if footer}}
+                    {{{markdown footer}}}
+            {{else}}
+                <!-- You can change this footer using the 'footer' parameter of the 'shell' component -->
+                Built with <a class="text-reset" href="https://sql.datapage.app"
+                    title="SQLPage v{{buildinfo 'CARGO_PKG_VERSION'}}">SQLPage</a>
+            {{/if}}
+            </footer>
         </div>
-        <footer class="w-100 text-center fs-6 my-2 text-secondary" id="sqlpage_footer">
-        {{#if footer}}
-            {{{markdown footer}}}
-        {{else}}
-            <!-- You can change this footer using the 'footer' parameter of the 'shell' component -->
-            Built with <a class="text-reset" href="https://sql.datapage.app"
-                title="SQLPage v{{buildinfo 'CARGO_PKG_VERSION'}}">SQLPage</a>
-        {{/if}}
-        </footer>
     </div>
 </body>
 </html>