Dashboard - 2/3 v.0 #23
Conversation
* Add banner values from actual data * Fix style banner * Migration catalogue * Mock catalogue response * Clean up update * Delete dependency on package lock json * Add env for Batch size * Fix sidebar style * Fix pagination * Migrate updated publish form * Add Asset,PriceCard amd DatasetInfo components * Update tsconfig * Add review suggestions on style * Add asset credentials * Add provider card * Add mocked terms and conditions * Add recommender + fix styles * Update offerings to be clickable * First v of overview page * Fix style on transfer history * Fix style on transfer history * Add page and fix styles * hot fix * Add Recommender item and update styles * Update sidebar
* Add banner values from actual data * Fix style banner * Migration catalogue * Mock catalogue response * Clean up update * Delete dependency on package lock json * Add env for Batch size * Fix sidebar style * Fix pagination * Migrate updated publish form * Add Asset,PriceCard amd DatasetInfo components * Update tsconfig * Add review suggestions on style * Add asset credentials * Add provider card * Add mocked terms and conditions * Add recommender + fix styles * Update offerings to be clickable * First v of overview page * Fix style on transfer history * Fix style on transfer history * Add page and fix styles * hot fix * Add Recommender item and update styles * Update sidebar * Contracting page v.0.0 * Update nav to show overview by default on dashboard * Unify icons in one object to avoid duplication * Delete bg red from contracts * Add filters to sideboard * Update Icons * Add creation date title * Fix styling
There was a problem hiding this comment.
Thank you for this work @NaryLozano ! The dashboard looks pretty nice ! I left a few comments here and there, mostly about the look of the UI and some minor refactoring, but there is no major changes required. Let me know if you have any questions! Thanks again!
| <div className='flex gap-2 max-h-16'> | ||
| <Image width={64} height={64} src={provider.picture} alt={provider.name} className='max-w-16 max-h-16 object-cover object-center rounded-lg shadow-lg ml-2' /> | ||
| <p className=' flex pr-2 text-sm font-semibold'>{providedBy}</p> | ||
| </div> |
There was a problem hiding this comment.
The position of this component looks a little odd. If it is hard or not so nice to have it centered like in the mock up, what do you think of just pushing it completely to the right ?
There was a problem hiding this comment.
I have tried to put it in the center or completely to the right.
Since this accordion component is a flowbite component it has inner elements that are not easy to override, I tried to create another custom theme for this specific case, but it still does not override the exact element that contains the title. There is always space to the right.
So in the end I have tried to put it to the right as much as I could, but if the VP is very wide it would look like it is in the center
|
Hi @NaryLozano ! Sorry one thing I forgot in my review: the Transfer button on the contract page is missing (cf image in #11 ).. Sorry about that! |
| value={value} | ||
| separator='to' | ||
| placeholder='Select period' | ||
| containerClassName='overflow-x-clip' |
There was a problem hiding this comment.
So this is the bug I was talking about.
for the date picker to be able to pop up on top of everything, (outside of the boundaries of the sidebar) It needs to add this prop -> containerClassName='overflow-x-clip (I have tried different types of overflow all with the same output)
So, the calendar icon appears on the right side of the screen( marked in red) and all the areas to the right(marked in yellow) would be clickable for the date picker... if you click anywhere in that area the date picker would open, as today I don't know how to fix it, I agree from our conversation that we could open an issue to investigate this further.
and decide another way to display this date picker or not use it in the sidebar
|
Oh no, I forgot to fix the position of the pagination :( |
Hey Team!
Whats new?
overview page
sidebar
stats banner
transactions history
Please leave any feedback and try to break it 💥 :)
closes #10
Hey Team!
Whats new?
consumed contracts page 🚀
contract detail
pagination
shells for (not functional) :
Please leave any feedback and try to break it 💥 :)
Closes #11