- [Instructor] To give our table the look we want to have,…we're going to Command P,…and go to styles.css,…and just below the example tool tip,…we're going to go ahead and add a new definition…for the table element,…which should be width 100%,…and I'm going to go ahead and add some styling…for some of the columns and rows,…so my sortable header,…we want that to be black.…My mat footer row,…we want that to be bold.…Our mat table sticky class,…we want to have a border…of e0e0e0,…and we want to add some hover colors.…
So on hover of our rows,…we're going to go ahead and hide at those with F5,…and we'll copy that down to line 31,…and we'll say when the row is active,…which means selected,…we'll want it to be efefef.…Save that.…Let's go back and refresh the page,…and you see our table looks much better now.…What about these columns?…Notice my descriptions.…I can sort now.…This is a client side sort.…I can sort on the prices, as well.…So it's coming together pretty well.…
What we don't have yet are actions,…and I don't have the select all working yet.…
- What is Material Design?
- Adding the required modules to your project
- Installing Angular Material
- Adding app bars and menus
- Creating cards
- Separating content using tabs
- Adding data tables
Skill Level Intermediate
Angular Template Design and Implementationwith Gary Simon1h 32m Intermediate
Angular: API Communication and Authenticationwith Victor Mejia1h 41m Intermediate
1. Material 101
2. Getting Started
5. Form Controls
6. Popups and Modals
7. Data Tables
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.