fix(components): fix colSpan, hook usage, special theme reset, unused imports, CSS color

src/components/board-blotter/board-blotter.tsx

@@ -38,7 +38,7 @@ const BoardBlotter = () => {
         )}
         <tfoot>
           <tr>
-            <td colSpan={2}>
+            <td>
               [
               <span className={styles.hideButton} onClick={() => toggleVisibility()}>
                 {isHidden ? t('show_blotter') : t('hide')}

src/components/boardsbar/boardsbar.tsx

@@ -335,7 +335,7 @@ const BoardsBarMobile = ({ subplebbitAddress }: { subplebbitAddress?: string })
         {boardSelect}
       </div>
       <div className={styles.pageJump}>
-        <Link to={useLocation().pathname.replace(/\/$/, '') + '/settings'}>{t('settings')}</Link>
+        <Link to={location.pathname.replace(/\/$/, '') + '/settings'}>{t('settings')}</Link>
         <span onClick={() => setShowSearchBar(!showSearchBar)}>{capitalize(t('search'))}</span>
         <Link to='/'>{t('home')}</Link>
         {showSearchBar && <SearchBar setShowSearchBar={setShowSearchBar} />}

src/components/style-selector/style-selector.tsx

@@ -1,3 +1,4 @@
+import { useEffect } from 'react';
 import useTheme from '../../hooks/use-theme';
 import useSpecialThemeStore from '../../stores/use-special-theme-store';
 import { isChristmas } from '../../lib/utils/time-utils';
@@ -8,6 +9,13 @@ const StyleSelector = () => {
   const { isEnabled, setIsEnabled } = useSpecialThemeStore();
   const isChristmasTime = isChristmas();
 
+  useEffect(() => {
+    if (!isChristmasTime && isEnabled) {
+      setIsEnabled(false);
+      setTheme('tomorrow');
+    }
+  }, [isChristmasTime, isEnabled, setIsEnabled, setTheme]);
+
   const handleThemeChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
     const newTheme = e.target.value;
 

src/components/thread-footer-first-row/thread-footer-first-row.tsx

@@ -1,8 +1,6 @@
 import { useTranslation } from 'react-i18next';
 import { useLocation, useParams } from 'react-router-dom';
 import { isAllView, isSubscriptionsView, isModView } from '../../lib/utils/view-utils';
-import { useDirectories } from '../../hooks/use-directories';
-import { getBoardPath } from '../../lib/utils/route-utils';
 import useReplyModalStore from '../../stores/use-reply-modal-store';
 import { ReturnButton, CatalogButton, TopButton, UpdateButton, AutoButton, PostPageStats } from '../board-buttons/board-buttons';
 import styles from './thread-footer-first-row.module.css';
@@ -19,7 +17,6 @@ const ThreadFooterFirstRow = ({ postCid, threadNumber, subplebbitAddress, isThre
   const { t } = useTranslation();
   const location = useLocation();
   const params = useParams();
-  const directories = useDirectories();
   const { openReplyModalEmpty } = useReplyModalStore();
 
   const isInAllView = isAllView(location.pathname);

src/themes.css

@@ -656,7 +656,7 @@
 
   /* boardsbar */
   --boardsbar-font-size: 11pt;
-  --boardsbar-separator-color: none;
+  --boardsbar-separator-color: transparent;
   --boardsbar-desktop-link-text-color: #00e;
   --boardsbar-desktop-link-text-color-hover: red;
   --boardsbar-desktop-link-text-decoration: underline;
@@ -868,7 +868,7 @@
 
   /* boardsbar */
   --boardsbar-font-size: 11pt;
-  --boardsbar-separator-color: none;
+  --boardsbar-separator-color: transparent;
   --boardsbar-desktop-link-text-color: #34345c;
   --boardsbar-desktop-link-text-color-hover: #d00;
   --boardsbar-desktop-link-text-decoration: underline;