gbowne1 / RadioLogger

A Radio Logging application build with NodeJS and ExpressJS
GNU General Public License v3.0
6 stars 6 forks source link

[TODO] Fix client #14

Closed gbowne1 closed 1 year ago

gbowne1 commented 1 year ago

The client uses:

ES7 JavaScript HTML5 CSS3 jQuery

assets rendered by the browser, sent from the Express server from the public folder in /src/client.

The UI libs and frameworks are 'font-awesome' and 'bootstrap' and 'popper.js' served from cloudflare CDNs. We will download and install the packages at build time or on production. We are using CDNs only fir development.

The initial development focus will be getting the 8 pages which are essentially forms interacting with the database and internal and external APIs.

The dashboard is remdered to /dashboard as dashboard.html.

Global styles are in index.css or app.css. These are anything style related for all components/pages, like the navbar, drawer

There is a theme.js that controls the lightmode dark mode theme with the toggle on the topnav / topbar. Dark mode is black, gray in the view and white text. Light mode is the blue navbar and white.

The topnav / topbar is 60px high and changes with the theme. This bar has a off canvas drawer 250px wide. This comes out from the left . This also changes color from white to gray or black with the toggle icon. This opens with a hamburger icon and closes with a X icon inside the drawer. It has a logo button as a png that routes to /. Then it says RadioLogger in text. On the right end of the bar has a theme toggle switch, a bell icon wired up to notifications and push API. Then a user icon with a dropdown menu that goes to the bottom left, and has both icons and labels for profile, gear icon ans settings and login/logout icon with their own label.

Clicking on the blue button in a card on the dashboard changes the route, renders the associated html and css, load the js utility files linked in the html, etc.

The pics for the cards on the dashboard are in the assets directory. They are all 200x200. Also has a short descripition of what it goes to like VHF log.

gbowne1 commented 1 year ago

Moved to TODO.md