Merge branch 'develop' into eriese-lint-all

sites/dev/components/navigation/primary.js

@@ -74,38 +74,37 @@ const SubLevel = ({ nodes = {}, active }) => (
               items-center
             `}
             >
-              <Link href={`${child.__slug}`}>
-                <a
-                  title={child.__title}
+              <Link
+                href={`${child.__slug}`}
+                title={child.__title}
+                className={`
+                grow pl-2 border-l-2
+                ${linkClasses}
+                hover:cursor-pointer
+                hover:border-secondary
+                sm:hover:border-secondary
+                ${
+                  child.__slug === active
+                    ? 'text-secondary border-secondary sm:text-secondary sm:border-secondary'
+                    : 'text-base-content sm:text-base-content'
+                }
+              `}
+              >
+                <span
                   className={`
-                  grow pl-2 border-l-2
-                  ${linkClasses}
-                  hover:cursor-pointer
-                  hover:border-secondary
-                  sm:hover:border-secondary
+                  text-3xl mr-2 inline-block p-0 leading-3
                   ${
                     child.__slug === active
-                      ? 'text-secondary border-secondary sm:text-secondary sm:border-secondary'
-                      : 'text-base-content sm:text-base-content'
+                      ? 'text-secondary sm:text-secondary translate-y-1'
+                      : 'translate-y-3'
                   }
                 `}
                 >
-                  <span
-                    className={`
-                    text-3xl mr-2 inline-block p-0 leading-3
-                    ${
-                      child.__slug === active
-                        ? 'text-secondary sm:text-secondary translate-y-1'
-                        : 'translate-y-3'
-                    }
-                  `}
-                  >
-                    {child.__slug === active ? <>&bull;</> : <>&deg;</>}
-                  </span>
-                  <span className={child.__slug === active ? 'font-bold' : ''}>
-                    {child.__linktitle || child.__title}
-                  </span>
-                </a>
+                  {child.__slug === active ? <>&bull;</> : <>&deg;</>}
+                </span>
+                <span className={child.__slug === active ? 'font-bold' : ''}>
+                  {child.__linktitle || child.__title}
+                </span>
               </Link>
               <Chevron w={6} m={3} />
             </summary>
@@ -114,37 +113,37 @@ const SubLevel = ({ nodes = {}, active }) => (
         </li>
       ) : (
         <li className="pl-2 flex flex-row items-center" key={child.__slug}>
-          <Link href={`${child.__slug}`} title={child.__title}>
-            <a
+          <Link
+            href={`${child.__slug}`}
+            title={child.__title}
+            className={`
+            pl-2 border-l-2
+            grow
+            ${linkClasses}
+            hover:cursor-pointer
+            hover:border-secondary
+            sm:hover:border-secondary
+            ${
+              child.__slug === active
+                ? 'text-secondary border-secondary sm:text-secondary sm:border-secondary'
+                : 'text-base-content sm:text-base-content'
+            }`}
+          >
+            <span
               className={`
-              pl-2 border-l-2
-              grow
-              ${linkClasses}
-              hover:cursor-pointer
-              hover:border-secondary
-              sm:hover:border-secondary
+              text-3xl mr-2 inline-block p-0 leading-3
               ${
                 child.__slug === active
-                  ? 'text-secondary border-secondary sm:text-secondary sm:border-secondary'
-                  : 'text-base-content sm:text-base-content'
-              }`}
+                  ? 'text-secondary sm:text-secondary translate-y-1'
+                  : 'translate-y-3'
+              }
+            `}
             >
-              <span
-                className={`
-                text-3xl mr-2 inline-block p-0 leading-3
-                ${
-                  child.__slug === active
-                    ? 'text-secondary sm:text-secondary translate-y-1'
-                    : 'translate-y-3'
-                }
-              `}
-              >
-                {child.__slug === active ? <>&bull;</> : <>&deg;</>}
-              </span>
-              <span className={child.__slug === active ? 'font-bold' : ''}>
-                {child.__linktitle || child.__title}
-              </span>
-            </a>
+              {child.__slug === active ? <>&bull;</> : <>&deg;</>}
+            </span>
+            <span className={child.__slug === active ? 'font-bold' : ''}>
+              {child.__linktitle || child.__title}
+            </span>
           </Link>
         </li>
       )
@@ -152,56 +151,6 @@ const SubLevel = ({ nodes = {}, active }) => (
   </ul>
 )
 
-// Component that renders a toplevel of navigation
-/*
-const TopLevel = ({ icon, title, nav, current, slug, hasChildren=false, active }) => (
-  <details className='py-1' open={0}>
-    <summary className={`
-      flex flex-row uppercase gap-4 font-bold text-lg
-      hover:cursor-row-resize
-      p-2
-      text-base-content
-      sm:text-base-content
-      items-center
-    `}>
-      <span className="text-secondary">{icon}</span>
-      <Link href={`${slug}`}>
-        <a className={`
-          grow ${linkClasses} hover:cursor-pointer
-          ${slug === active
-            ? 'text-secondary sm:text-secondary'
-            : ''
-          }`}
-        >
-          {title}
-        </a>
-      </Link>
-    {hasChildren && <Chevron />}
-    </summary>
-    {hasChildren && <SubLevel nodes={current} active={active} />}
-  </details>
-)
-
-const Navigation = ({ app, active, className='' }) => {
-  if (!app.navigation) return null
-  const output = []
-  for (const page of order(app.navigation)) output.push(<TopLevel
-    key={page.__slug}
-    icon={icons[page.__slug]
-      ? icons[page.__slug]('w-6 h-6')
-      : <span className="text-3xl mr-2 translate-y-3 inline-block p-0 leading-3">&deg;</span>
-    }
-    title={page.__title}
-    slug={page.__slug}
-    hasChildren={1}
-    nav={app.navigation}
-    current={order(app.navigation[page.__slug])}
-    active={active}
-  />)
-
-  return <div className={`pb-20 ${className}`}>{output}</div>
-}
-*/
 export const Icons = ({
   app,
   ulClasses = '',
@@ -215,11 +164,9 @@ export const Icons = ({
   for (const page of order(app.navigation)) {
     output.push(
       <li key={page.__slug}>
-        <Link href={`${page.__slug}`}>
-          <a className={linkClasses} title={page.__title} style={linkStyle}>
-            {icons[page.__slug] ? icons[page.__slug]('w-14 h-14') : <HelpIcon />}
-            <span className="font-bold">{page.__title}</span>
-          </a>
+        <Link href={`${page.__slug}`} className={linkClasses} title={page.__title} style={linkStyle}>
+          {icons[page.__slug] ? icons[page.__slug]('w-14 h-14') : <HelpIcon />}
+          <span className="font-bold">{page.__title}</span>
         </Link>
       </li>
     )
@@ -227,16 +174,7 @@ export const Icons = ({
 
   return <ul className={ulClasses}>{output}</ul>
 }
-/*
-const PrimaryMenu = ({ app, active, before=[], after=[] }) => (
-  <nav className="mb-12">
-    {before}
-    <Icons app={app} ulClasses="hidden md:block lg:hidden flex flex-col items-center"/>
-    <Navigation app={app} active={active} className="md:hidden lg:block"/>
-    {after}
-  </nav>
-)
-*/
+
 export const MainSections = ({ app, active }) => {
   if (!app.navigation) return null
   const output = []
@@ -268,17 +206,16 @@ export const MainSections = ({ app, active }) => {
             {txt}
           </span>
         ) : (
-          <Link href={`${page.__slug}`}>
-            <a
-              className={`${linkClasses}
-                flex flex-row gap-4 items-center
-                hover:bg-secondary hover:bg-opacity-10
-                p-2 rounded
-              `}
-              title={page.__title}
-            >
-              {txt}
-            </a>
+          <Link
+            href={`${page.__slug}`}
+            className={`${linkClasses}
+              flex flex-row gap-4 items-center
+              hover:bg-secondary hover:bg-opacity-10
+              p-2 rounded
+            `}
+            title={page.__title}
+          >
+            {txt}
           </Link>
         )}
       </li>