From d67e3d7853a9f272381328d56a98fca0361f60b6 Mon Sep 17 00:00:00 2001 From: lassejaco Date: Sat, 26 Oct 2024 23:23:12 +0200 Subject: [PATCH] session details --- devcon-app/src/assets/icons/livestream.svg | 3 + .../domain/app/dc7/sessions/index.tsx | 73 +++++++++++++++++-- .../app/dc7/sessions/sessions.module.scss | 38 ++++++++++ .../domain/app/dc7/speakers/index.tsx | 2 +- lib/components/pop-up/PopUp.tsx | 72 +++++++++--------- 5 files changed, 145 insertions(+), 43 deletions(-) create mode 100644 devcon-app/src/assets/icons/livestream.svg diff --git a/devcon-app/src/assets/icons/livestream.svg b/devcon-app/src/assets/icons/livestream.svg new file mode 100644 index 000000000..bef8f9359 --- /dev/null +++ b/devcon-app/src/assets/icons/livestream.svg @@ -0,0 +1,3 @@ + + + diff --git a/devcon-app/src/components/domain/app/dc7/sessions/index.tsx b/devcon-app/src/components/domain/app/dc7/sessions/index.tsx index 5904f04a4..d71599c5e 100644 --- a/devcon-app/src/components/domain/app/dc7/sessions/index.tsx +++ b/devcon-app/src/components/domain/app/dc7/sessions/index.tsx @@ -40,6 +40,17 @@ import ScrollDownIcon from 'lib/assets/icons/scroll-down.svg' import CityGuide from 'assets/images/dc-7/city-guide.png' import { useRecoilValue } from 'recoil' import { Popup } from 'lib/components/pop-up' +import LivestreamIcon from 'assets/icons/livestream.svg' +import IconStar from 'assets/icons/star.svg' +import IconStarFill from 'assets/icons/star-fill.svg' +import IconCalendarAdd from 'assets/icons/schedule-plus.svg' +import IconMarker from 'assets/icons/icon_marker.svg' +import IconPeople from 'assets/icons/icon_people.svg' +import IconAdded from 'assets/icons/calendar-added.svg' +import IconAdd from 'assets/icons/calendar-add.svg' +import IconCalendar from 'assets/icons/calendar.svg' +import PinIcon from 'assets/icons/pin.svg' +import AddToCalendar from 'components/domain/index/add-to-calendar/AddToCalendar' const cardClass = 'flex flex-col lg:border lg:border-solid lg:border-[#E4E6EB] rounded-3xl relative' @@ -291,7 +302,7 @@ export const SessionCard = ({ session, className }: { session: SessionType; clas
{ e.stopPropagation() e.preventDefault() @@ -655,7 +666,7 @@ export const SessionView = ({ session, standalone }: { session: SessionType | nu className={cn( cardClass, 'flex flex-col gap-3 lg:p-4 self-start w-full no-scrollbar', - !standalone && 'lg:max-h-[calc(100vh-72px)] lg:overflow-auto' + !standalone && 'lg:max-h-[calc(100vh-84px)] lg:overflow-auto' )} >
-
Session Details
-
{session.description}
+
+
Description
+
{session.description}
+
@@ -713,13 +726,49 @@ export const SessionView = ({ session, standalone }: { session: SessionType | nu {moment(session.endTime).format('HH:mm A')}
-
+ {/*
{session.speakers?.map(speaker => speaker.name).join(', ')} +
*/} +
+ +
+
+
{true ? : }
+

Mark as interesting

+
+
+
{false ? : }
+

Attend Session

+ + +
+
+ +
+

Export to Calendar

+
+ + + {/* +

Room Details

+ */}
-
+
setDevaBotVisible(`Tell me about similar sessions to "${session.title}"`)} @@ -735,6 +784,18 @@ export const SessionView = ({ session, standalone }: { session: SessionType | nu ))}
+ +
+
Livestream
+
+ +
Live
+
+
+ +
+
+
) } diff --git a/devcon-app/src/components/domain/app/dc7/sessions/sessions.module.scss b/devcon-app/src/components/domain/app/dc7/sessions/sessions.module.scss index bbb8ca14c..8701af005 100644 --- a/devcon-app/src/components/domain/app/dc7/sessions/sessions.module.scss +++ b/devcon-app/src/components/domain/app/dc7/sessions/sessions.module.scss @@ -55,3 +55,41 @@ -webkit-backdrop-filter: blur(8px); // border: 1px solid rgba(255, 255, 255, 0.3); } + +.actions { + margin-top: 16px; + margin-bottom: 16px; + display: grid; + grid-template-columns: 1fr 1fr; + grid-gap: 1px; + // background: $colors-standard-border-color; + // border: 1px solid $colors-standard-border-color; + max-width: 600px; + + @media (min-width: 1024px) { + grid-template-columns: repeat(4, 1fr); + max-width: none; + } + + > * { + // height: 52px; + display: flex; + justify-content: space-between; + align-items: center; + // background: $colors-monochrome-1; + padding: 8px; + cursor: pointer; + // --color-icon: #{$colors-monochrome-5}; + + > p { + font-size: 13px; + // @include fonts-bold; + // color: $colors-monochrome-8; + // align-self: flex-end; + } + + > svg { + font-size: 20px; + } + } +} diff --git a/devcon-app/src/components/domain/app/dc7/speakers/index.tsx b/devcon-app/src/components/domain/app/dc7/speakers/index.tsx index 6931a1da9..1909fe8ac 100644 --- a/devcon-app/src/components/domain/app/dc7/speakers/index.tsx +++ b/devcon-app/src/components/domain/app/dc7/speakers/index.tsx @@ -422,7 +422,7 @@ export const SpeakerView = ({ speaker, standalone }: { speaker: SpeakerType | nu className={cn( cardClass, 'flex flex-col gap-3 lg:p-4 self-start w-full no-scrollbar', - !standalone && 'lg:max-h-[calc(100vh-72px)] lg:overflow-auto' + !standalone && 'lg:max-h-[calc(100vh-84px)] lg:overflow-auto' )} > {/*