From 5019c63fa28e41d771e421c7f77f427e5e0ed3b0 Mon Sep 17 00:00:00 2001
From: Pavel Kirilin <kirilin.pav@gmail.com>
Date: Tue, 2 Apr 2024 10:24:42 +0300
Subject: [PATCH] Align page date with app name

---
 src/frontend/src/features/pages/ui/PageDetailHeader.tsx | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/frontend/src/features/pages/ui/PageDetailHeader.tsx b/src/frontend/src/features/pages/ui/PageDetailHeader.tsx
index 65ad10912..b35c42c6c 100644
--- a/src/frontend/src/features/pages/ui/PageDetailHeader.tsx
+++ b/src/frontend/src/features/pages/ui/PageDetailHeader.tsx
@@ -6,6 +6,7 @@ import {
   Typography,
   type TypographyProps,
   styled,
+  Box,
 } from '@mui/material';
 import { useMemo, type FC } from 'react';
 import { Link as RouterLink } from 'react-router-dom';
@@ -29,9 +30,9 @@ export const PageDetailHeader: FC<Props> = ({ page }) => {
   const totalCalories = useMemo(() => notes.reduce((sum, note) => sum + note.calories, 0), [notes]);
 
   return (
-    <>
+    <Box display="flex" alignItems="center" gap={3} width="100%">
       <Tooltip title="Back to pages list">
-        <IconButton edge="start" component={RouterLink} to="/pages" sx={{ marginRight: 1 }}>
+        <IconButton edge="start" component={RouterLink} to="/pages">
           <ArrowBackIcon />
         </IconButton>
       </Tooltip>
@@ -39,6 +40,6 @@ export const PageDetailHeader: FC<Props> = ({ page }) => {
         <TextStyled component="h1">{formatDate(new Date(page.date))}</TextStyled>
         <TextStyled component="span">{totalCalories} kcal</TextStyled>
       </Stack>
-    </>
+    </Box>
   );
 };