navbar eklendi
This commit is contained in:
@@ -4,6 +4,12 @@
|
|||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link
|
||||||
|
rel="stylesheet"
|
||||||
|
href="https://fonts.googleapis.com/css2?family=Caudex:wght@700&display=swap"
|
||||||
|
/>
|
||||||
<title>imgPub - PDF OCR Sihirbazı</title>
|
<title>imgPub - PDF OCR Sihirbazı</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
85
src/App.jsx
85
src/App.jsx
@@ -2,9 +2,12 @@ import { Outlet, useLocation, useNavigate } from 'react-router-dom';
|
|||||||
import {
|
import {
|
||||||
Alert,
|
Alert,
|
||||||
Box,
|
Box,
|
||||||
|
Button,
|
||||||
Container,
|
Container,
|
||||||
|
Link,
|
||||||
Paper,
|
Paper,
|
||||||
Snackbar,
|
Snackbar,
|
||||||
|
Stack,
|
||||||
Step,
|
Step,
|
||||||
StepLabel,
|
StepLabel,
|
||||||
Stepper,
|
Stepper,
|
||||||
@@ -39,13 +42,82 @@ const App = () => {
|
|||||||
}, [location.pathname]);
|
}, [location.pathname]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Container maxWidth="lg" sx={{ py: 4 }}>
|
<>
|
||||||
<Box mb={4}>
|
<Box
|
||||||
<Typography variant="h4" gutterBottom sx={{ color: '#29615D', fontWeight: 700 }}>
|
component="header"
|
||||||
imgPub EPUB Sihirbazı
|
sx={{
|
||||||
|
position: 'sticky',
|
||||||
|
top: 0,
|
||||||
|
zIndex: 1200,
|
||||||
|
backgroundColor: '#FFFFFF',
|
||||||
|
borderBottom: '1px solid #E0DFDC',
|
||||||
|
boxShadow: '0 6px 12px rgba(0,0,0,0.04)',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Container maxWidth="lg">
|
||||||
|
<Stack direction="row" alignItems="center" justifyContent="space-between" py={0.5}>
|
||||||
|
<Typography
|
||||||
|
variant="h4"
|
||||||
|
sx={{
|
||||||
|
fontFamily: '"Caudex", serif',
|
||||||
|
color: '#1C1815',
|
||||||
|
fontWeight: 700,
|
||||||
|
letterSpacing: 1,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
imgpub
|
||||||
</Typography>
|
</Typography>
|
||||||
<Typography color="text.secondary">
|
<Stack direction="row" spacing={3} alignItems="center">
|
||||||
Görselleri sırayla işle, OCR ile metne dönüştür ve EPUB formatında indir.
|
<Typography
|
||||||
|
component="button"
|
||||||
|
type="button"
|
||||||
|
sx={{
|
||||||
|
background: 'none',
|
||||||
|
border: 'none',
|
||||||
|
color: '#2F2D28',
|
||||||
|
fontWeight: 600,
|
||||||
|
fontSize: '0.95rem',
|
||||||
|
cursor: 'pointer',
|
||||||
|
textTransform: 'uppercase',
|
||||||
|
letterSpacing: 0.5,
|
||||||
|
transition: 'color 0.2s ease',
|
||||||
|
'&:hover': { color: '#d7b16a' },
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Login
|
||||||
|
</Typography>
|
||||||
|
<Button variant="contained" color="primary" size="small">
|
||||||
|
Sign Up
|
||||||
|
</Button>
|
||||||
|
</Stack>
|
||||||
|
</Stack>
|
||||||
|
</Container>
|
||||||
|
</Box>
|
||||||
|
<Container maxWidth="lg" sx={{ py: 6 }}>
|
||||||
|
<Box mb={5} textAlign="center">
|
||||||
|
<Typography
|
||||||
|
variant="h3"
|
||||||
|
sx={{
|
||||||
|
fontWeight: 700,
|
||||||
|
color: '#1C1815',
|
||||||
|
letterSpacing: -0.5,
|
||||||
|
fontSize: { xs: '1.9rem', md: '2.6rem' },
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Tek ekranda görselden EPUB'a kadar tüm sihirbaz adımları
|
||||||
|
</Typography>
|
||||||
|
<Typography
|
||||||
|
sx={{
|
||||||
|
mt: 1.5,
|
||||||
|
color: '#5A5751',
|
||||||
|
fontSize: { xs: '1rem', md: '1.2rem' },
|
||||||
|
lineHeight: 1.6,
|
||||||
|
maxWidth: 720,
|
||||||
|
mx: 'auto',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Kapak seç, crop alanını belirle, OCR ile Türkçe metinleri koru ve sonucunu tek tıkla EPUB olarak indir.
|
||||||
|
imgpub tüm işlemleri tek bir akışta toplar, hızlı ve modern bir deneyim sunar.
|
||||||
</Typography>
|
</Typography>
|
||||||
</Box>
|
</Box>
|
||||||
<Paper sx={{ p: { xs: 2, md: 4 }, mb: 4 }} elevation={0}>
|
<Paper sx={{ p: { xs: 2, md: 4 }, mb: 4 }} elevation={0}>
|
||||||
@@ -66,6 +138,7 @@ const App = () => {
|
|||||||
</Alert>
|
</Alert>
|
||||||
</Snackbar>
|
</Snackbar>
|
||||||
</Container>
|
</Container>
|
||||||
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
26
src/main.jsx
26
src/main.jsx
@@ -51,8 +51,10 @@ const theme = createTheme({
|
|||||||
borderRadius: 999,
|
borderRadius: 999,
|
||||||
textTransform: 'none',
|
textTransform: 'none',
|
||||||
boxShadow: '0 6px 20px rgba(231, 193, 121, 0.35)',
|
boxShadow: '0 6px 20px rgba(231, 193, 121, 0.35)',
|
||||||
|
transition: 'background-color 0.2s ease, box-shadow 0.2s ease',
|
||||||
'&:hover': {
|
'&:hover': {
|
||||||
backgroundColor: '#d7b16a',
|
backgroundColor: '#d7b16a',
|
||||||
|
boxShadow: 'none',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
@@ -60,9 +62,10 @@ const theme = createTheme({
|
|||||||
MuiPaper: {
|
MuiPaper: {
|
||||||
styleOverrides: {
|
styleOverrides: {
|
||||||
root: {
|
root: {
|
||||||
backgroundColor: '#FAF8F6',
|
backgroundColor: '#FFFFFF',
|
||||||
boxShadow: '0 20px 45px rgba(0,0,0,0.08)',
|
border: '1px solid #D2D2D2',
|
||||||
borderRadius: 24,
|
borderRadius: '1.5px',
|
||||||
|
boxShadow: '0 10px 18px rgba(0,0,0,0.06)',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
@@ -99,6 +102,23 @@ const theme = createTheme({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
MuiStepLabel: {
|
||||||
|
styleOverrides: {
|
||||||
|
label: {
|
||||||
|
backgroundColor: '#FFFFFF',
|
||||||
|
border: '1px solid #D2D2D2',
|
||||||
|
borderRadius: '1.5px',
|
||||||
|
padding: '4px 10px',
|
||||||
|
color: '#1C1815',
|
||||||
|
boxShadow: '0 6px 12px rgba(0,0,0,0.05)',
|
||||||
|
fontWeight: 600,
|
||||||
|
'&.Mui-disabled': {
|
||||||
|
color: '#B5AD9A',
|
||||||
|
opacity: 0.8,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user