Merge branch 'main' into simple-record-page

VEuPathDB · Nov 1, 2023 · 2d0837e · 2d0837e
2 parents d15eacd + 51ef00a
commit 2d0837e
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 3 deletions.
diff --git a/packages/libs/wdk-client/src/Core/Style/wdk-Common.scss b/packages/libs/wdk-client/src/Core/Style/wdk-Common.scss
@@ -96,6 +96,28 @@ td {
   vertical-align: baseline;
 }
 
+// =begin <dl>
+// Definition list styling
+
+dl {
+  display: grid;
+  grid-template-columns: max-content auto;
+  row-gap: 0.3em;
+  column-gap: 1em;
+}
+
+dt {
+  grid-column-start: 1;
+  justify-self: end;
+  font-weight: bold;
+}
+
+dd {
+  grid-column-start: 2;
+  margin: 0;
+}
+// =end <dl>
+
 img[data-assets-src] {
   visibility: hidden;
 }

diff --git a/packages/libs/wdk-client/src/Views/Question/DefaultQuestionForm.tsx b/packages/libs/wdk-client/src/Views/Question/DefaultQuestionForm.tsx
@@ -30,6 +30,8 @@ import StepValidationInfo from '../../Views/Question/StepValidationInfo';
 import { Tabs } from '../../Components';
 
 import '../../Views/Question/DefaultQuestionForm.scss';
+import Banner from '@veupathdb/coreui/lib/components/banners/Banner';
+import { type } from 'os';
 
 type TextboxChangeHandler = (
   event: React.ChangeEvent<HTMLInputElement>
@@ -408,9 +410,12 @@ export function ParameterList(props: ParameterListProps) {
               }
             />
             {parameter.visibleHelp !== undefined && (
-              <div className={cx('VisibleHelp')}>
-                {safeHtml(parameter.visibleHelp)}
-              </div>
+              <Banner
+                banner={{
+                  type: 'info',
+                  message: safeHtml(parameter.visibleHelp, null, 'div'),
+                }}
+              />
             )}
             <div className={cx('ParameterControl')}>
               {parameterElements[parameter.name]}