change to description list; change h3 to h2

src/foodItems.tsx

@@ -8,7 +8,7 @@ export const FoodItemsContainer = (props: {
 }): JSX.Element => {
   return (
     <div>
-      <h3>{props.title}</h3>
+      <h2>{props.title}</h2>
       {props.extra && <p>{props.extra}</p>}
       <div class="list-group" role="list">
         {props.children}
@@ -64,8 +64,8 @@ export class AdvancedFoodItem extends Component<FoodItemProps & { extra: string
     return (
       <HideIfFoodExcluded {...this.props}>
         <div class="list-group-item" role="listitem">
-          <p class="mb-1 h5">{this.props.title}</p>
+          <dt class="mb-1 h5">{this.props.title}</dt>
-          <p class="mb-1">{this.props.extra}</p>
+          <dd class="mb-1">{this.props.extra}</dd>
         </div>
       </HideIfFoodExcluded>
     )

src/foodTypeToggles.tsx

@@ -103,7 +103,7 @@ export class FoodTypeToggles extends Component<{
   render(): JSX.Element {
     return (
       <div>
-        <h3>Toggles</h3>
+        <h2>Toggles</h2>
         <div>
           <p>Broad Toggles</p>
           <ToggleableBox

src/mainPage.tsx

@@ -35,7 +35,7 @@ export class SettingsBlock extends Component {
 
   render() {
     return <div>
-      <h3>Settings</h3>
+      <h2>Settings</h2>
       <div class="form-group">
         <label for="fontSettingSelect">Font</label>
         <select ref={this.fontSettingSelectRef} class="form-control" id="fontSettingSelect" onChange={() => this.onFontChange()}>