Blazor Chart for Safety Data
Budget: $10 – $50 USD
I'm looking for a competent developer who can create a Blazor chart that resembles an Excel graph. I need the chart to represent our safety data at work, specifically the number of safety days and the days since our last accident. The logic for the data is already done, but I need help with the CSS.
The Blazor page, located at "/safetyboarddisplay", serves as a safety dashboard displaying injury information and days without incidents. The page injects the `AuthenticationStateProvider` for user authentication and uses `Entity Framework Core` to interact with the database.
The layout includes:
- A main container that holds all the content.
- A "Safety" box prominently displayed.
- Three main sections:
- Left side showing the last reported injury date.
- A middle section with a grid displaying each day of the month, color-coded based on injury data.
- Right side displaying the number of days without incidents and a goal of 0 injuries.
I will provide the sample in the files. Please bid your asking price.
### Layout
- **Main Container**: Central div that holds all content.
- **Safety Box**: Displays "SAFETY" prominently.
- **Columns Container**: Contains three main sections:
- **Left Side**: Displays the last reported injury date.
- **Middle**: A grid showing each day of the month, color-coded based on whether an injury was reported:
- Green: No injury.
- Red: Injury reported.
- White: Weekend or production days.
- **Right Side**: Displays days without incident and a goal of 0 injuries.
### Styles
- **General**: Flexbox layout with containers and boxes.
- **Safety Box**: Green background with bold, large text.
- **Side Containers**: Display injury data and goals, with specific styling for each type of information box.
- **Day Column Boxes**: Grid layout for days of the month, color-coded, with specific handling for weekends and production days.
Key project requirements:
- Develop a Blazor chart
- Visualize safety data: safety days, days since last accident
- Make the chart resemble the graph on Excel
In your application, please include examples of your past work.
The Blazor page, located at "/safetyboarddisplay", serves as a safety dashboard displaying injury information and days without incidents. The page injects the `AuthenticationStateProvider` for user authentication and uses `Entity Framework Core` to interact with the database.
The layout includes:
- A main container that holds all the content.
- A "Safety" box prominently displayed.
- Three main sections:
- Left side showing the last reported injury date.
- A middle section with a grid displaying each day of the month, color-coded based on injury data.
- Right side displaying the number of days without incidents and a goal of 0 injuries.
I will provide the sample in the files. Please bid your asking price.
### Layout
- **Main Container**: Central div that holds all content.
- **Safety Box**: Displays "SAFETY" prominently.
- **Columns Container**: Contains three main sections:
- **Left Side**: Displays the last reported injury date.
- **Middle**: A grid showing each day of the month, color-coded based on whether an injury was reported:
- Green: No injury.
- Red: Injury reported.
- White: Weekend or production days.
- **Right Side**: Displays days without incident and a goal of 0 injuries.
### Styles
- **General**: Flexbox layout with containers and boxes.
- **Safety Box**: Green background with bold, large text.
- **Side Containers**: Display injury data and goals, with specific styling for each type of information box.
- **Day Column Boxes**: Grid layout for days of the month, color-coded, with specific handling for weekends and production days.
Key project requirements:
- Develop a Blazor chart
- Visualize safety data: safety days, days since last accident
- Make the chart resemble the graph on Excel
In your application, please include examples of your past work.