extend logic to use andIf() to set css classes.

Co-authored-by: Adrian Santana Berg <[email protected]>

src/widget/widget.ts

@@ -5,6 +5,7 @@ import type { SearchTime } from '@atb/modules/search-time/types';
 import Combobox from '@github/combobox-nav';
 
 import style from './widget.module.css';
+import { andIf } from '../utils/css';
 
 const DEFAULT_DEBOUNCE_TIME = 300;
 
@@ -723,11 +724,13 @@ function createOutput(
 
   const output = html`
     <div
-      class="${style.wrapper} ${style.lightWrapper} ${outputOverrideOptions.inheritFont
-        ? style.inheritFont
-        : ''} ${outputOverrideOptions.singleColumnLayout
-        ? style.singleColumnLayout
-        : ''}"
+      class="${andIf({
+        [style.wrapper]: true,
+        [style.lightWrapper]: true,
+        [style.inheritFont]: outputOverrideOptions.inheritFont ?? false,
+        [style.singleColumnLayout]:
+          outputOverrideOptions.singleColumnLayout ?? false,
+      })}"
     >
       <nav class="${style.nav}">
         <ul class="${style.tabs} js-tablist">