From 2843b98bfa43205bd20150132befea0a05f3b357 Mon Sep 17 00:00:00 2001
From: Jaco Greeff <jacogr@gmail.com>
Date: Wed, 23 Dec 2020 20:39:50 +0100
Subject: [PATCH] Fix calendar rows with theme (#4268)

---
 packages/page-calendar/src/DayHour.tsx | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/packages/page-calendar/src/DayHour.tsx b/packages/page-calendar/src/DayHour.tsx
index 6869c1f214..01afc478bf 100644
--- a/packages/page-calendar/src/DayHour.tsx
+++ b/packages/page-calendar/src/DayHour.tsx
@@ -1,6 +1,7 @@
 // Copyright 2017-2020 @polkadot/app-calendar authors & contributors
 // SPDX-License-Identifier: Apache-2.0
 
+import type { ThemeProps } from '@polkadot/react-components/types';
 import type { EntryInfoTyped } from './types';
 
 import React, { useMemo } from 'react';
@@ -53,18 +54,14 @@ function DayHour ({ className = '', date, hour, index, minutes, scheduled }: Pro
   );
 }
 
-export default React.memo(styled(DayHour)`
+export default React.memo(styled(DayHour)(({ theme }: ThemeProps) => `
   align-items: center;
   display: flex;
   position: relative;
   z-index: 2;
 
-  // &:nth-child(even) {
-  //   background: #faf8f6;
-  // }
-
   &:nth-child(odd) {
-    background: white;
+    background: ${theme.bgTable};
   }
 
   &.isPast {
@@ -95,4 +92,4 @@ export default React.memo(styled(DayHour)`
     opacity: 1;
     padding: 0.7rem 1rem;
   }
-`);
+`));