[TODO] Fix the dashboard.html

[gbowne1]

The dashboard.html needs to be fixed.

• [ ]The theme toggle does not work
  • [ ] The dark mode colors should be black, white, gray
  • [ ] The light mode colors should be blue and white. but a theme controller could be built to add to the settings menul
• [ ] The User Icon menu,
• [ ] The responsive hamburger menu appears really wierdly when you change the view on desktop.
• [ ] The Cards should be 8 cards total, with 4 in each row with 2 rows.
  • The cards images are in /public/img/ in the /src/client
  • The buttons need to be labeled.
  • Both rows of cards should be 255-260px from the left edge of the view
  • The rows and columns of cards should have 5-15px between the columns and rows.
  • I don't know the appropriate size of cards
• [ ] My view is 1920x1080 device but my actual CSS view is 1884px x 901px.
• [ ] There is no hamburger menu to the left of [LOGO]
  • This hamburger menu should bring out a 250px wide Off-Canvas drawer from the left side
• [ ] Clicking on [LOGO] button should bring you back to '/' but if you are not logged in it should take you to login

[gbowne1]

@jzunigarce

The dashboard still has the dropdown on the right. I was hoping last nights PR and merge would fix it.. but it didn't. I tried adjusting the CSS to make the cards the way they should be

The page that loads at localhost:3000/ this page should be a cover screen with a modal with a photo and the title RadioLogger and a button that will allow you to go to the login and register page login.html. The client side controller app.js could do this because it is a DOM side.

The index.html here should just pass in the client side app.js and/or server side app.js as its dependency file as a script tag and a defer possibly even a crossorigin.. It would act sort of like a splash screen.

[jzunigarce]

Well, i apply the change in the dashboard.html. a are you check this?. I suggest create a header file and implement in the other pages

[gbowne1]

yeah I had to refresh. And yeah we should make a header.html because it is a reuseable component and won't change.

Am making some changes to cards at the moment.

Edit: it has a small bug.. when you refresh it is on the right, but then you have to click on it to get it to work right properly. Probably needs a ::before and/or ::after

I made dashboard.css use variables its is :root like --card-height: 420px; instead,

[jzunigarce]

I fixed that the menu no longer appeared open at startup, I'll upload the change in a PR

[gbowne1]

Ok cool. Let me push the dashboard change.

[gbowne1]

we should probably make a card-container too. Bootstrap 5.2+ has some interesting new variables.

[gbowne1]

Moving this to TODO.md