aboutsummaryrefslogtreecommitdiffstats
path: root/src/views
diff options
context:
space:
mode:
Diffstat (limited to 'src/views')
-rw-r--r--src/views/ChoreEdit/ChoreView.jsx106
-rw-r--r--src/views/Landing/FeaturesSection.jsx27
-rw-r--r--src/views/Landing/Footer.jsx127
-rw-r--r--src/views/Landing/Landing.jsx14
-rw-r--r--src/views/components/NavBar.jsx10
5 files changed, 239 insertions, 45 deletions
diff --git a/src/views/ChoreEdit/ChoreView.jsx b/src/views/ChoreEdit/ChoreView.jsx
index df45aa7..9e3357b 100644
--- a/src/views/ChoreEdit/ChoreView.jsx
+++ b/src/views/ChoreEdit/ChoreView.jsx
@@ -3,15 +3,19 @@ import {
CancelScheduleSend,
Check,
Checklist,
+ Edit,
+ History,
Note,
PeopleAlt,
Person,
+ Timelapse,
} from '@mui/icons-material'
import {
Box,
Button,
Card,
Checkbox,
+ Chip,
Container,
FormControl,
Grid,
@@ -84,21 +88,24 @@ const ChoreView = () => {
const generateInfoCards = chore => {
const cards = [
+ // {
+ // size: 6,
+ // icon: <CalendarMonth />,
+ // text: 'Due Date',
+ // subtext: moment(chore.nextDueDate).format('MM/DD/YYYY hh:mm A'),
+ // },
{
- icon: <CalendarMonth />,
- text: 'Due Date',
- subtext: moment(chore.nextDueDate).format('MM/DD/YYYY hh:mm A'),
- },
- {
+ size: 6,
icon: <PeopleAlt />,
text: 'Assigned To',
subtext: performers.find(p => p.id === chore.assignedTo)?.displayName,
},
- {
- icon: <Person />,
- text: 'Created By',
- subtext: performers.find(p => p.id === chore.createdBy)?.displayName,
- },
+ // {
+ // size: 6,
+ // icon: <Person />,
+ // text: 'Created By',
+ // subtext: performers.find(p => p.id === chore.createdBy)?.displayName,
+ // },
// {
// icon: <TextFields />,
// text: 'Frequency',
@@ -107,20 +114,23 @@ const ChoreView = () => {
// chore.frequencyType.slice(1),
// },
{
+ size: 6,
icon: <Checklist />,
- text: 'Total Completed',
- subtext: `${chore.totalCompletedCount}`,
+ text: 'Completed',
+ subtext: `${chore.totalCompletedCount} times`,
},
- // {
- // icon: <Timelapse />,
- // text: 'Last Completed',
- // subtext:
- // chore.lastCompletedDate &&
- // moment(chore.lastCompletedDate).format('MM/DD/YYYY hh:mm A'),
- // },
{
+ size: 6,
+ icon: <Timelapse />,
+ text: 'Last time',
+ subtext:
+ chore.lastCompletedDate &&
+ moment(chore.lastCompletedDate).format('MM/DD/YYYY hh:mm A'),
+ },
+ {
+ size: 6,
icon: <Person />,
- text: 'Last Completed',
+ text: 'Last',
subtext: chore.lastCompletedDate
? `${
chore.lastCompletedDate &&
@@ -132,6 +142,7 @@ const ChoreView = () => {
: 'Never',
},
{
+ size: 12,
icon: <Note />,
text: 'Recent Note',
subtext: chore.notes || '--',
@@ -195,22 +206,43 @@ const ChoreView = () => {
justifyContent: 'space-between',
}}
>
- <Box>
+ <Box
+ sx={{
+ display: 'flex',
+ flexDirection: 'column',
+ justifyContent: 'center',
+ alignItems: 'center',
+ textAlign: 'center',
+ }}
+ >
<Typography
level='h3'
- textAlign={'center'}
+ // textAlign={'center'}
sx={{
mt: 2,
- mb: 4,
+ mb: 1,
}}
>
{chore.name}
</Typography>
-
+ <Chip startDecorator={<CalendarMonth />} size='lg' sx={{ mb: 4 }}>
+ {chore.nextDueDate
+ ? `Due at ${moment(chore.nextDueDate).format('MM/DD/YYYY hh:mm A')}`
+ : 'N/A'}
+ </Chip>
+ </Box>
+ <Box>
<Grid container spacing={1}>
{infoCards.map((info, index) => (
- <Grid key={index} item xs={12} sm={6}>
- <Sheet sx={{ mb: 1, borderRadius: 'md', p: 1, boxShadow: 'sm' }}>
+ <Grid key={index} item xs={info.size} sm={info.size}>
+ <Sheet
+ sx={{
+ mb: 1,
+ borderRadius: 'lg',
+ p: 1,
+ boxShadow: 'sm',
+ }}
+ >
<ListItem>
<ListItemDecorator>
<IconCard>{info.icon}</IconCard>
@@ -227,6 +259,28 @@ const ChoreView = () => {
</Sheet>
</Grid>
))}
+ <Grid item xs={6}>
+ <Button
+ startDecorator={<History />}
+ size='lg'
+ color='success'
+ variant='outlined'
+ fullWidth
+ >
+ History
+ </Button>
+ </Grid>
+ <Grid item xs={6}>
+ <Button
+ startDecorator={<Edit />}
+ size='lg'
+ color='success'
+ variant='outlined'
+ fullWidth
+ >
+ Edit
+ </Button>
+ </Grid>
</Grid>
</Box>
{/* <Divider
diff --git a/src/views/Landing/FeaturesSection.jsx b/src/views/Landing/FeaturesSection.jsx
index 4133d0a..32dcbc8 100644
--- a/src/views/Landing/FeaturesSection.jsx
+++ b/src/views/Landing/FeaturesSection.jsx
@@ -25,44 +25,39 @@ const FeatureIcon = styled('div')({
const CardData = [
{
title: 'Open Source & Transparent',
- headline: 'Built for the Community',
+
description:
- 'Donetick is a community-driven, open-source project. Contribute, customize, and make task management truly yours.',
+ 'Donetick is open source software. You can view, modify, and contribute to the code on GitHub.',
icon: CodeRounded,
},
{
title: 'Circles: Your Task Hub',
- headline: 'Share & Conquer Together',
description:
- 'Create circles for your family, friends, or team. Easily share tasks and track progress within each group.',
+ 'build with sharing in mind. invite other to the circle and you can assign tasks to each other. and only see the tasks the should be shared',
icon: GroupRounded,
},
{
title: 'Track Your Progress',
- headline: "See Who's Done What",
description:
- 'View a history of task completion for each member of your circles. Celebrate successes and stay on top of your goals.',
+ 'View a history of completed tasks. or use things to track simply things!',
icon: HistoryRounded,
},
{
- title: 'Automated Chore Scheduling',
- headline: 'Fully Customizable Recurring Tasks',
+ title: 'Automated Task Scheduling',
description:
- 'Set up chores to repeat daily, weekly, or monthly. Donetick will automatically assign and track each task for you.',
+ 'Set up Tasks to repeat daily, weekly, or monthly, or maybe specifc day in specifc months? Donetick have a flexible scheduling system',
icon: AutoAwesomeMosaicOutlined,
},
{
title: 'Automated Task Assignment',
- headline: 'Share Responsibilities Equally',
description:
- 'can automatically assigns tasks to each member of your circle. Randomly or based on past completion.',
+ 'For shared tasks, Donetick can randomly rotate assignments or choose based on last completion or least assigned.',
icon: AutoAwesomeRounded,
},
{
title: 'Integrations & Webhooks',
- headline: 'API & 3rd Party Integrations',
description:
- 'Connect Donetick with your favorite apps and services. Trigger tasks based on events from other platforms.',
+ 'Donetick can update things programmatically with API call. you can update things from other services like IFTTT, Homeassistant or even your own service',
icon: Webhook,
},
]
@@ -80,7 +75,7 @@ function Feature2({ icon: Icon, title, headline, description, index }) {
<FeatureIcon>
<Icon
color='primary'
- style={{ Width: '30px', height: '30px' }}
+ style={{ Width: '30px', height: '30px', fontSize: '30px' }}
stroke={1.5}
/>
</FeatureIcon>
@@ -106,7 +101,7 @@ function FeaturesSection() {
<Feature2
icon={feature.icon}
title={feature.title}
- headline={feature.headline}
+ // headline={feature.headline}
description={feature.description}
index={index}
key={index}
@@ -128,7 +123,7 @@ function FeaturesSection() {
</Container>
<Typography level='h4' mt={2} mb={4}>
- Features Overview
+ Why Donetick?
</Typography>
<Container maxWidth={'lg'} sx={{ mb: 8 }}></Container>
diff --git a/src/views/Landing/Footer.jsx b/src/views/Landing/Footer.jsx
new file mode 100644
index 0000000..11a011a
--- /dev/null
+++ b/src/views/Landing/Footer.jsx
@@ -0,0 +1,127 @@
+import LogoSVG from '@/assets/logo.svg'
+import { Card, Grid } from '@mui/joy'
+import Box from '@mui/joy/Box'
+import Link from '@mui/joy/Link'
+import Typography from '@mui/joy/Typography'
+import * as React from 'react'
+
+function Footer() {
+ return (
+ <Card
+ data-aos-landing-footer
+ data-aos-delay={200}
+ data-aos-anchor='[data-aos-landing-footer]'
+ data-aos='zoom-in-up'
+ >
+ <Grid
+ container
+ component='footer'
+ sx={{
+ display: 'flex',
+ justifyContent: 'space-around',
+ p: 4,
+ // borderTop: '1px solid',
+ bottom: 0,
+ width: '100%',
+ }}
+ >
+ <Box sx={{ display: 'flex', alignItems: 'center' }}>
+ <div className='logo'>
+ <img src={LogoSVG} alt='logo' width='64px' height='64px' />
+ </div>
+ <Box className='flex items-center gap-2'>
+ <Typography
+ level='title-lg'
+ sx={{
+ fontWeight: 700,
+ fontSize: 24,
+ }}
+ >
+ Done
+ <span
+ style={{
+ color: '#06b6d4',
+ fontWeight: 600,
+ }}
+ >
+ tick✓
+ </span>
+ </Typography>
+ <span
+ style={{
+ fontSize: 12,
+ fontWeight: 700,
+ position: 'relative',
+ top: 12,
+ right: 45,
+ }}
+ >
+ Beta
+ </span>
+ </Box>
+ </Box>
+ <Box>
+ <Typography level='body2' fontWeight='bold' mb={1}>
+ Github
+ </Typography>
+ <Link
+ href='https://github.com/donetick/core'
+ level='body2'
+ sx={{ display: 'block' }}
+ >
+ Core(Backend)
+ </Link>
+ <Link
+ href='https://github.com/donetick/frontend'
+ level='body2'
+ sx={{ display: 'block' }}
+ >
+ Frontend
+ </Link>
+ <Link
+ href='https://github.com/donetick/hassio-addons'
+ level='body2'
+ sx={{ display: 'block' }}
+ >
+ Home Assistant Addon
+ </Link>
+ <Link
+ href='https://github.com/orgs/Donetick/packages'
+ level='body2'
+ sx={{ display: 'block' }}
+ >
+ Packages
+ </Link>
+ </Box>
+ <Box>
+ <Typography level='body2' fontWeight='bold' mb={1}>
+ Links
+ </Typography>
+
+ <Link disabled={true} level='body2' sx={{ display: 'block' }}>
+ Roadmap(soon)
+ </Link>
+ <Link disabled={true} level='body2' sx={{ display: 'block' }}>
+ Documentation(soon)
+ </Link>
+ <Link disabled={true} level='body2' sx={{ display: 'block' }}>
+ Changelog(soon)
+ </Link>
+ </Box>
+ {/* <Box>
+ <Typography level='body2' fontWeight='bold' mb={1}>
+ Others
+ </Typography>
+ <Link href='#' level='body2' sx={{ display: 'block' }}>
+ Telegram Integration
+ </Link>
+ <Link href='#' level='body2' sx={{ display: 'block' }}>
+ Slash Commands
+ </Link>
+ </Box> */}
+ </Grid>
+ </Card>
+ )
+}
+
+export default Footer
diff --git a/src/views/Landing/Landing.jsx b/src/views/Landing/Landing.jsx
index a8b650d..4ca1b60 100644
--- a/src/views/Landing/Landing.jsx
+++ b/src/views/Landing/Landing.jsx
@@ -1,4 +1,4 @@
-import { Container, Grid } from '@mui/joy'
+import { Box, Container, Grid } from '@mui/joy'
import AOS from 'aos'
import 'aos/dist/aos.css'
import { useEffect } from 'react'
@@ -8,6 +8,7 @@ import DemoHistory from './DemoHistory'
import DemoMyChore from './DemoMyChore'
import DemoScheduler from './DemoScheduler'
import FeaturesSection from './FeaturesSection'
+import Footer from './Footer'
import HomeHero from './HomeHero'
const Landing = () => {
const Navigate = useNavigate()
@@ -39,6 +40,17 @@ const Landing = () => {
</Grid>
<FeaturesSection />
{/* <PricingSection /> */}
+ <Box
+ sx={{
+ display: 'flex',
+ justifyContent: 'center',
+ alignItems: 'center',
+ mt: 5,
+ mb: 5,
+ }}
+ ></Box>
+
+ <Footer />
</Container>
)
}
diff --git a/src/views/components/NavBar.jsx b/src/views/components/NavBar.jsx
index 2da09f5..d3708ae 100644
--- a/src/views/components/NavBar.jsx
+++ b/src/views/components/NavBar.jsx
@@ -21,7 +21,7 @@ import {
Typography,
} from '@mui/joy'
import { useState } from 'react'
-import { useLocation } from 'react-router-dom'
+import { useLocation, useNavigate } from 'react-router-dom'
import { version } from '../../../package.json'
import NavBarLink from './NavBarLink'
const links = [
@@ -63,6 +63,7 @@ const links = [
]
const NavBar = () => {
+ const navigate = useNavigate()
const [drawerOpen, setDrawerOpen] = useState(false)
const [openDrawer, closeDrawer] = [
() => setDrawerOpen(true),
@@ -89,7 +90,12 @@ const NavBar = () => {
<IconButton size='sm' variant='plain' onClick={() => setDrawerOpen(true)}>
<MenuRounded />
</IconButton>
- <Box className='flex items-center gap-2'>
+ <Box
+ className='flex items-center gap-2'
+ onClick={() => {
+ navigate('/my/chores')
+ }}
+ >
<img component='img' src={Logo} width='34' />
<Typography
level='title-lg'
generated by cgit (git 2.34.1) at 2024-11-21 21:49:50 +0000