Bug-2022758: Remove redundant Dark fonts

src/components/CompareResults/OverTimeResultsView.tsx

@@ -33,7 +33,7 @@ function ResultsView(props: ResultsViewProps) {
     }),
   };
 
-  const sectionStyles = SearchContainerStyles(themeMode, /* isHome */ false);
+  const sectionStyles = SearchContainerStyles(/* isHome */ false);
 
   useEffect(() => {
     document.title = title;

src/components/CompareResults/ResultsView.tsx

@@ -41,7 +41,7 @@ function ResultsView(props: ResultsViewProps) {
     }),
   };
 
-  const sectionStyles = SearchContainerStyles(themeMode, /* isHome */ false);
+  const sectionStyles = SearchContainerStyles(/* isHome */ false);
 
   useEffect(() => {
     document.title = title;

src/components/Search/SearchContainer.tsx

@@ -8,16 +8,14 @@ import CompareWithBase from './CompareWithBase';
 import type { LoaderReturnValue } from './loader';
 import SearchFormHeader from './SearchFormHeader';
 import { STUDENT_T } from '../../common/constants';
-import { useAppSelector } from '../../hooks/app';
 import { Strings } from '../../resources/Strings';
 import { SearchContainerStyles } from '../../styles';
 import type { TimeRange } from '../../types/types';
 
 const strings = Strings.components.searchDefault;
 
 function SearchContainer(props: SearchViewProps) {
-  const themeMode = useAppSelector((state) => state.theme.mode);
-  const styles = SearchContainerStyles(themeMode, /* isHome */ true);
+  const styles = SearchContainerStyles(/* isHome */ true);
   const [isBaseSearchExpanded, setIsBaseSearchExpanded] = useState(true);
   const { newRevInfo, newRepo, frameworkId } =
     useLoaderData<LoaderReturnValue>();

src/components/Shared/PageError.tsx

@@ -24,7 +24,7 @@ export function PageError({ title }: PageErrorProps) {
     }),
   };
 
-  const sectionStyles = SearchContainerStyles(themeMode, /* isHome */ false);
+  const sectionStyles = SearchContainerStyles(/* isHome */ false);
 
   const error = useRouteError() as Error;
   console.error(error);

src/components/Shared/ToggleDarkModeButton.tsx

@@ -31,9 +31,7 @@ function ToggleDarkMode() {
       margin: 0,
       $nest: {
         '.toggle-text': {
-          ...(theme === 'light'
-            ? FontsRaw.BodyDefault
-            : FontsRaw.BodyDefaultDark),
+          ...FontsRaw.BodyDefault,
           margin: 0,
         },
         '.toggle-switch': {

src/styles/CompareCards.ts

@@ -122,12 +122,10 @@ export const CompareCardsStyles = (mode: string) => {
       width: '76%',
       $nest: {
         '.compare-card-title': {
-          ...(isTrueLight
-            ? FontsRaw.HeadingDefault
-            : FontsRaw.HeadingDefaultDark),
+          ...FontsRaw.HeadingDefault,
         },
         '.compare-card-tagline': {
-          ...(isTrueLight ? FontsRaw.BodyDefault : FontsRaw.BodyDefaultDark),
+          ...FontsRaw.BodyDefault,
           margin: '0px',
         },
       },
@@ -166,7 +164,7 @@ export const SearchStyles = (mode: string) => {
       marginBottom: `${Spacing.xSmall + 2}px`,
       $nest: {
         '.dropdown-select-label,.base_label': {
-          ...(isTrueLight ? FontsRaw.BodyDefault : FontsRaw.BodyDefaultDark),
+          ...FontsRaw.BodyDefault,
           fontWeight: '600',
           display: 'flex',
           alignItems: 'center',

src/styles/Fonts.ts

@@ -59,37 +59,16 @@ export const FontsRaw = {
     fontSize: FontSizeRaw.Normal.fontSize,
     fontFamily: 'SF Pro',
   },
-
-  //DARK MODE FONTS
-
-  HeadingDefaultDark: {
-    ...sharedFontStyles,
-    fontWeight: '600',
-    fontSize: '17px',
-    fontFamily: 'SF Pro',
-  },
-
-  HeadingXSDark: {
-    ...sharedFontStyles,
-    fontSize: '24px',
-    fontFamily: 'Metropolis',
-  },
-
-  BodyDefaultDark: {
-    ...sharedFontStyles,
-    fontWeight: '400',
-    fontSize: FontSizeRaw.Normal.fontSize,
-    fontFamily: 'SF Pro',
-  },
 };
 
+const headingDefault = style(FontsRaw.HeadingDefault);
+const headingXS = style(FontsRaw.HeadingXS);
+const bodyDefault = style(FontsRaw.BodyDefault);
+
 export const Fonts = {
-  HeadingDefault: style(FontsRaw.HeadingDefault),
-  HeadingXS: style(FontsRaw.HeadingXS),
-  BodyDefault: style(FontsRaw.BodyDefault),
-  HeadingDefaultDark: style(FontsRaw.HeadingDefaultDark),
-  HeadingXSDark: style(FontsRaw.HeadingXSDark),
-  BodyDefaultDark: style(FontsRaw.BodyDefaultDark),
+  HeadingDefault: headingDefault,
+  HeadingXS: headingXS,
+  BodyDefault: bodyDefault,
 };
 
 export const FontSize = {

src/styles/SearchContainerStyles.ts

@@ -2,9 +2,7 @@ import { stylesheet } from 'typestyle';
 
 import { FontsRaw, Spacing } from '../styles';
 
-export const SearchContainerStyles = (mode: string, isHome: boolean) => {
-  const isTrueLight = mode == 'light';
-
+export const SearchContainerStyles = (isHome: boolean) => {
   const styles = stylesheet({
     container: {
       /*** maxWidth based on mozilla protocol large cards size; see https://protocol.mozilla.org/components/detail/card--large
@@ -18,7 +16,7 @@ export const SearchContainerStyles = (mode: string, isHome: boolean) => {
       flexDirection: 'column',
       $nest: {
         '.search-default-title': {
-          ...(isTrueLight ? FontsRaw.HeadingXS : FontsRaw.HeadingXSDark),
+          ...FontsRaw.HeadingXS,
           marginBottom: `${Spacing.xLarge + 10}px`,
           textAlign: 'center',
         },

src/styles/SelectedRevsStyle.ts

@@ -27,7 +27,7 @@ export const SelectRevsStyles = (mode: string) => {
           },
         },
         '.item-container': {
-          ...(isTrueLight ? FontsRaw.BodyDefault : FontsRaw.BodyDefaultDark),
+          ...FontsRaw.BodyDefault,
           backgroundColor: isTrueLight
             ? Colors.Background200
             : Colors.Background300Dark,