material-dashboard-angular2 icon indicating copy to clipboard operation
material-dashboard-angular2 copied to clipboard

replace bootstrapified "tab group" dashboard card with an actual angular component

Open guss77 opened this issue 5 years ago • 0 comments

The dashboard view is very pretty, but it isn't really built with Angular - it is a bunch of boostrap-style UI elements, and is therefore to verbose and hard to customize and re-use.

I suggest replacing the widgets in the dashboard with Angular components that are customizable and reusable.

Here is the first one - the tabbed card (Labeled "Tasks") as an angular component.

We can probably add more customization options (I'm particularly looking at the label field that is just a text string at the moment) and use MatCards and other Angular Material components instead of styled divs, but this PR is fully functional drop-in replacement to the current implementation and offers:

  • An arbitrary number of tabs (no paging, sorry)
  • Either simple text labels or full templates for the tab headers
  • Customizable prefix text
  • Customizable header style (using color attribute, I couldn't think of a better name)
  • Internal switching using portals (no CSS hacks)

guss77 avatar Sep 09 '20 17:09 guss77