Tailwind conversion halfway done

src/views/components/common/CalendarGridCell/CalendarGridCell.module.scss

@@ -1,18 +0,0 @@
-.calendarCell {
-  display: flex;
-  width: 213.8px;
-  height: 44.769px;
-  min-width: 45px;
-  min-height: 40px;
-  flex-direction: column;
-  justify-content: center;
-  align-items: flex-start;
-  border: 1px solid #DADCE0;
-}
-
-.hourLine {
-  width: 213.8px;
-  height: 1px;
-  border-radius: var(--border-radius-none, 0px);
-  background: rgba(218, 220, 224, 0.25);
-}

src/views/components/common/CalendarGridCell/CalendarGridCell.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import styles from './CalendarGridCell.module.scss';
 
 /**
  * Component representing each 1 hour time block of a calendar
@@ -7,10 +6,8 @@ import styles from './CalendarGridCell.module.scss';
  */
 const CalendarCell: React.FC = (props) => {
   return (
-    <div className={styles.calendarCell}>
-      <div className={styles.hourLine}>
-
-      </div>
+    <div className="flex w-56 h-12 min-w-12 min-h-10 flex-col justify-center items-start border border-gray-300">
+      <div className="w-full h-1 border-none rounded-none bg-gray-300 bg-opacity-25"></div>
     </div>
   );
 };