The site uses video backgrounds in several places. Adding a reusable component that can take the name of video file and render it
Details
- Reviewers
bytesofman - Group Reviewers
Restricted Project - Commits
- rABC629712f81ab6: [e.cash] add video background component
preview the site and see how it looks
Diff Detail
- Repository
- rABC Bitcoin ABC
- Lint
Lint Not Applicable - Unit
Tests Not Applicable
Event Timeline
Build Bitcoin ABC Diffs / Diff Testing (preview-e.cash) passed.
Preview is available at http://51.178.130.230:41341 for the next 60 minutes.
web/e.cash/components/videobackground/index.js | ||
---|---|---|
5 ↗ | (On Diff #39714) | last chance to use styled components instead of <div className={} everywhere :| |
7 ↗ | (On Diff #39714) | will all videos be mp4? will all videos come from /videos/? |
web/e.cash/components/videobackground/videobackground.module.css | ||
19 ↗ | (On Diff #39714) | Is this just matching what's in webflow? Some other value? Thinking -- how easy / difficult will it be to change this for a new theme? Probably better if we have a theme file or some kind of reference that stores these values as variables where they are easy to change later. |
web/e.cash/components/videobackground/index.js | ||
---|---|---|
5 ↗ | (On Diff #39714) | lol you love those styled components! I dont mind classnames.... |
7 ↗ | (On Diff #39714) | yeah thought about that, could import the video in the parent and pass the whole thing as a prop...or just pass the full src path as a string... but I figured this would eliminate that import line and yes planning on all videos being mp4s and stored in the videos folder for this....and the whole string would be messier. Which do you like? |
web/e.cash/components/videobackground/videobackground.module.css | ||
19 ↗ | (On Diff #39714) | fair enough. Are we talking any possible theme or just the stealth theme? Stealth theme likely wont even use this video component....not stealthy enough |
web/e.cash/components/videobackground/index.js | ||
---|---|---|
5 ↗ | (On Diff #39714) | Doesn't have to be in this diff but we should probably implement styled components. The main advantage is having component styling depend on state. So you could, for example, change the color or the font or the styling of the "price" area if price is up more than 10% in the last 24 hrs. This type of thing is much easier with styled components. It also isn't all or nothing. You could have styled components and use it only for more complicated styling like this. So, really is dev preference. It's not high priority for the whole repo to be styled components. |
7 ↗ | (On Diff #39714) | Hard to say with only one video. Just need to be aware of anything that is a "system" and how future examples of this system need to be added. |
web/e.cash/components/videobackground/videobackground.module.css | ||
19 ↗ | (On Diff #39714) | Yeah for this one -- not relevant to this diff -- but unlike styled components it would be a real pain in the ass to come back in 2 months and try to drop in a new theme. Need to hunt down every single hard coded color. You can check out the theme implementation in Cashtab. We haven't changed the theme yet. But it's still much easier to do styling if you have your color pallette in its own place. Then you're not constantly referencing "what's that hex color code again for a subheader .... " So -- need to get a task and a diff up soon for replacing at least all colors with variables. |