diff --git a/Aberwyn/Controllers/HomeController.cs b/Aberwyn/Controllers/HomeController.cs index 38f94e9..81bdb1b 100644 --- a/Aberwyn/Controllers/HomeController.cs +++ b/Aberwyn/Controllers/HomeController.cs @@ -27,7 +27,14 @@ namespace Aberwyn.Controllers { var isOpen = _context.AppSettings.FirstOrDefault(x => x.Key == "RestaurantIsOpen")?.Value == "True"; ViewBag.RestaurantIsOpen = isOpen; - return View(); + + var now = DateTime.Now; + var showDate = now.Hour >= 18 ? now.Date.AddDays(1) : now.Date; + + var todaysMenu = _menuService.GetMenuForDate(showDate); + + ViewBag.ShowDate = showDate; + return View(todaysMenu); } public IActionResult Privacy() diff --git a/Aberwyn/Data/MenuService.cs b/Aberwyn/Data/MenuService.cs index e0d071c..c5d24de 100644 --- a/Aberwyn/Data/MenuService.cs +++ b/Aberwyn/Data/MenuService.cs @@ -339,6 +339,41 @@ public List GetWeeklyMenu(int weekNumber, int year) return menus; } + public WeeklyMenu? GetMenuForDate(DateTime date) + { + int week = ISOWeek.GetWeekOfYear(date); + int year = date.Year; + + // Gör om till ISO 8601: Måndag = 1, Söndag = 7 + int dayOfWeek = (int)date.DayOfWeek; + if (dayOfWeek == 0) dayOfWeek = 7; + + var menu = _context.WeeklyMenus + .FirstOrDefault(w => w.WeekNumber == week && w.Year == year && w.DayOfWeek == dayOfWeek); + + if (menu != null) + { + var mealIds = new[] { menu.BreakfastMealId, menu.LunchMealId, menu.DinnerMealId } + .Where(id => id.HasValue) + .Select(id => id.Value) + .Distinct() + .ToList(); + + var allMeals = _context.Meals + .Where(m => mealIds.Contains(m.Id)) + .ToDictionary(m => m.Id, m => m.Name); + + if (menu.BreakfastMealId.HasValue && allMeals.TryGetValue(menu.BreakfastMealId.Value, out var breakfast)) + menu.BreakfastMealName = breakfast; + if (menu.LunchMealId.HasValue && allMeals.TryGetValue(menu.LunchMealId.Value, out var lunch)) + menu.LunchMealName = lunch; + if (menu.DinnerMealId.HasValue && allMeals.TryGetValue(menu.DinnerMealId.Value, out var dinner)) + menu.DinnerMealName = dinner; + } + + return menu; + } + public List GetMenuEntriesByDateRange(DateTime startDate, DateTime endDate) { diff --git a/Aberwyn/Views/Budget/Index.cshtml b/Aberwyn/Views/Budget/Index.cshtml index 303cf8b..788539d 100644 --- a/Aberwyn/Views/Budget/Index.cshtml +++ b/Aberwyn/Views/Budget/Index.cshtml @@ -4,230 +4,229 @@ @{ ViewData["Title"] = "Budget"; } +
+
+
+ + + {{ selectedMonthName }} {{ selectedYear }} + + -
-
-
- - - {{ selectedMonthName }} {{ selectedYear }} - - - -
-
- - -
-
- -
- -
- - - - -
-
-
- -
- -
-

Sammanställning

-
    -
  • 💰 Inkomst: {{ getTotalIncome() | number:0 }} kr
    • -
  • 💸 Utgift: {{ getTotalExpense() | number:0 }} kr
    • -
  • 🏦 Sparande: {{ getTotalSaving() | number:0 }} kr
    • -

    - 📈 Kvar: - - {{ getLeftover() | number:0 }} kr - -

    - -
-
-
    -
  • - {{ cat.name }} - {{ getCategorySum(cat) | number:0 }} kr -
    • -
-
- - -
-
-
-

Utgifter

- -

- Totalt: {{ getTotalExpense() | number:0 }} kr -

- -

- Största kategori:
- {{ topExpenseCategory.name }} ({{ topExpenseCategory.percent | number:1 }}%) -

-
- -
- -
-
-
- -
- - - -
-
- -
-
{{ cat.name }}
- - -
- - - - +
+
+ +
-
-
-
+ +
+ +
+ + + + +
+
+
+ +
+ +
+

Sammanställning

+
    +
  • 💰 Inkomst: {{ getTotalIncome() | number:0 }} kr
    • +
  • 💸 Utgift: {{ getTotalExpense() | number:0 }} kr
    • +
  • 🏦 Sparande: {{ getTotalSaving() | number:0 }} kr
    • +

    + 📈 Kvar: + + {{ getLeftover() | number:0 }} kr + +

    + +
+
+
    +
  • + {{ cat.name }} + {{ getCategorySum(cat) | number:0 }} kr +
    • +
+
+ + +
+
+
+

Utgifter

+ +

+ Totalt: {{ getTotalExpense() | number:0 }} kr +

+ +

+ Största kategori:
+ {{ topExpenseCategory.name }} ({{ topExpenseCategory.percent | number:1 }}%) +

+
+ +
+ +
+
+
+ +
+ + + +
+
+ +
+
{{ cat.name }}
+ + +
+ + + +
+
+
+
+
+
-
- +
+ - - {{ item.name }} - - - {{ item.amount | number:0 }} + + {{ item.name }} + + + {{ item.amount | number:0 }} - -
- -
- - #{{ menuItem.definitionName }} - - -
- - - +
+ + #{{ menuItem.definitionName }} + + +
+ + + +
+ +
+
+ + +
-
+
+
Summa
+
{{ getCategorySum(cat) | number:0 }}
- - +
+ Det finns ingen budgetdata för vald månad ({{ selectedMonth }}/{{ selectedYear }}). +
- -
-
Summa
-
{{ getCategorySum(cat) | number:0 }}
-
- -
- Det finns ingen budgetdata för vald månad ({{ selectedMonth }}/{{ selectedYear }}). -
-
-
- - +
+ + - - -

{{ filteredDefinitions.length }} träffar

-
    -
  • - {{ suggestion.Name }} -
    • -
+ + +

{{ filteredDefinitions.length }} träffar

+
    +
  • + {{ suggestion.Name }} +
    • +
- - + + - - + + - - -
+ + +
-
+
diff --git a/Aberwyn/Views/FoodMenu/Veckomeny.cshtml b/Aberwyn/Views/FoodMenu/Veckomeny.cshtml index 7c79926..8d36044 100644 --- a/Aberwyn/Views/FoodMenu/Veckomeny.cshtml +++ b/Aberwyn/Views/FoodMenu/Veckomeny.cshtml @@ -145,7 +145,7 @@ @foreach (var meal in (List)ViewBag.AvailableMeals) { - + } diff --git a/Aberwyn/Views/Home/Budget.cshtml b/Aberwyn/Views/Home/Budget.cshtml index 28b9226..431ee8c 100644 --- a/Aberwyn/Views/Home/Budget.cshtml +++ b/Aberwyn/Views/Home/Budget.cshtml @@ -7,16 +7,21 @@ + Budget Overview - +
-

Budget Overview

+

Budget Overview

-
+
+ ⏳ Laddar budget... +
+ +
{{ category }} @@ -55,7 +64,7 @@ angular.module('budgetApp', []) .controller('BudgetController', function ($scope, $http) { const today = new Date(); - + $scope.isLoadingBudget = true; // Initialize months and years $scope.months = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12']; $scope.years = [...Array(11).keys()].map(i => today.getFullYear() - 10 + i); @@ -72,11 +81,16 @@ // Automatically filter when month or year changes $scope.filterBudget = function () { + $scope.isLoadingBudget = true; $http.get('/api/budgetapi/items', { params: { month: $scope.selectedMonth, year: $scope.selectedYear } }).then(response => { $scope.budgetItems = response.data; - }).catch(error => console.error("Error fetching budget items:", error)); + $scope.isLoadingBudget = false; + }).catch(error => { + console.error("Error fetching budget items:", error); + $scope.isLoadingBudget = false; + }); }; $scope.getItemsByCategory = function (category) { diff --git a/Aberwyn/Views/Home/Index.cshtml b/Aberwyn/Views/Home/Index.cshtml index 193cfcc..8578759 100644 --- a/Aberwyn/Views/Home/Index.cshtml +++ b/Aberwyn/Views/Home/Index.cshtml @@ -1,18 +1,44 @@ -@{ - ViewData["Title"] = "Welcome to Lewel!"; +@model Aberwyn.Models.WeeklyMenu +@{ + var showDate = (DateTime)ViewBag.ShowDate; + var day = showDate.ToString("dddd", new System.Globalization.CultureInfo("sv-SE")); } + - - - - - - @ViewData["Title"] +
+
+

Välkommen till + L + E + W + E + L

+

Idag är det @day – dagens meny är:

- - -
-

Välkommen

Kika på Menyn om du vill. + @if (Model != null) + { +
+ @if (!string.IsNullOrWhiteSpace(Model.BreakfastMealName)) { +

Frukost: @Model.BreakfastMealName

+ } + @if (!string.IsNullOrWhiteSpace(Model.LunchMealName)) { +

Lunch: @Model.LunchMealName

+ } + @if (!string.IsNullOrWhiteSpace(Model.DinnerMealName)) { +

Middag: @Model.DinnerMealName

+ } + + @if (ViewBag.RestaurantIsOpen as bool? == true) + { +

Pizzerian är öppen!

Klicka här för att Beställa pizza + } +
+ } + else + { +

Ingen meny är inlagd för denna dag.

+ } + + Visa hela veckomenyn
- - +
diff --git a/Aberwyn/Views/Home/Menu.cshtml b/Aberwyn/Views/Home/Menu.cshtml index 461db06..9634090 100644 --- a/Aberwyn/Views/Home/Menu.cshtml +++ b/Aberwyn/Views/Home/Menu.cshtml @@ -32,13 +32,13 @@
{{day}}
- Frukost: {{menu[day].breakfastMealName}} + Frukost: {{menu[day].breakfastMealName}}
- Lunch: {{menu[day].lunchMealName}} + Lunch: {{menu[day].lunchMealName}}
- Middag: {{menu[day].dinnerMealName}} + Middag: {{menu[day].dinnerMealName}}
diff --git a/Aberwyn/Views/Meal/Index.cshtml b/Aberwyn/Views/Meal/Index.cshtml index 07e4abf..c3e324d 100644 --- a/Aberwyn/Views/Meal/Index.cshtml +++ b/Aberwyn/Views/Meal/Index.cshtml @@ -1,6 +1,3 @@ -@{ - -} @@ -9,6 +6,11 @@ + +
@@ -21,7 +23,8 @@
-
+
{{ meal.Name }}
@@ -37,10 +40,25 @@ angular.module("mealGalleryApp", []).controller("MealGalleryController", function ($scope, $http) { $scope.meals = []; $scope.search = ""; + $scope.visibleCount = 12; $http.get("/api/mealMenuApi/getMeals").then(res => { $scope.meals = res.data; }); + + // Lazy loading on scroll + window.addEventListener('scroll', function () { + if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight - 150) { + $scope.$applyAsync(() => { + $scope.visibleCount += 8; + }); + } + }); + + // Show all when searching + $scope.$watch('search', function (newVal) { + $scope.visibleCount = newVal ? 9999 : 12; + }); }); diff --git a/Aberwyn/Views/Shared/_Layout.cshtml b/Aberwyn/Views/Shared/_Layout.cshtml index e2424f8..9ca3990 100644 --- a/Aberwyn/Views/Shared/_Layout.cshtml +++ b/Aberwyn/Views/Shared/_Layout.cshtml @@ -4,6 +4,11 @@ + LEWEL - Dashboard @@ -28,42 +33,51 @@
-
@RenderBody() @@ -72,6 +86,45 @@
+ + diff --git a/Aberwyn/wwwroot/css/Welcome.css b/Aberwyn/wwwroot/css/Welcome.css new file mode 100644 index 0000000..7d9f3dc --- /dev/null +++ b/Aberwyn/wwwroot/css/Welcome.css @@ -0,0 +1,80 @@ +.welcome-section.light-mode { + display: flex; + justify-content: center; + align-items: center; + min-height: 90vh; + text-align: center; + padding: 0 20px; + background: linear-gradient(to bottom right, #f9fafb, #e2e8f0); + animation: fadeIn 0.6s ease-in; +} + +@keyframes fadeIn { + from { + opacity: 0; + transform: translateY(10px); + } + + to { + opacity: 1; + transform: translateY(0); + } +} + +.welcome-content { + max-width: 700px; + color: #1e293b; + font-family: 'Segoe UI', sans-serif; +} + +.welcome-title { + font-size: 3rem; + font-weight: 700; + margin-bottom: 10px; + color: #1e293b; +} + +.highlight { + color: #eab308; +} + +.welcome-subtitle { + font-size: 1.35rem; + color: #334155; + margin-bottom: 28px; +} + +.meal-lines p { + font-size: 1.2rem; + margin: 8px 0; + color: #0f172a; +} + +.meal-lines strong { + color: #475569; +} + +.no-menu { + font-size: 1.1rem; + color: #64748b; + margin-bottom: 24px; +} + +.nav-button { + background: #3b82f6; + color: white; + text-decoration: none; + padding: 12px 26px; + border-radius: 10px; + font-size: 1rem; + font-weight: 600; + display: inline-block; + margin-top: 24px; + transition: background 0.2s ease, transform 0.2s ease; + box-shadow: 0 2px 6px rgba(0,0,0,0.1); +} + + .nav-button:hover { + background: #2563eb; + transform: translateY(-2px); + } diff --git a/Aberwyn/wwwroot/css/budget.css b/Aberwyn/wwwroot/css/budget.css index 75785f7..0201bdc 100644 --- a/Aberwyn/wwwroot/css/budget.css +++ b/Aberwyn/wwwroot/css/budget.css @@ -669,3 +669,13 @@ canvas { height: auto; } } +.loading-indicator { + text-align: center; + margin-top: 40px; + font-size: 18px; + color: #64748B; + font-style: italic; +} +[ng-cloak] { + display: none !important; +} \ No newline at end of file diff --git a/Aberwyn/wwwroot/css/meal-gallery.css b/Aberwyn/wwwroot/css/meal-gallery.css index 6601d7a..f5672a2 100644 --- a/Aberwyn/wwwroot/css/meal-gallery.css +++ b/Aberwyn/wwwroot/css/meal-gallery.css @@ -3,105 +3,157 @@ body { font-family: 'Segoe UI', sans-serif; color: #222; margin: 0; - } - - .meal-gallery-container { - max-width: 1200px; +} + +.meal-gallery-container { margin: 0 auto; padding: 2rem 1rem; - } - - .meal-gallery-header { + width: 100%; + max-width: 1200px; +} + +/* === Header och skflt === */ +.meal-gallery-header { text-align: center; - margin-bottom: 2rem; - } - - .meal-gallery-header h1 { - font-size: 2.4rem; - font-weight: 600; - } - - .search-container { + margin-bottom: 1.5rem; +} + + .meal-gallery-header h1 { + font-size: 2.2rem; + font-weight: 600; + margin: 0; + } + +.search-container { margin-top: 1rem; position: relative; - max-width: 400px; - margin-inline: auto; - } - - .search-container input { width: 100%; - padding: 10px 38px 10px 12px; - border-radius: 25px; - border: 1px solid #ccc; - font-size: 1rem; - } - - .search-container i { - position: absolute; - right: 12px; - top: 50%; - transform: translateY(-50%); - color: #888; - } - - .meal-gallery-grid { + max-width: 500px; + margin-inline: auto; +} + + .search-container input { + width: 100%; + padding: 8px 34px 8px 12px; + border-radius: 20px; + border: 1px solid #ccc; + font-size: 1rem; + box-sizing: border-box; + } + + .search-container i { + position: absolute; + right: 10px; + top: 50%; + transform: translateY(-50%); + color: #888; + font-size: 0.9rem; + } + +/* === Grid layout === */ +.meal-gallery-grid { display: grid; - grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); - gap: 24px; - } - - .meal-card { + grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); + gap: 20px; + padding-top: 16px; +} + +/* === Kortstruktur === */ +.meal-card { background: white; border-radius: 12px; overflow: hidden; - box-shadow: 0 2px 8px rgba(0,0,0,0.05); + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); transition: transform 0.2s ease, box-shadow 0.2s ease; display: flex; flex-direction: column; - } - - .meal-card:hover { - transform: scale(1.015); - box-shadow: 0 4px 12px rgba(0,0,0,0.1); - } - - .meal-card img { - width: 100%; - height: 200px; - object-fit: cover; - } - - .meal-card-content { - padding: 16px; +} + + .meal-card:hover { + transform: scale(1.015); + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); + } + + .meal-card img { + width: 100%; + height: 180px; + object-fit: cover; + } + +.meal-card-content { + padding: 14px; display: flex; flex-direction: column; flex-grow: 1; - } - - .meal-card-content h3 { - margin: 0 0 8px; - font-size: 1.2rem; - color: #111; - } - - .meal-card-content p { - flex-grow: 1; - font-size: 0.95rem; - color: #555; - } - - .btn-readmore { +} + + .meal-card-content h3 { + margin: 0 0 6px; + font-size: 1.15rem; + color: #111; + } + + .meal-card-content p { + flex-grow: 1; + font-size: 0.95rem; + color: #555; + margin: 0; + } + +/* === Ls mer-knapp === */ +.btn-readmore { align-self: flex-start; background: #007d36; color: white; - padding: 8px 12px; + padding: 7px 12px; border-radius: 6px; text-decoration: none; - font-size: 0.95rem; - margin-top: 12px; - } - - .btn-readmore:hover { - background: #005c27; - } - \ No newline at end of file + font-size: 0.9rem; + margin-top: auto; + transition: background-color 0.2s ease; +} + + .btn-readmore:hover { + background: #005c27; + } + +/* === Mobilanpassning === */ +@media (max-width: 600px) { + .meal-gallery-grid { + grid-template-columns: repeat(2, 1fr); /* exakt 2 per rad */ + } + .meal-gallery-header h1 { + font-size: 1.6rem; + } + + .search-container { + max-width: 90%; + } + + .search-container input { + padding: 6px 30px 6px 10px; + font-size: 0.9rem; + border-radius: 18px; + } + + .meal-card img { + height: 130px; + } + + .meal-card-content { + padding: 10px; + } + + .meal-card-content h3 { + font-size: 1rem; + } + + .meal-card-content p { + font-size: 0.85rem; + } + + .btn-readmore { + padding: 6px 10px; + font-size: 0.85rem; + } +} diff --git a/Aberwyn/wwwroot/css/menu.css b/Aberwyn/wwwroot/css/menu.css index 1c8efdf..8a7a08e 100644 --- a/Aberwyn/wwwroot/css/menu.css +++ b/Aberwyn/wwwroot/css/menu.css @@ -1,5 +1,4 @@ :root { - --bg: #F9FAFB; --bg-mid: #EDF2F7; --text: #2D3748; --accent: #3182CE; @@ -34,6 +33,10 @@ body { background-color: var(--bg); color: var(--text); } +.fade-out { + opacity: 0; + transition: opacity 0.1s ease-out; +} .meal-menu-page { position: relative; diff --git a/Aberwyn/wwwroot/css/site.css b/Aberwyn/wwwroot/css/site.css index ce9b107..5315aba 100644 --- a/Aberwyn/wwwroot/css/site.css +++ b/Aberwyn/wwwroot/css/site.css @@ -147,25 +147,25 @@ body { .page-content { display: flex; + flex-direction: column; flex-grow: 1; - padding: 16px; - gap: 16px; background-color: #223344; + width: 100%; /* force full width */ + max-width: unset; + position: relative; + z-index: 0; } -.sidebar { - width: 155px; - background-color: #f9f9f9; - border-radius: 8px; - padding: 4px; - box-shadow: 0 1px 4px rgba(0,0,0,0.1); -} + + + + .main-panel { flex: 1; background-color: #ffffff; - border-radius: 10px; - padding: 20px; + border-radius: 0 0 10px 10px; + padding: 0px; box-shadow: 0 4px 12px rgba(0,0,0,0.15); display: flex; flex-direction: column; @@ -173,11 +173,20 @@ body { color: #2C3E50; font-size: 16px; line-height: 1.7; + margin-top: 0; } /* ========================================================================== NAVIGATIONSLISTA � KOMPAKT STIL ========================================================================== */ + +/*.sidebar { + width: 155px; + background-color: #f9f9f9; + border-radius: 8px; + padding: 4px; + box-shadow: 0 1px 4px rgba(0,0,0,0.1); +} .nav-list { list-style: none; padding: 0; @@ -210,6 +219,70 @@ body { width: 14px; text-align: center; } + */ + +.main-nav { + position: fixed; + top: 54px; + left: 0; + right: 0; + z-index: 2000; /* Högt nog för att ligga över allt annat */ + background-color: #f3f4f6; + box-shadow: 0 1px 2px rgba(0,0,0,0.1); + padding: 5px 8px; + font-size: 13px; + overflow-x: auto; /* behåll för horisontell scroll */ + overflow-y: visible; /* tillåt dropdown att spilla ut */ +} + + + + +@media (min-width: 769px) { + .main-nav { + position: fixed; + top: 54px; + left: 0; + right: 0; + z-index: 1001; + } + + .main-panel { + margin-top: 24px; /* justera beroende på hur hög nav-baren är */ + } +} + + +.nav-list-horizontal { + display: flex; + flex-wrap: nowrap; + gap: 5px 0px 0px 0px; + margin: 5px 0px 0px 0px; + padding: 0; + list-style: none; + white-space: nowrap; + /* Viktigt: ta bort all overflow här */ + overflow: visible; + position: relative; + z-index: 1; +} + + .nav-list-horizontal li a { + text-decoration: none; + color: #1F2C3C; + padding: 0px 5px; + border-radius: 4px; + font-weight: 500; + font-size: 14px; + display: flex; + align-items: center; + gap: 5px; + transition: background-color 0.2s; + } + + .nav-list-horizontal li a:hover { + background-color: #e5e7eb; + } /* ========================================================================== RESPONSIVT @@ -223,3 +296,70 @@ body { width: 100%; } } + +/* ========================================================================== + Dropdown + ========================================================================== */ + +.dropdown { + position: relative; +} + +.dropdown-toggle { + font-family: inherit; + font-size: 14px; + font-weight: 500; + color: #1F2C3C; + padding: 0px 5px; + border: none; + background: none; + display: flex; + align-items: center; + gap: 5px; + cursor: pointer; + border-radius: 4px; + transition: background-color 0.2s; + height: 100%; /* viktigt för vertikal alignment */ +} + + .dropdown-toggle:hover { + background-color: #e5e7eb; + } + +.dropdown-menu { + position: absolute; + top: 100%; + left: 0; + transform: translateY(4px); /* lite spacing nedåt */ + background-color: #ffffff; + border: 1px solid #ccc; + box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15); + border-radius: 8px; + display: none; + flex-direction: column; + min-width: 180px; + z-index: 3000; + padding: 4px 0; + font-size: 14px; +} + + +.dropdown.open .dropdown-menu { + display: flex; +} +.dropdown-menu li { + list-style: none; +} + +.dropdown-menu li a { + padding: 8px 12px; + font-size: 13px; + color: #1F2C3C; + text-decoration: none; + display: block; +} + + .dropdown-menu li a:hover { + background-color: #f0f0f0; + } + diff --git a/Aberwyn/wwwroot/js/budget.js b/Aberwyn/wwwroot/js/budget.js index 8417002..e1c0aef 100644 --- a/Aberwyn/wwwroot/js/budget.js +++ b/Aberwyn/wwwroot/js/budget.js @@ -2,7 +2,7 @@ console.log("budget.js loaded"); app.controller('BudgetController', function ($scope, $http) { $scope.budget = null; - $scope.loading = false; + $scope.loading = true; $scope.error = null; $scope.menuOpen = false; $scope.chartMode = "pie"; @@ -823,7 +823,7 @@ $scope.addItemFromDefinition = function (cat) { }); }; - + $scope.loading = true; $scope.loadItemDefinitions().then(() => { $scope.loadBudget(); }); diff --git a/Aberwyn/wwwroot/js/menu.js b/Aberwyn/wwwroot/js/menu.js index 1690db3..9394bcd 100644 --- a/Aberwyn/wwwroot/js/menu.js +++ b/Aberwyn/wwwroot/js/menu.js @@ -94,8 +94,13 @@ angular.module('mealMenuApp', ['ngSanitize']) $scope.openMeal = function (mealId) { - if (!mealId) return; - window.open('/Meal/View/' + mealId, '_blank'); + if (mealId) { + const page = document.querySelector('.meal-menu-page'); + page.classList.add('fade-out'); + setTimeout(() => { + window.location.href = "/Meal/View/" + mealId; + }, 400); // matchar CSS-transition + } }; $scope.getDayImage = function (day) {