diff --git a/frontend/plan/components/map/MapCourseItem.tsx b/frontend/plan/components/map/MapCourseItem.tsx
index f74a3d62..46adfaa3 100644
--- a/frontend/plan/components/map/MapCourseItem.tsx
+++ b/frontend/plan/components/map/MapCourseItem.tsx
@@ -6,8 +6,8 @@ const CourseCartItem = styled.div<{ $isMobile: boolean }>`
transition: 250ms ease background;
cursor: pointer;
user-select: none;
-
- flex-direction: row;
+ display: flex;
+ align-items: center;
padding: 0.8rem;
border-bottom: 1px solid #e5e8eb;
grid-template-columns: 20% 50% 15% 15%;
@@ -28,6 +28,15 @@ const CourseCartItem = styled.div<{ $isMobile: boolean }>`
const CourseDetailsContainer = styled.div``;
+const Dot = styled.span<{ $color: string }>`
+ height: 5px;
+ width: 5px;
+ border-radius: 50%;
+ display: inline-block;
+ margin-right: 10px;
+ background-color: ${({ $color }) => $color};
+`;
+
interface CourseDetailsProps {
id: string;
start: number;
@@ -91,8 +100,7 @@ const CourseDetails = ({
interface CartSectionProps {
id: string;
- lat?: number;
- lng?: number;
+ color: string;
start: number;
end: number;
room: string;
@@ -102,8 +110,7 @@ interface CartSectionProps {
function MapCourseItem({
id,
- lat,
- lng,
+ color,
start,
end,
room,
@@ -121,6 +128,7 @@ function MapCourseItem({
focusSection(`${split[0]}-${split[1]}`);
}}
>
+
;
focusSection: (id: string) => void;
@@ -120,34 +125,34 @@ function MapTab({ meetingsByDay, focusSection }: MabTapProps) {
zoom={15}
/>
- {meeetingsForDay.map(
- (
- {
- id,
- latitude,
- longitude,
- start,
- end,
- room,
- overlap,
- }: Meeting,
- i: number
- ) => {
- return (
-
- );
- }
- )}
+
+ {meeetingsForDay.map(
+ (
+ {
+ id,
+ color,
+ start,
+ end,
+ room,
+ overlap,
+ }: Meeting,
+ i: number
+ ) => {
+ return (
+
+ );
+ }
+ )}
+
>
)}
diff --git a/frontend/plan/components/schedule/Block.tsx b/frontend/plan/components/schedule/Block.tsx
index d928659c..8f423c3d 100644
--- a/frontend/plan/components/schedule/Block.tsx
+++ b/frontend/plan/components/schedule/Block.tsx
@@ -120,26 +120,28 @@ export default function Block(props: BlockProps) {
};
return (
-
-
- {!isMobile && !readOnly && (
- {
- remove();
- e.stopPropagation();
- }}
- />
- )}
- {false && !coreqFulfilled && }
+ {color && (
+
+
+ {!isMobile && !readOnly && (
+ {
+ remove();
+ e.stopPropagation();
+ }}
+ />
+ )}
+ {false && !coreqFulfilled && }
- {id.replace(/-/g, " ")}
-
-
+ {id.replace(/-/g, " ")}
+
+
+ )}
);
}