From e1faa26c7eb119144f82b67de383108b70f2d5d3 Mon Sep 17 00:00:00 2001
From: AndyMac4321 <76612952+AndyMac4321@users.noreply.github.com>
Date: Tue, 25 Mar 2025 03:07:23 -0700
Subject: [PATCH] Bug Fix Mobile View - New Instrument section messing up view

Mobile View
Removed heading for instruments
Created veritical divs for instrument radio buttons for better layout
---
 src/PipeScore/UI/view.ts | 50 +++++++++++++++++++++-------------------
 1 file changed, 26 insertions(+), 24 deletions(-)

diff --git a/src/PipeScore/UI/view.ts b/src/PipeScore/UI/view.ts
index 597f7a8a..ae37a7a6 100644
--- a/src/PipeScore/UI/view.ts
+++ b/src/PipeScore/UI/view.ts
@@ -1420,34 +1420,36 @@ function mobileView(state: UIState): m.Children {
             ]),
             state.dispatch
           ),
-          m('section', [
-            m('h2', text('instrument')),
-
+        ]),
+        m('div.section-content', [
+          m('div.section-content.vertical', [
             m(
-              'label',
-              m('input', {
-                type: 'radio',
-                name: 'instrument',
-                disabled: state.isPlaying,
-                checked: settings.instrument === Instrument.GHB,
-                onchange: () => state.dispatch(updateInstrument(Instrument.GHB)),
-                value: '',
-              }),
-              text('instrumentPipes')
+            'label',
+            m('input', {
+              type: 'radio',
+              name: 'instrument',
+              disabled: state.isPlaying,
+              checked: settings.instrument === Instrument.GHB,
+              onchange: () => state.dispatch(updateInstrument(Instrument.GHB)),
+              value: '',
+            }),
+            text('instrumentPipes')
             ),
+          ]),
+          m('div.section-content.vertical', [
             m(
-              'label',
-              m('input', {
-                type: 'radio',
-                name: 'instrument',
-                disabled: state.isPlaying,
-                checked: settings.instrument === Instrument.Chanter,
-                onchange: () => state.dispatch(updateInstrument(Instrument.Chanter)),
-                value: 'pc',
-              }),
-              text('instrumentPC')
+            'label',
+            m('input', {
+              type: 'radio',
+              name: 'instrument',
+              disabled: state.isPlaying,
+              checked: settings.instrument === Instrument.Chanter,
+              onchange: () => state.dispatch(updateInstrument(Instrument.Chanter)),
+              value: 'pc',
+            }),
+            text('instrumentPC')
             ),
-          ]),
+          ])
         ]),
         m('div.section-content', [
           help(