Skip to content

Commit f0b19dd

Browse files
hidaytrahmanhidaytrahman
authored
Merge pull request #6 from hidaytrahman/feature_editors
Feature editors
2 parents d329f20 + a8aa197 commit f0b19dd

File tree

17 files changed

+429
-83
lines changed

17 files changed

+429
-83
lines changed

‎src/app/browsers/page.tsx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import Browsers from '@/src/components/features/browsers/browsers';
2+
3+
export default function BrowsersPage() {
4+
return <Browsers />;
5+
}

‎src/app/editors/page.tsx‎

Lines changed: 3 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,5 @@
1+
import Editors from '@/src/components/features/editors/Editors';
2+
13
export default function EditorPage() {
2-
return (
3-
<main className='flex min-h-screen flex-col items-center justify-between p-24'>
4-
<div className='z-10 max-w-5xl w-full items-center justify-between font-mono text-sm lg:flex'>
5-
<p className='fixed left-0 top-0 flex w-full justify-center border-b border-gray-300 bg-gradient-to-b from-zinc-200 pb-6 pt-8 backdrop-blur-2xl dark:border-neutral-800 dark:bg-zinc-800/30 dark:from-inherit lg:static lg:w-auto lg:rounded-xl lg:border lg:bg-gray-200 lg:p-4 lg:dark:bg-zinc-800/30'>
6-
Hidaytsss
7-
</p>
8-
</div>
9-
</main>
10-
);
4+
return <Editors />;
115
}

‎src/app/layout.tsx‎

Lines changed: 19 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,24 @@
1-
import type { Metadata } from 'next'
2-
import { Inter } from 'next/font/google'
3-
import './globals.css'
1+
import type { Metadata } from 'next';
2+
import { Inter } from 'next/font/google';
3+
import './globals.css';
4+
import Header from '../components/layout/Header/Header';
5+
import Footer from '../components/layout/Footer/Footer';
46

5-
const inter = Inter({ subsets: ['latin'] })
7+
const inter = Inter({ subsets: ['latin'] });
68

79
export const metadata: Metadata = {
8-
title: 'Create Next App',
9-
description: 'Generated by create next app',
10-
}
10+
title: 'Codeeng',
11+
description: 'Code environment basic and required setup for your project or new machine.',
12+
};
1113

12-
export default function RootLayout({
13-
children,
14-
}: {
15-
children: React.ReactNode
16-
}) {
17-
return (
18-
<html lang="en">
19-
<body className={inter.className}>{children}</body>
20-
</html>
21-
)
14+
export default function RootLayout({ children }: { children: React.ReactNode }) {
15+
return (
16+
<html lang='en'>
17+
<body className={inter.className}>
18+
<Header />
19+
<article className='min-h-screen'>{children}</article>
20+
<Footer />
21+
</body>
22+
</html>
23+
);
2224
}

‎src/app/page.tsx‎

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,18 @@
1-
import Header from '@/src/components/Header';
2-
import Editor from '@/src/components/features/editor/Editor';
3-
import { browsers } from '@/src/data';
4-
import EntityBrowserItem from '../components/common/EntityBrowserItem/EntityBrowserItem';
1+
import Editor from '@/src/components/features/editors/Editors';
52
import Browsers from '../components/features/browsers/browsers';
3+
import Banner from '../components/core/Banner';
64

75
export default function Home() {
86
return (
9-
<main className='flex min-h-screen flex-col items-center justify-between p-24'>
10-
<Header />
11-
<br />
12-
<Browsers />
13-
<Editor />
7+
<main>
8+
<article className=''>
9+
<Banner
10+
titles={['Code environment basic', ' and required setup']}
11+
text="At Codeeng, we believe in empowering developers by providing a comprehensive resource hub for setting up and optimizing coding environments. Whether you're a seasoned developer or just starting your coding journey, our platform is designed to guide you through essential installations and configurations to create a seamless coding experience"
12+
/>
13+
{/* <Browsers />
14+
<Editor /> */}
15+
</article>
1416
</main>
1517
);
1618
}

‎src/components/Header.tsx‎

Lines changed: 0 additions & 14 deletions
This file was deleted.

‎src/components/common/Alert/Alert.tsx‎

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
import React from 'react';
2+
3+
function Alert() {
4+
return (
5+
<div role='alert' className='rounded-xl border border-gray-100 bg-white p-4'>
6+
<div className='flex items-start gap-4'>
7+
<span className='text-green-600'>
8+
<svg
9+
xmlns='http://www.w3.org/2000/svg'
10+
fill='none'
11+
viewBox='0 0 24 24'
12+
strokeWidth='1.5'
13+
stroke='currentColor'
14+
className='h-6 w-6'
15+
>
16+
<path
17+
strokeLinecap='round'
18+
strokeLinejoin='round'
19+
d='M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z'
20+
/>
21+
</svg>
22+
</span>
23+
24+
<div className='flex-1'>
25+
<strong className='block font-medium text-gray-900'> Changes saved </strong>
26+
27+
<p className='mt-1 text-sm text-gray-700'>Your product changes have been saved.</p>
28+
</div>
29+
30+
<button className='text-gray-500 transition hover:text-gray-600'>
31+
<span className='sr-only'>Dismiss popup</span>
32+
33+
<svg
34+
xmlns='http://www.w3.org/2000/svg'
35+
fill='none'
36+
viewBox='0 0 24 24'
37+
strokeWidth='1.5'
38+
stroke='currentColor'
39+
className='h-6 w-6'
40+
>
41+
<path strokeLinecap='round' strokeLinejoin='round' d='M6 18L18 6M6 6l12 12' />
42+
</svg>
43+
</button>
44+
</div>
45+
</div>
46+
);
47+
}
48+
49+
export default Alert;

‎src/components/common/EntityBrowserItem/EntityBrowserItem.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,10 @@ export default function EntityBrowserItem({ title, link, info, avatar }: CardPro
1919
</h5>
2020

2121
<p className='mb-3 font-normal text-gray-500 dark:text-gray-400'>{info}</p>
22-
<Anchor link={link} />
22+
23+
<div className='shrink-0 p-2 flex items-center justify-center'>
24+
<Anchor link={link} />
25+
</div>
2326
</div>
2427
</div>
2528
);

‎src/components/core/Banner.tsx‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
import React from 'react';
2+
3+
type BannerPropsTypes = {
4+
titles: string[];
5+
text: string;
6+
};
7+
8+
function Banner({ titles, text }: BannerPropsTypes) {
9+
return (
10+
<section className='bg-gray-50'>
11+
<div className='mx-auto max-w-screen-xl px-4 py-32 lg:flex lg:h-screen lg:items-center'>
12+
<div className='mx-auto max-w-3xl text-center'>
13+
<h1 className='text-3xl font-extrabold sm:text-5xl'>
14+
{titles[0]}
15+
<strong className='font-extrabold text-red-700 sm:block'> {titles[1]}</strong>
16+
</h1>
17+
18+
<p className='mt-4 sm:text-l/relaxed'>{text}</p>
19+
20+
<div className='mt-8 flex flex-wrap justify-center gap-4'>
21+
<a
22+
className='block w-full rounded bg-red-600 px-12 py-3 text-sm font-medium text-white shadow hover:bg-red-700 focus:outline-none focus:ring active:bg-red-500 sm:w-auto'
23+
href='/get-started'
24+
>
25+
Get Started
26+
</a>
27+
28+
<a
29+
className='block w-full rounded px-12 py-3 text-sm font-medium text-red-600 shadow hover:text-red-700 focus:outline-none focus:ring active:text-red-500 sm:w-auto'
30+
href='/about'
31+
>
32+
Learn More
33+
</a>
34+
</div>
35+
</div>
36+
</div>
37+
</section>
38+
);
39+
}
40+
41+
export default Banner;

‎src/components/features/browsers/browsers.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ function Browsers() {
3838
<Skeleton type='image' />
3939
</div>
4040
) : null}
41-
<div className='flex gap-3'>
41+
<div className='flex gap-3 flex-wrap'>
4242
{browsers?.map((browser: any, index) => (
4343
<EntityBrowserItem
4444
key={browser.id}

src/components/features/editor/Editor.tsx renamed to src/components/features/editors/Editors.tsx

Lines changed: 35 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,9 @@ import axios from 'axios';
55
import { useEffect, useState } from 'react';
66
import Skeleton from '../../common/Skeleton/Skeleton';
77
import Anchor from '../../core/Anchor';
8+
import { Editor } from './types';
89

9-
function Editor() {
10+
function Editors() {
1011
const [editors, setEditors] = useState([]);
1112
const [loading, setLoading] = useState(false);
1213

@@ -28,11 +29,11 @@ function Editor() {
2829
}, []);
2930

3031
return (
31-
<section className='mt-10'>
32+
<section className='mt-10 p-10'>
3233
<h3 className='text-2xl mb-3 font-bold leading-7 text-gray-900'>Editors</h3>
3334
{loading ? <Skeleton type='image' /> : null}
34-
{editors?.map(({ title, link, extensions, avatar }, index) => (
35-
<div className='capitlise' key={index}>
35+
{editors?.map(({ title, link, extensions, avatar }: Editor, index) => (
36+
<div className='capitlise p-2' key={index}>
3637
<div className='flex items-center justify-between gap-2 mb-5'>
3738
<div className='flex items-center gap-4'>
3839
<div className='shrink-0 flex items-center justify-center h-20 w-20 rounded bg-white border border-slate-200'>
@@ -43,37 +44,39 @@ function Editor() {
4344
<Anchor link={link} />
4445
</div>
4546

46-
<EntityExtendMore
47-
sections={[
48-
{
49-
icon: 'anything',
50-
title: 'Extensions',
51-
text: '',
52-
list: extensions,
53-
},
54-
// {
55-
// icon: 'anything',
56-
// title: 'Flows',
57-
// text: '',
58-
// list: [
59-
// {
60-
// icon: 'anything',
61-
// title: 'Analytics',
62-
// text: 'Everything counts. And everything that counts shapes us.',
63-
// },
64-
// {
65-
// icon: 'anything',
66-
// title: 'Transform',
67-
// text: 'Everything counts. And everything that counts shapes us.',
68-
// },
69-
// ],
70-
// },
71-
]}
72-
/>
47+
{extensions?.length > 0 ? (
48+
<EntityExtendMore
49+
sections={[
50+
{
51+
icon: 'anything',
52+
title: 'Extensions',
53+
text: '',
54+
list: extensions,
55+
},
56+
// {
57+
// icon: 'anything',
58+
// title: 'Flows',
59+
// text: '',
60+
// list: [
61+
// {
62+
// icon: 'anything',
63+
// title: 'Analytics',
64+
// text: 'Everything counts. And everything that counts shapes us.',
65+
// },
66+
// {
67+
// icon: 'anything',
68+
// title: 'Transform',
69+
// text: 'Everything counts. And everything that counts shapes us.',
70+
// },
71+
// ],
72+
// },
73+
]}
74+
/>
75+
) : null}
7376
</div>
7477
))}
7578
</section>
7679
);
7780
}
7881

79-
export default Editor;
82+
export default Editors;

0 commit comments

Comments
 (0)