www
/
www-new
12
3
Fork 5
Code Issues 58 Pull Requests 42 Projects Releases Wiki Activity

Fix title inconsistencies #229

Merged
j285he merged 5 commits from jared-fix-headers into main 2021-08-30 20:49:13 -04:00
Conversation 0 Commits 5 Files Changed 4 +32 -13
4 changed files with 32 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
pages/events/[year]/[term]/index.module.css
View File

@ -3,9 +3,9 @@
margin-bottom: calc(60rem / 16);
}
.main > h2 {
padding-bottom: 1rem;
border-bottom: 1px solid var(--primary-heading);
.main > h1, .main > section > h1 {
padding-bottom: calc(16rem / 16);
border-bottom: calc(1rem / 16) solid var(--primary-heading);
}
.header {

28
pages/events/[year]/[term]/index.tsx
View File

@ -67,8 +67,8 @@ export default function Term(props: Props) {
<Link href="/events/archive">Archive</Link>
</div>
{hasFutureEvents && (
a3thakra commented 2021-08-30 19:16:32 -04:00
Outdated
Review
Copy Link

actually can you put this in a section tag? technically, there are two h1's on the page. But a page cannot have 2 h1s. If we look closely, we have two sections on this page, each with it's own h1. I think that would make this nicer. (in terms of semantics)

actually can you put this in a section tag? technically, there are two h1's on the page. But a page cannot have 2 h1s. If we look closely, we have two sections on this page, each with it's own h1. I think that would make this nicer. (in terms of semantics)
j285he commented 2021-08-30 19:24:19 -04:00
Outdated
Review
Copy Link

I currently have Past Events as an h2. Should I make it an h1?

I currently have Past Events as an h2. Should I make it an h1?
a3thakra commented 2021-08-30 19:27:35 -04:00
Outdated
Review
Copy Link

Yes, semantically speaking, each page should have exactly one h1, and then 0 or more h2's

Yes, semantically speaking, each page should have exactly one h1, and then 0 or more h2's
a3thakra commented 2021-08-30 19:28:34 -04:00
Outdated
Review
Copy Link

when i say h1, i mean the h1 tag. you can style it as you wish.

when i say h1, i mean the h1 tag. you can style it as you wish.
j285he commented 2021-08-30 19:32:55 -04:00
Outdated
Review
Copy Link

Ah okay. Also for the original comment, I don't see two h1's on the same page. It's just either Upcoming Events or Events Archive:. Am I going crazy?

Ah okay. Also for the original comment, I don't see two h1's on the same page. It's just either `Upcoming Events` or `Events Archive:`. Am I going crazy?
a3thakra commented 2021-08-30 19:39:13 -04:00
Outdated
Review
Copy Link

"Upcoming events" and "Past events" should both be h1s enclosed within a section. So the final markup would look something like this:

<section>
    <h1>Upcoming events</h1>
    {events.map(...)}
</section>
<section>
    <h1>Past events</h1>
    {events.map(...)}
</section>
"Upcoming events" and "Past events" should both be `h1`s enclosed within a `section`. So the final markup would look something like this: ```html <section> <h1>Upcoming events</h1> {events.map(...)} </section> <section> <h1>Past events</h1> {events.map(...)} </section> ```
j285he commented 2021-08-30 19:52:34 -04:00
Outdated
Review
Copy Link

Ahhhhhh sorry I see what you mean, thanks!

Although what are your thoughts on the styling? I think having h2 on Past Events makes the user more drawn towards current upcoming events, instead of having two blocky h1's competing for attention, but idk

Ahhhhhh sorry I see what you mean, thanks! Although what are your thoughts on the styling? I think having h2 on Past Events makes the user more drawn towards current upcoming events, instead of having two blocky h1's competing for attention, but idk
a3thakra commented 2021-08-30 19:56:50 -04:00
Outdated
Review
Copy Link

As I said earlier, they should be h1 tags, you can style them like h2s to match figma 😉

As I said earlier, they should be h1 tags, you can style them like h2s to match figma 😉
j285he commented 2021-08-30 20:07:21 -04:00
Outdated
Review
Copy Link

OK, thank you! Since Figma's title sizes differ a bit from ours, let me know if I should change the size of Past Events or not

OK, thank you! Since Figma's title sizes differ a bit from ours, let me know if I should change the size of Past Events or not
<>
<h2>Upcoming Events</h2>
<section>
<h1>Upcoming Events</h1>
<div className={styles.miniEventCards}>
{props.futureEvents.map(({ content, metadata }) => (
<EventCard
@ -81,20 +81,34 @@ export default function Term(props: Props) {
</EventCard>
))}
</div>
</>
</section>
)}
{hasPastEvents && props.isCurrentTerm && (
<section>
<h1>Past Events</h1>
<div className={styles.miniEventCards}>
{props.pastEvents.map(({ content, metadata }) => (
<MiniEventCard
{...metadata}
date={new Date(metadata.date)}
description={<MDXRemote {...content} />}
key={metadata.name + metadata.date.toString()}
/>
))}
</div>
</section>
)}
{hasPastEvents && props.isCurrentTerm && <h2>Past Events</h2>}
{hasPastEvents && !props.isCurrentTerm && (
<h2>
<h1>
Events Archive:
<span className={styles.blue}>
{` ${capitalize(props.term)} ${props.year}`}
</span>
</h2>
</h1>
)}
{!hasFutureEvents && !hasPastEvents && (
<>
<h2>Events</h2>
<h1>Events</h1>
There are no upcoming or past events for the{" "}
{`${capitalize(props.term)} ${props.year}`} term. Please check back
later!

6
pages/events/[year]/index.module.css
View File

@ -2,9 +2,9 @@
margin-top: calc(60rem / 16);
}
.main > h2 {
padding-bottom: calc(1rem / 16);
border-bottom: 1px solid var(--primary-heading);
.main > h1 {
padding-bottom: calc(16rem / 16);
border-bottom: calc(1rem / 16) solid var(--primary-heading);
}
.blue {

5
pages/news/[year]/[term].module.css
View File

@ -2,6 +2,11 @@
padding-bottom: calc(30rem / 16);
}
.page > h1 {
padding-bottom: calc(16rem / 16);
border-bottom: calc(1rem / 16) solid var(--primary-heading);
j285he marked this conversation as resolved Outdated
a3thakra commented 2021-08-30 19:13:37 -04:00
Outdated
Review
Copy Link

calc(1rem / 16) solid ...

calc(1rem / 16) solid ...
}
.term {
color: var(--primary-accent);
}