diff --git a/app/components/TimeElapsed.tsx b/app/components/TimeElapsed.tsx
index ae0aa53..8e2c5f9 100644
--- a/app/components/TimeElapsed.tsx
+++ b/app/components/TimeElapsed.tsx
@@ -1,3 +1,4 @@
+import { Box, MediaQuery } from '@mantine/core';
import React, { useState, useEffect } from 'react';
export interface Props {
@@ -33,8 +34,8 @@ const TimeElapsed = ({ startTime, endTime }: Props) => {
.padStart(2, '0')}`;
return (
- {
>
{hoursString}
-
-
- {Intl.DateTimeFormat('it-IT', {
- hour: '2-digit',
- minute: '2-digit',
- hour12: false
- }).format(new Date(startTime))}
-
-
-
- {endTime
- ? Intl.DateTimeFormat('it-IT', {
- hour: '2-digit',
- minute: '2-digit',
- hour12: false
- }).format(new Date(endTime))
- : 'now'}
-
-
-
+
+ {Intl.DateTimeFormat('it-IT', {
+ hour: '2-digit',
+ minute: '2-digit',
+ hour12: false
+ }).format(new Date(startTime))}
+
+
+
+ {endTime
+ ? Intl.DateTimeFormat('it-IT', {
+ hour: '2-digit',
+ minute: '2-digit',
+ hour12: false
+ }).format(new Date(endTime))
+ : 'now'}
+
+
+
+
);
};
diff --git a/app/root.tsx b/app/root.tsx
index 4858898..ea1459f 100644
--- a/app/root.tsx
+++ b/app/root.tsx
@@ -126,6 +126,17 @@ function Document({
+
+
+
+
+
{title ? {title} : null}
@@ -355,7 +366,7 @@ function Layout({ children }: React.PropsWithChildren<{}>) {
({
display: 'block',
width: '100%',
@@ -379,7 +390,7 @@ function Layout({ children }: React.PropsWithChildren<{}>) {
- Import
+ Import/Export
({
alignItems: 'center',
- flexDirection: 'column'
- }}
+ justifyContent: 'space-between',
+ flexDirection: 'row'
+ })}
>
- ({
display: 'flex',
- alignItems: 'center',
+ alignItems: 'flex-start',
+ flexDirection: 'column',
justifyContent: 'space-between',
- width: '100%'
- }}
+ flexGrow: 1,
+ width: '100%',
+
+ '@media (min-width: 601px)': {
+ alignItems: 'center',
+ flexDirection: 'row'
+ }
+ })}
>
-
{timeEntry.description}
-
+
{timeEntry.projectId && timeEntry.project && (
{timeEntry.project.name}
)}
+
+
-
- {timeEntry.endTime ? (
-
- ) : (
-
- )}
-