Add mobile styles to the event card #190

a3thakra · 2021-08-27T23:32:17-04:00

a3thakra commented

2021-08-27 23:32:17 -04:00

closes #160
closes #154

https://csclub.uwaterloo.ca/~a3thakra/csc/adi-mobile-events-card/

closes #160 closes #154 https://csclub.uwaterloo.ca/~a3thakra/csc/adi-mobile-events-card/

a3thakra added 2 commits 2021-08-27 23:32:19 -04:00

continuous-integration/drone/push Build is passing Details

0008d9e914 Misc css fixes

continuous-integration/drone/push Build is passing Details

8ed72bf61b Mobile event card

a3thakra referenced this pull request

2021-08-27 23:36:58 -04:00

Fix EventCard being off centre with no poster and link #188

a258wang reviewed 2021-08-28 00:01:32 -04:00

components/EventCard.tsx

													
				@ -35,0 +54,4 @@

				        className={[

				          styles.content,

				          showDescription ? styles.mobileShowDescriptionContent : "",

				        ].join(" ")}

a258wang commented

2021-08-28 00:01:32 -04:00

Would something like this work? (I don't know if it's any cleaner/better than what we already have though...)

className=`${styles.content} ${showDescription ? styles.mobileShowDescriptionContent : ""}`

Would something like this work? (I don't know if it's any cleaner/better than what we already have though...) ``` className=`${styles.content} ${showDescription ? styles.mobileShowDescriptionContent : ""}` ```

a3thakra commented

2021-08-28 15:44:20 -04:00

it kinda results in a lot of nested ${} which i kinda dont like lol

a3thakra commented

2021-08-28 15:44:43 -04:00

the only clean way would be to use the classnames library 🤷‍♂️

a3thakra marked this conversation as resolved

a258wang reviewed 2021-08-28 00:04:17 -04:00

components/Image.tsx

													
				@ -3,1 +5,4 @@

				export function Image(props: ImgHTMLAttributes<HTMLImageElement>) {

				  const classes = props.className

				    ? [props.className, styles.image]

				    : [styles.image];