Merge pull request #1483 from colouring-cities/boolean-entry-fixes

Boolean entry fixes
colouring-cities · Feb 4, 2025 · cb213bc · cb213bc
2 parents 036cffa + f0c10f3
commit cb213bc
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 9 deletions.
diff --git a/app/src/frontend/building/data-components/logical-data-entry/logical-data-entry.css b/app/src/frontend/building/data-components/logical-data-entry/logical-data-entry.css
@@ -0,0 +1,8 @@
+/* Hide the browser's default radio button */
+.boolean input {
+    position: absolute;
+    opacity: 0;
+    cursor: pointer;
+    height: 0;
+    width: 0;
+  }
diff --git a/app/src/frontend/building/data-components/logical-data-entry/logical-data-entry.tsx b/app/src/frontend/building/data-components/logical-data-entry/logical-data-entry.tsx
@@ -1,5 +1,7 @@
 import React from 'react';
 
+import './logical-data-entry.css';
+
 import { BaseDataEntryProps } from '../data-entry';
 import { DataTitleCopyable } from '../data-title';
 
@@ -33,12 +35,14 @@ const ToggleButton: React.FC<ToggleButtonProps> = ({
                 style: { cursor: 'default'}
             }}
         >
-            <input type="radio" name="options" value={value + ''}
-                autoComplete="off"
-                checked={checked}
-                onChange={onChange}
-                disabled={disabled}
-            />
+            <div className="boolean">
+                <input type="radio" name="options" value={value + ''}
+                    autoComplete="off"
+                    checked={checked}
+                    onChange={onChange}
+                    disabled={disabled}
+                />
+            </div>
             {children}
         </label>
     );

diff --git a/app/src/frontend/building/data-containers/construction-design.tsx b/app/src/frontend/building/data-containers/construction-design.tsx
@@ -11,7 +11,7 @@ import withCopyEdit from '../data-container';
 
 import { CategoryViewProps } from './category-view-props';
 import { MultiDataEntry } from '../data-components/multi-data-entry/multi-data-entry';
-import { LogicalDataEntry, LogicalDataEntryYesOnly } from '../data-components/logical-data-entry/logical-data-entry';
+import { LogicalDataEntry } from '../data-components/logical-data-entry/logical-data-entry';
 
 /**
 * Construction & Design view/edit section
@@ -1237,7 +1237,7 @@ const ConstructionDesignView: React.FunctionComponent<CategoryViewProps> = (prop
                     </DataEntryGroup>
                 </DataEntryGroup>
                 <DataEntryGroup name="Awards" collapsed={subcat==null || subcat!="12"}>
-                    <LogicalDataEntryYesOnly
+                    <LogicalDataEntry
                             slug='designer_awards'
                             title={dataFields.designer_awards.title}
                             tooltip={dataFields.designer_awards.tooltip}

diff --git a/app/src/frontend/building/data-containers/energy-performance.tsx b/app/src/frontend/building/data-containers/energy-performance.tsx
@@ -3,7 +3,7 @@ import { commonSourceTypes, dataFields } from '../../config/data-fields-config';
 import SelectDataEntry from '../data-components/select-data-entry';
 import NumericDataEntry from '../data-components/numeric-data-entry';
 import Verification from '../data-components/verification';
-import { LogicalDataEntry, LogicalDataEntryYesOnly } from '../data-components/logical-data-entry/logical-data-entry';
+import { LogicalDataEntry } from '../data-components/logical-data-entry/logical-data-entry';
 import { DataEntryGroup } from '../data-components/data-entry-group';
 import { MultiDataEntry } from '../data-components/multi-data-entry/multi-data-entry';
 import withCopyEdit from '../data-container';