feat: add FAB to meals page for quick meal creation (#62)
This commit is contained in:
@@ -7,6 +7,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|||||||
|
|
||||||
## [Unreleased]
|
## [Unreleased]
|
||||||
|
|
||||||
|
## [0.20.26] - 2026-04-20
|
||||||
|
|
||||||
|
### Added
|
||||||
|
- Meals: floating action button (FAB) now appears fixed at the bottom-right corner, opening a quick-add modal for today with the first visible meal type pre-selected
|
||||||
|
|
||||||
## [0.20.25] - 2026-04-20
|
## [0.20.25] - 2026-04-20
|
||||||
|
|
||||||
### Fixed
|
### Fixed
|
||||||
|
|||||||
Generated
+2
-2
@@ -1,12 +1,12 @@
|
|||||||
{
|
{
|
||||||
"name": "oikos",
|
"name": "oikos",
|
||||||
"version": "0.20.25",
|
"version": "0.20.26",
|
||||||
"lockfileVersion": 3,
|
"lockfileVersion": 3,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"packages": {
|
"packages": {
|
||||||
"": {
|
"": {
|
||||||
"name": "oikos",
|
"name": "oikos",
|
||||||
"version": "0.20.25",
|
"version": "0.20.26",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"bcrypt": "^6.0.0",
|
"bcrypt": "^6.0.0",
|
||||||
|
|||||||
+1
-1
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "oikos",
|
"name": "oikos",
|
||||||
"version": "0.20.25",
|
"version": "0.20.26",
|
||||||
"description": "Self-hosted family planner - calendar, tasks, shopping, meal planning, budget and more. Private, open-source, no subscription.",
|
"description": "Self-hosted family planner - calendar, tasks, shopping, meal planning, budget and more. Private, open-source, no subscription.",
|
||||||
"main": "server/index.js",
|
"main": "server/index.js",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
|
|||||||
@@ -146,6 +146,9 @@ export async function render(container, { user }) {
|
|||||||
<div class="week-grid" id="week-grid">
|
<div class="week-grid" id="week-grid">
|
||||||
<div style="margin:auto;padding:2rem;text-align:center;color:var(--color-text-disabled)">${t('meals.loadingIndicator')}</div>
|
<div style="margin:auto;padding:2rem;text-align:center;color:var(--color-text-disabled)">${t('meals.loadingIndicator')}</div>
|
||||||
</div>
|
</div>
|
||||||
|
<button class="page-fab" id="fab-new-meal" aria-label="${t('meals.addMealTitle')}">
|
||||||
|
<i data-lucide="plus" style="width:24px;height:24px" aria-hidden="true"></i>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
@@ -157,6 +160,11 @@ export async function render(container, { user }) {
|
|||||||
await Promise.all([loadWeek(monday), loadLists(), loadPreferences(), loadCategories()]);
|
await Promise.all([loadWeek(monday), loadLists(), loadPreferences(), loadCategories()]);
|
||||||
renderWeekGrid();
|
renderWeekGrid();
|
||||||
wireNav();
|
wireNav();
|
||||||
|
|
||||||
|
container.querySelector('#fab-new-meal').addEventListener('click', () => {
|
||||||
|
const firstType = state.visibleMealTypes[0] ?? 'lunch';
|
||||||
|
openMealModal({ mode: 'create', date: today, mealType: firstType });
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// --------------------------------------------------------
|
// --------------------------------------------------------
|
||||||
|
|||||||
Reference in New Issue
Block a user