Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(media): create media object component #1383

Merged
merged 16 commits into from
Jul 17, 2019

Conversation

alexkrolick
Copy link
Contributor

No description provided.

@boxcla
Copy link

boxcla commented Jul 9, 2019

Verified that @alexkrolick has signed the CLA. Thanks for the pull request!

@alexkrolick alexkrolick force-pushed the media-component branch 3 times, most recently from 2260f42 to b5e18e7 Compare July 11, 2019 01:46
Copy link
Contributor

@jstoffan jstoffan left a comment

Choose a reason for hiding this comment

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

Approach looks good to me!

src/components/media/MediaMenu.js Outdated Show resolved Hide resolved
src/components/media/Media.js Show resolved Hide resolved
src/components/media/Media.js Outdated Show resolved Hide resolved
}

// the media content, ie, an avatar
.bdl-Media-img {
Copy link
Contributor

Choose a reason for hiding this comment

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

Each sub-component should have its own top-level class name, such as .bdl-MediaImage. It's probably fine for them to live in the same stylesheet, though, as long as re-importing it in each component doesn't create duplicate styles in the output CSS.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Copy link
Contributor

Choose a reason for hiding this comment

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

That applies when different elements live in the same file, but since these are declared as separate components, they should be named as such.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

The sub-elements are meant to be used like Media.Body not as separate imports.

These are sub-elements almost exactly like the Tweet example in the SUIT docs.

@priyajeet
Copy link
Contributor

Probably should check if https://github.com/box/box-ui-elements/blob/master/src/elements/content-sidebar/versions/VersionsItem.js can be refactored to use these components/design if possible

@alexkrolick alexkrolick marked this pull request as ready for review July 16, 2019 20:30
@alexkrolick alexkrolick requested a review from a team July 16, 2019 20:30
@alexkrolick
Copy link
Contributor Author

I tested this out with the Activity Feed Comment/Task container and it seems to work. I'll put that out as a separate PR once this is in.

@alexkrolick alexkrolick requested review from priyajeet and jstoffan and removed request for priyajeet July 16, 2019 20:31
@alexkrolick alexkrolick force-pushed the media-component branch 2 times, most recently from 31c20aa to ebb54ba Compare July 16, 2019 22:35
src/components/media/Media.scss Outdated Show resolved Hide resolved
src/components/media/Media.scss Outdated Show resolved Hide resolved
src/components/media/Media.scss Outdated Show resolved Hide resolved
src/components/media/Media.scss Outdated Show resolved Hide resolved
Copy link
Contributor

@jstoffan jstoffan left a comment

Choose a reason for hiding this comment

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

Nice job!

@alexkrolick alexkrolick merged commit 5140c13 into box:master Jul 17, 2019
@alexkrolick alexkrolick deleted the media-component branch July 17, 2019 00:39
@alexkrolick
Copy link
Contributor Author

Thanks for your feedback everyone

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants