feat: background colors and FormPage #2977
Conversation
deboer-tim
requested review from
jeffmaury and
lstocchi
and removed request for
a team
|
I'm unsure about the name TaskPage as we have a TaskBar and Task* components. I think it might be confusing to know what is doing what (not saying we should not have a separate component but the name Task looks problematic) |
|
Good point. Most of them are ‘task creation pages’ but the Help page doesn’t really fit. Not sure what else to use though. Don’t like WizardPage. FormPage? Anyone else have an idea? |
ActionPage? |
|
Actually Action* would be a nice parallelism with the buttons that lead to these pages were they to be called... ActionButtons 😉 |
|
ActionPage or FormPage works for me as well (it's not mixing with Tasks that are separate concept) |
There are 3 pages that have lighter content backgrounds: RunImage, DeployPodToKube, and Help. After fixing the header and scrollbars globally, these screens look odd because the lighter background doesn't cover the entire content area when the screen is large. I thought these screens were incorrect compared to the others, but after checking with @mairin these three are actually more recent designs. The intention is for all 'task pages' (Pull Image, Build Image, etc) to have the same lighter background, and be similar to the Details pages with breadcrumbs, close button, and potentially icons or other things in the future. The only fix for the background color is to customize NavPage's content background - or just define these as a new FormPage component. Since I was going to create this component anyway I added some basic features: the same breadcrumb and close button as we have in the details pages. So to sum up this: - fix: Fixes the problem with incomplete background color. - chore: Defines common FormPage for these pages. - feat: Adds breadcrumb and close button to these pages, matching what we have in the Details pages. Future work (follow-up PRs): - Switch the other task pages over. - Wait for full design and add icons or other features. Fixes containers#2976. Signed-off-by: Tim deBoer <git@tdeboer.ca>
|
I would rather stick with *Page since we already have NavPage and SettingsPage. While it's ok if Help doesn't fit the pattern I felt like FormPage was better (these are generally forms, to provide details for an action?) so I've updated the commit. If anyone feels strongly otherwise I can rename again. |
benoitf
changed the title
What does this PR do?
There are 3 pages that have lighter content backgrounds: RunImage, DeployPodToKube, and Help. After fixing the header and scrollbars globally, these screens look odd because the lighter background doesn't cover the entire content area when the screen is large.
I thought these screens were incorrect compared to the others, but after checking with @mairin these three are actually more recent designs. The intention is for all 'task pages' (Pull Image, Build Image, etc) to have the same lighter background, and be similar to the Details pages with breadcrumbs, close button, and potentially icons or other things in the future.
The only fix for the background color is to customize NavPage's content background - or just define these as a new FormPage component. Since I was going to create this component anyway I added some basic features: the same breadcrumb and close button as we have in the details pages.
So to sum up this:
Future work (follow-up PRs):
Screenshot/screencast of this PR
What issues does this PR fix or reference?
Fixes #2976.
How to test this PR?
Open these three pages and confirm consistent look and feel, scrolling, and background color when the screen is large.