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.

Sign up for GitHub

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

Jump to bottom

Clean up 💅🏼 #198

Merged
merged 8 commits into from
Oct 6, 2023
Merged

Clean up 💅🏼 #198

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
deff2d0
Use string literals
delbaoliveira Oct 5, 2023
4937765
Use 666 for evil rabbit
delbaoliveira Oct 5, 2023
c64b03d
Delete extra logo
delbaoliveira Oct 5, 2023
ccd6d01
Use consistent pixels for images
delbaoliveira Oct 5, 2023
a7ecb3a
Update button.tsx
delbaoliveira Oct 5, 2023
8fdb4c1
Merge branch 'main' into example-g8du
delbaoliveira Oct 5, 2023
9b461bb
Merge branch 'main' into example-g8du
delbaoliveira Oct 6, 2023
4a249c6
Fix 666 mistake
delbaoliveira Oct 6, 2023
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
5 changes: 2 additions & 3 deletions dashboard/15-final/app/layout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import clsx from 'clsx';
import '@/app/ui/global.css';
import type { Metadata } from 'next';
import { inter } from '@/app/ui/fonts';
import type { Metadata } from 'next';

export const metadata: Metadata = {
title: 'Create Next App',
Expand All @@ -15,7 +14,7 @@ export default function RootLayout({
}) {
return (
<html lang="en">
<body className={clsx(inter.className, 'antialiased')}>{children}</body>
<body className={`${inter.className} antialiased`}>{children}</body>
</html>
);
}
4 changes: 2 additions & 2 deletions dashboard/15-final/app/lib/dummy-data.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@ const invoices = [
},
{
customer_id: customers[6].id,
amount: 8945,
amount: 666,
status: 'pending',
date: '2023-06-27',
},
Expand All @@ -116,7 +116,7 @@ const invoices = [
},
{
customer_id: customers[5].id,
amount: 8945,
amount: 8546,
status: 'paid',
date: '2023-06-07',
},
Expand Down
15 changes: 8 additions & 7 deletions dashboard/15-final/app/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
import AcmeLogo from '@/app/ui/acme-logo';
import { ArrowRightIcon } from '@heroicons/react/24/outline';
import { lusitana } from '@/app/ui/fonts';
import Image from 'next/image';
import Link from 'next/link';
import { ArrowRightIcon } from '@heroicons/react/24/outline';
export default function Page() {
return (
<main className="flex min-h-screen flex-col p-6">
Expand All @@ -24,24 +24,25 @@ export default function Page() {
</p>
<Link
href="/login"
className="flex items-center gap-5 self-start rounded-lg bg-blue-500 px-6 py-3 text-sm text-white transition-colors hover:bg-blue-400 md:text-base"
className="flex items-center gap-5 self-start rounded-lg bg-blue-500 px-6 py-3 text-sm font-medium text-white transition-colors hover:bg-blue-400 md:text-base"
>
<span>Log in</span> <ArrowRightIcon className="w-5 md:w-6" />
</Link>
</div>
<div className="flex items-center justify-center p-6 md:w-3/5 md:px-28 md:py-12">
{/* Add Hero Images Here */}
<Image
src="/hero.png"
src="/hero-desktop.png"
width={1000}
height={760}
alt="Dashboard Hero"
alt="Screenshots of the dashboard project showing desktop and mobile versions"
className="hidden md:block"
/>
<Image
src="/hero-mobile.png"
width={436}
height={604}
alt="Dashboard Hero"
width={560}
height={620}
alt="Screenshot of the dashboard project showing mobile version"
className="block md:hidden"
/>
</div>
Expand Down
2 changes: 1 addition & 1 deletion dashboard/15-final/app/ui/button.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ export function Button({ children, className, ...rest }: ButtonProps) {
<button
{...rest}
className={clsx(
'flex h-10 items-center rounded-lg bg-blue-600 px-4 text-sm font-medium text-white transition-colors hover:bg-blue-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600',
'flex h-10 items-center rounded-lg bg-blue-500 px-4 text-sm font-medium text-white transition-colors hover:bg-blue-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-500',
className,
)}
>
Expand Down
7 changes: 2 additions & 5 deletions dashboard/15-final/app/ui/dashboard/card.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import {
InboxIcon,
} from '@heroicons/react/24/outline';
import { lusitana } from '@/app/ui/fonts';
import clsx from 'clsx';

const iconMap = {
collected: BanknotesIcon,
Expand All @@ -32,10 +31,8 @@ export default function Card({
<h3 className="ml-2 text-sm font-medium">{title}</h3>
</div>
<p
className={clsx(
lusitana.className,
'truncate rounded-xl bg-white px-4 py-8 text-center text-2xl',
)}
className={`${lusitana.className}
truncate rounded-xl bg-white px-4 py-8 text-center text-2xl`}
>
{value}
</p>
Expand Down
7 changes: 2 additions & 5 deletions dashboard/15-final/app/ui/dashboard/latest-invoices.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ export default async function LatestInvoices({
}) {
return (
<div className="flex w-full flex-col md:col-span-4 lg:col-span-4">
<h2 className={clsx(lusitana.className, 'mb-4 text-xl md:text-2xl')}>
<h2 className={`${lusitana.className} mb-4 text-xl md:text-2xl`}>
Latest Invoices
</h2>
<div className="flex grow flex-col justify-between rounded-xl bg-gray-50 p-4">
Expand Down Expand Up @@ -45,10 +45,7 @@ export default async function LatestInvoices({
</div>
</div>
<p
className={clsx(
lusitana.className,
'truncate text-sm font-medium md:text-base',
)}
className={`${lusitana.className} md:text-base, truncate text-sm font-medium`}
>
{invoice.amount}
</p>
Expand Down
5 changes: 2 additions & 3 deletions dashboard/15-final/app/ui/dashboard/revenue-chart.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import { generateYAxis } from '@/app/lib/utils';
import { fetchRevenue } from '@/app/lib/data';
import { CalendarIcon } from '@heroicons/react/24/outline';
import { lusitana } from '@/app/ui/fonts';
import clsx from 'clsx';
// This component is representational only.
// For data visualization UI, check out:
// https://www.tremor.so/
Expand All @@ -21,7 +20,7 @@ export default async function RevenueChart() {

return (
<div className="w-full md:col-span-4">
<h2 className={clsx(lusitana.className, 'mb-4 text-xl md:text-2xl')}>
<h2 className={`${lusitana.className} mb-4 text-xl md:text-2xl`}>
Recent Revenue
</h2>
<div className="rounded-xl bg-gray-50 p-4">
Expand Down Expand Up @@ -54,7 +53,7 @@ export default async function RevenueChart() {
</div>
<div className="flex items-center pb-2 pt-6">
<CalendarIcon className="h-5 w-5 text-gray-500" />
<h3 className="ml-2 text-sm text-gray-500 ">Last 6 months</h3>
<h3 className="ml-2 text-sm text-gray-500 ">Last 12 months</h3>
</div>
</div>
</div>
Expand Down
11 changes: 6 additions & 5 deletions dashboard/15-final/app/ui/login-form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,10 @@ import { signIn } from 'next-auth/react';
import { useRouter } from 'next/navigation';
import React, { useState } from 'react';
import { lusitana } from '@/app/ui/fonts';
import clsx from 'clsx';
import { AtSymbolIcon, KeyIcon } from '@heroicons/react/24/outline';
import { Button } from './button';
import { ArrowRightIcon } from '@heroicons/react/20/solid';
import { Logo } from './logo';
import AcmeLogo from './acme-logo';

export default function LoginForm() {
const [email, setEmail] = useState('');
Expand Down Expand Up @@ -39,12 +38,14 @@ export default function LoginForm() {
return (
<div className="flex items-center justify-center md:h-screen">
<div className="relative mx-auto flex w-full max-w-[400px] flex-col space-y-2.5 p-4 md:-mt-32">
<div className="flex h-36 w-full items-end rounded-lg bg-blue-500 p-3">
<Logo />
<div className="flex h-20 w-full items-end rounded-lg bg-blue-500 p-3 md:h-36">
<div className="w-32 text-white md:w-36">
<AcmeLogo />
</div>
</div>
<form onSubmit={handleSubmit} className="space-y-3">
<div className="flex-1 rounded-lg bg-gray-50 px-6 pb-6 pt-5">
<h1 className={clsx(lusitana.className, 'mb-3 text-2xl')}>
<h1 className={`${lusitana.className} mb-3 text-2xl`}>
Please log in to continue.
</h1>
<div className="w-full">
Expand Down
46 changes: 0 additions & 46 deletions dashboard/15-final/app/ui/logo.tsx
View file
Open in desktop

This file was deleted.

Binary file added dashboard/15-final/public/hero-desktop.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified dashboard/15-final/public/hero-mobile.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed dashboard/15-final/public/hero.png
View file
Open in desktop
Binary file not shown.
Loading