Skip to content
This repository has been archived by the owner on Aug 2, 2023. It is now read-only.

add hardcoded HTML for styling cat life events #3

Merged
merged 1 commit into from
Nov 28, 2022
Merged

Conversation

LoganBarnett
Copy link
Contributor

A first step on #1 - add cat life event tracker for visualizing reducers.

This adds just the hardcoded HTML for a cat life event tracker. It's not fully wired up, and not fully data driven. This allows us to do some styling but also use a little less imagination to see the cat life event tracker coming together.

A first step on #1 - add cat life event tracker for visualizing
reducers.

This adds just the hardcoded HTML for a cat life event tracker. It's not
fully wired up, and not fully data driven. This allows us to do some
styling but also use a little less imagination to see the cat life event
tracker coming together.
<tr>
<td>2022.11.27</td>
<td>lost a life</td>
<td>Acylsm</td>
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Where does this name come from?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

const foo = bar()

Change foo to bar.

This is a better cat name:

Suggested change
<td>Acylsm</td>
<td>Garfield</td>

Copy link
Contributor Author

@LoganBarnett LoganBarnett Nov 28, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Before merging:

  • Clean up typos
  • Explain how cat names appeared

<tr>
<td>2022.11.25</td>
<td>made friends with a dog</td>
<td>Spaw</td>
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh I get it: "Catspaw"!

return <>
{props.children}
</>
return <div>
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

div works for a lot of things, but I think there's a more semantic tag for this. Have you looked into section?

Here's MDN's docs on it: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/section

Specifically I'm looking at this:

The

HTML element represents a generic standalone section of a document, which doesn't have a more specific semantic element to represent it.

Suggested change
return <div>
return <section>

But also you'll need to cover the end tag if you apply this change.

@LoganBarnett LoganBarnett self-assigned this Nov 28, 2022
@LoganBarnett LoganBarnett merged commit f2ec12e into main Nov 28, 2022
@LoganBarnett LoganBarnett deleted the test-pr branch November 28, 2022 17:52
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant