revert Enketo buttons from <Button>s back to plain HTML

Enketo requires there to be `<a>` elements with specific IDs for the "next" and "save" buttons.
We had nested `<Button>`s inside these to make them match the `<Button>`s we use elsewhere in the UI.
But in some webviews, the touch events would not bubble up from the `<Button>` to the `<a>` elements, causing the buttons to be unclickable except around the margins.

Reverting this back to just use plain `<a>` elements to resolve the bug.
Maybe revisit `<Button>` later because it was nicer looking.

www/js/survey/enketo/EnketoModal.tsx

@@ -108,17 +108,20 @@ const EnketoModal = ({ surveyName, onResponseSaved, opts, ...rest }: Props) => {
           </a>
           <a
             id="validate-form"
-            className="btn"
+            className="btn btn-primary"
             onClick={() => validateAndSave()}
             style={{ width: 200, margin: 'auto' }}>
-            <Button id="validate-form" icon="check-bold" mode="contained">
-              {t('survey.save')}
-            </Button>
+            {/* <Button icon="check-bold" mode="contained"> */}
+            {t('survey.save')}
+            {/* </Button> */}
           </a>
-          <a href="#" className="btn next-page disabled" style={{ width: 200, margin: 'auto' }}>
-            <Button icon="arrow-right-thick" mode="contained">
-              {t('survey.next')}
-            </Button>
+          <a
+            href="#"
+            className="btn btn-primary next-page disabled"
+            style={{ width: 200, margin: 'auto' }}>
+            {/* <Button icon="arrow-right-thick" mode="contained"> */}
+            {t('survey.next')}
+            {/* </Button> */}
           </a>
           <div className="enketo-power" style={{ marginBottom: 30 }}>
             <span>{t('survey.powered-by')}</span>{' '}