Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Vaisali #1

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 26 additions & 0 deletions pages/blog.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import React from 'react';
import 'tailwindcss/tailwind.css';

const Blog = () => {
const posts = [
{ id: 1, title: 'First Post', content: 'This is the content of the first post.' },
{ id: 2, title: 'Second Post', content: 'This is the content of the second post.' },
{ id: 3, title: 'Third Post', content: 'This is the content of the third post.' },
];

return (
<div>
<h1 className='text-3xl'>Blog</h1>
<br/>
{posts.map(post => (
<div key={post.id}>
<h2 className='text-2xl'>{post.title}</h2>
<p>{post.content}</p>
<br/>
</div>
))}
</div>
);
};

export default Blog;
114 changes: 18 additions & 96 deletions pages/index.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import Image from "next/image";
import localFont from "next/font/local";
import MyPage from './page';

const geistSans = localFont({
src: "./fonts/GeistVF.woff",
Expand All @@ -12,104 +13,25 @@ const geistMono = localFont({
weight: "100 900",
});


export default function Home() {
return (
<div
className={`${geistSans.variable} ${geistMono.variable} grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20 font-[family-name:var(--font-geist-sans)]`}
>
<main className="flex flex-col gap-8 row-start-2 items-center sm:items-start">
<Image
className="dark:invert"
src="/next.svg"
alt="Next.js logo"
width={180}
height={38}
priority
/>
<ol className="list-inside list-decimal text-sm text-center sm:text-left font-[family-name:var(--font-geist-mono)]">
<li className="mb-2">
Get started by editing{" "}
<code className="bg-black/[.05] dark:bg-white/[.06] px-1 py-0.5 rounded font-semibold">
pages/index.js
</code>
.
</li>
<li>Save and see your changes instantly.</li>
</ol>

<div className="flex gap-4 items-center flex-col sm:flex-row">
<a
className="rounded-full border border-solid border-transparent transition-colors flex items-center justify-center bg-foreground text-background gap-2 hover:bg-[#383838] dark:hover:bg-[#ccc] text-sm sm:text-base h-10 sm:h-12 px-4 sm:px-5"
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=default-template-tw&utm_campaign=create-next-app"
target="_blank"
rel="noopener noreferrer"
>
<Image
className="dark:invert"
src="/vercel.svg"
alt="Vercel logomark"
width={20}
height={20}
/>
Deploy now
</a>
<a
className="rounded-full border border-solid border-black/[.08] dark:border-white/[.145] transition-colors flex items-center justify-center hover:bg-[#f2f2f2] dark:hover:bg-[#1a1a1a] hover:border-transparent text-sm sm:text-base h-10 sm:h-12 px-4 sm:px-5 sm:min-w-44"
href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=default-template-tw&utm_campaign=create-next-app"
target="_blank"
rel="noopener noreferrer"
>
Read our docs
</a>
</div>
</main>
<footer className="row-start-3 flex gap-6 flex-wrap items-center justify-center">
<a
className="flex items-center gap-2 hover:underline hover:underline-offset-4"
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=default-template-tw&utm_campaign=create-next-app"
target="_blank"
rel="noopener noreferrer"
>
<Image
aria-hidden
src="/file.svg"
alt="File icon"
width={16}
height={16}
/>
Learn
</a>
<a
className="flex items-center gap-2 hover:underline hover:underline-offset-4"
href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=default-template-tw&utm_campaign=create-next-app"
target="_blank"
rel="noopener noreferrer"
>
<Image
aria-hidden
src="/window.svg"
alt="Window icon"
width={16}
height={16}
/>
Examples
</a>
<a
className="flex items-center gap-2 hover:underline hover:underline-offset-4"
href="https://nextjs.org?utm_source=create-next-app&utm_medium=default-template-tw&utm_campaign=create-next-app"
target="_blank"
rel="noopener noreferrer"
>
<Image
aria-hidden
src="/globe.svg"
alt="Globe icon"
width={16}
height={16}
/>
Go to nextjs.org →
</a>
</footer>
<div className="flex items-center justify-center min-h-screen bg-gray-100">
<a href="/page" className="
px-6 py-3
text-white
font-semibold
bg-blue-500
rounded-lg
shadow-lg
transform
ease-in-out
hover:-translate-y-1
hover:scale-105
"
>
PAGES
</a>
</div>
);
}
21 changes: 21 additions & 0 deletions pages/page.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import React from 'react';

const MyPage = () => {
return (
<div className="flex flex-col items-center justify-center min-h-screen bg-blue-50">
<img
src="/pic.jpg"
alt="Description of image"
className="w-1/3 h-auto rounded-lg shadow-lg border-4 border-blue-500 shadow-xl mb-4 hover:scale-105 hover:shadow-2xl transition-all duration-300"
/>
<h1 className="text-4xl font-bold text-blue-500">Welcome to My Page!</h1>
<p className="text-lg text-gray-500 font-medium italic tracking-wide hover:text-blue-600 transition-colors duration-200">
HOW IS THE TASK??
</p>


</div>
);
};

export default MyPage;
Binary file added public/pic.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading