team-alpha/railsgoat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix navbar alignment and font size toggle functionality

Browse Source 
Fixed two UI issues in the navigation header:

1. **Navbar Alignment**: Added CSS to remove margin/padding from forms in the
   header to ensure the Tutorials button (created with button_to) aligns
   properly with other navbar items like font size controls and user dropdown.

2. **Font Size Toggle**: Added data-turbolinks="false" to font size control
   links to force full page reload. Previously, clicking the small font button
   wouldn't apply changes until manual refresh due to Turbolinks caching. Now
   both font size buttons work immediately.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Ken Johnson
2025-12-09 17:08:41 +00:00
parent aefbe201d3
commit 2cc86dd271
2 changed files with 9 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/views/layouts/application.html.erb
+7
View File
@@ -110,6 +110,13 @@
margin-right: 0;
}
/* Fix alignment of button_to forms in header */
.rg-header form {
margin: 0;
padding: 0;
display: inline-block;
}
/* Modern Sidebar */
.rg-sidebar {
position: fixed;
app/views/layouts/shared/_header.html.erb
+2 -2
View File
@@ -15,10 +15,10 @@
<div class="d-flex align-items-center gap-3">
<!-- Font Size Controls -->
<div class="btn-group btn-group-sm" role="group" aria-label="Font size controls">
<a href="/dashboard/home?font=8pt" class="btn btn-outline-secondary" style="font-size: 10pt;" title="Small font" aria-label="Small font">
<a href="/dashboard/home?font=8pt" class="btn btn-outline-secondary" style="font-size: 10pt;" title="Small font" aria-label="Small font" data-turbolinks="false">
<i class="bi bi-type"></i>
</a>
<a href="/dashboard/home?font=200%25" class="btn btn-outline-secondary" style="font-size: 14pt;" title="Large font" aria-label="Large font">
<a href="/dashboard/home?font=200%25" class="btn btn-outline-secondary" style="font-size: 14pt;" title="Large font" aria-label="Large font" data-turbolinks="false">
<i class="bi bi-type"></i>
</a>
</div>