diff --git a/public/assets/images/icons/ico-dropdown.png b/public/assets/images/icons/ico-dropdown.png new file mode 100644 index 0000000..a50cc90 Binary files /dev/null and b/public/assets/images/icons/ico-dropdown.png differ diff --git a/public/assets/images/icons/ico-help.png b/public/assets/images/icons/ico-help.png new file mode 100644 index 0000000..0d1f06c Binary files /dev/null and b/public/assets/images/icons/ico-help.png differ diff --git a/public/assets/images/icons/ico-search.png b/public/assets/images/icons/ico-search.png new file mode 100644 index 0000000..daf9acd Binary files /dev/null and b/public/assets/images/icons/ico-search.png differ diff --git a/public/assets/images/img-banner.png b/public/assets/images/img-banner.png new file mode 100644 index 0000000..c893bf7 Binary files /dev/null and b/public/assets/images/img-banner.png differ diff --git a/public/assets/images/img-philippineSeal.png b/public/assets/images/img-philippineSeal.png new file mode 100644 index 0000000..866c5ff Binary files /dev/null and b/public/assets/images/img-philippineSeal.png differ diff --git a/public/assets/images/logo-company.png b/public/assets/images/logo-company.png new file mode 100644 index 0000000..d9d3097 Binary files /dev/null and b/public/assets/images/logo-company.png differ diff --git a/public/assets/images/logo-site.png b/public/assets/images/logo-site.png new file mode 100644 index 0000000..74c3205 Binary files /dev/null and b/public/assets/images/logo-site.png differ diff --git a/public/assets/media/sample-video.mp4 b/public/assets/media/sample-video.mp4 new file mode 100644 index 0000000..942aee1 Binary files /dev/null and b/public/assets/media/sample-video.mp4 differ diff --git a/resources/js/Components/ApplicationLogo.tsx b/resources/js/Components/ApplicationLogo.tsx index 9180a3e..cc22056 100644 --- a/resources/js/Components/ApplicationLogo.tsx +++ b/resources/js/Components/ApplicationLogo.tsx @@ -1,9 +1,14 @@ -import { SVGAttributes } from 'react'; - -export default function ApplicationLogo(props: SVGAttributes) { +export default function ApplicationLogo() { return ( - - - +
+ +
+

DOST - IT Department

+

CodeHub

+
+
); } diff --git a/resources/js/Components/Dropdown.tsx b/resources/js/Components/Dropdown.tsx index 9b30db7..e38514d 100644 --- a/resources/js/Components/Dropdown.tsx +++ b/resources/js/Components/Dropdown.tsx @@ -21,7 +21,7 @@ const Dropdown = ({ children }: PropsWithChildren) => { return ( -
{children}
+
{children}
); }; @@ -83,7 +83,7 @@ const DropdownLink = ({ className = '', children, ...props }: InertiaLinkProps) diff --git a/resources/js/Components/Footer.tsx b/resources/js/Components/Footer.tsx new file mode 100644 index 0000000..3c4ec46 --- /dev/null +++ b/resources/js/Components/Footer.tsx @@ -0,0 +1,146 @@ +import { Link } from '@inertiajs/react'; + +export default function Footer() { + return ( + + ) +} \ No newline at end of file diff --git a/resources/js/Components/NavLink.tsx b/resources/js/Components/NavLink.tsx index 5824835..18290f7 100644 --- a/resources/js/Components/NavLink.tsx +++ b/resources/js/Components/NavLink.tsx @@ -5,10 +5,12 @@ export default function NavLink({ active = false, className = '', children, ...p diff --git a/resources/js/Components/ProjectBanner.tsx b/resources/js/Components/ProjectBanner.tsx new file mode 100644 index 0000000..208d890 --- /dev/null +++ b/resources/js/Components/ProjectBanner.tsx @@ -0,0 +1,10 @@ +export default function ProjectBanner() { + return ( +
+ CodeHub Logo +

Project CodeHub

+

The instructions and source codes repository for the
DOST - IT Department

+
+ ) +} \ No newline at end of file diff --git a/resources/js/Layouts/AuthenticatedLayout.tsx b/resources/js/Layouts/AuthenticatedLayout.tsx index 94a9ba6..8b721b8 100644 --- a/resources/js/Layouts/AuthenticatedLayout.tsx +++ b/resources/js/Layouts/AuthenticatedLayout.tsx @@ -1,128 +1,62 @@ import { useState, PropsWithChildren, ReactNode } from 'react'; import ApplicationLogo from '@/Components/ApplicationLogo'; +import Footer from '@/Components/Footer'; import Dropdown from '@/Components/Dropdown'; import NavLink from '@/Components/NavLink'; -import ResponsiveNavLink from '@/Components/ResponsiveNavLink'; -import { Link } from '@inertiajs/react'; +import { Link, usePage } from '@inertiajs/react'; import { User } from '@/types'; -export default function Authenticated({ user, header, children }: PropsWithChildren<{ user: User, header?: ReactNode }>) { - const [showingNavigationDropdown, setShowingNavigationDropdown] = useState(false); +export default function Authenticated({ user, children }: PropsWithChildren<{ user: User }>) { + const { url } = usePage(); return ( -
- - - {header && ( -
-
{header}
-
- )} - -
{children}
+ + + +
+ {children} +
+ +
+
+
); } diff --git a/resources/js/Layouts/GuestLayout.tsx b/resources/js/Layouts/GuestLayout.tsx index 1c96822..f5776c0 100644 --- a/resources/js/Layouts/GuestLayout.tsx +++ b/resources/js/Layouts/GuestLayout.tsx @@ -1,19 +1,53 @@ import ApplicationLogo from '@/Components/ApplicationLogo'; -import { Link } from '@inertiajs/react'; +import NavLink from '@/Components/NavLink'; +import Footer from '@/Components/Footer'; +import { Link, usePage } from '@inertiajs/react'; import { PropsWithChildren } from 'react'; export default function Guest({ children }: PropsWithChildren) { + const { url } = usePage(); + return ( -
-
- - - -
+
+
+
+ + + +
+ + +
-
+
{children} -
+ + +
+
+
); } diff --git a/resources/js/Pages/About.tsx b/resources/js/Pages/About.tsx new file mode 100644 index 0000000..620d286 --- /dev/null +++ b/resources/js/Pages/About.tsx @@ -0,0 +1,102 @@ +import { Head } from '@inertiajs/react'; +import { PageProps } from '@/types'; +import Guest from '@/Layouts/GuestLayout'; +import Authenticated from '@/Layouts/AuthenticatedLayout'; +import ProjectBanner from '@/Components/ProjectBanner'; + +const About = ({ auth }: PageProps) => { + const renderAboutContent = () => ( +
+
+
+ + +
+

About Project CodeHub

+

Project CodeHub is a website accessible for the Department of Science and Technology (DOST) IT Department, + which curates repositories of source codes and instructional materials + about different web technologies and programming languages + that would help the IT Department employees build their own projects easily.

+
+
+
+ + +

Technology Stack

+ +
+
+
+
Web Technologies
+
+
HTML
+
PHP
+
CSS
+
JS
+
+
+ +
+
Development Frameworks
+
+
Node.js
+
Composer
+
+
+ +
+
Database
+
+
Apache Server
+
phpMyAdmin
+
MySQL
+
+
+
+ +
+
+
Backend Frameworks
+
+
Laravel
+
Axios
+
+
+ +
+
Frontend Frameworks
+
+
ReactJS
+
TailwindCSS
+
daisyUI
+
+
+
+
+
+ ); + + return ( + <> + +
+ {auth.user ? ( + + {renderAboutContent()} + + ) : ( + <> + + {renderAboutContent()} + + + )} +
+ + ); +} + +export default About; \ No newline at end of file diff --git a/resources/js/Pages/Dashboard.tsx b/resources/js/Pages/Dashboard.tsx index 5e6fc3e..e3ded58 100644 --- a/resources/js/Pages/Dashboard.tsx +++ b/resources/js/Pages/Dashboard.tsx @@ -1,12 +1,11 @@ -import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout'; +import Authenticated from '@/Layouts/AuthenticatedLayout'; import { Head } from '@inertiajs/react'; import { PageProps } from '@/types'; export default function Dashboard({ auth }: PageProps) { return ( - Dashboard} > @@ -17,6 +16,6 @@ export default function Dashboard({ auth }: PageProps) {
- + ); } diff --git a/resources/js/Pages/Help.tsx b/resources/js/Pages/Help.tsx new file mode 100644 index 0000000..8f72402 --- /dev/null +++ b/resources/js/Pages/Help.tsx @@ -0,0 +1,38 @@ +import { Head } from '@inertiajs/react'; +import { PageProps } from '@/types'; +import Guest from '@/Layouts/GuestLayout'; +import Authenticated from '@/Layouts/AuthenticatedLayout'; + +const Help = ({ auth }: PageProps) => { + const renderAboutContent = () => ( +
+ +
+ ) + + return ( + <> + +
+ {auth.user ? ( + + {renderAboutContent()} + + ) : ( + <> + + {renderAboutContent()} + + + )} +
+ + ); +} + +export default Help; \ No newline at end of file diff --git a/resources/js/Pages/Welcome.tsx b/resources/js/Pages/Welcome.tsx index 04c867f..fb1e8b1 100644 --- a/resources/js/Pages/Welcome.tsx +++ b/resources/js/Pages/Welcome.tsx @@ -1,161 +1,43 @@ -import { Link, Head } from '@inertiajs/react'; -import { PageProps } from '@/types'; - -export default function Welcome({ auth, laravelVersion, phpVersion }: PageProps<{ laravelVersion: string, phpVersion: string }>) { - const handleImageError = () => { - document.getElementById('screenshot-container')?.classList.add('!hidden'); - document.getElementById('docs-card')?.classList.add('!row-span-1'); - document.getElementById('docs-card-content')?.classList.add('!flex-row'); - document.getElementById('background')?.classList.add('!hidden'); - }; +import { Head } from '@inertiajs/react'; +import Guest from '@/Layouts/GuestLayout'; +export default function Welcome() { return ( <> -
- -
-
-
-
- -
- -
- -
-
- -
- Laravel documentation screenshot - Laravel documentation screenshot -
-
- -
-
-
- -
- -
-

Documentation

- -

- Laravel has wonderful documentation covering every aspect of the framework. Whether you are a newcomer or have prior experience with Laravel, we recommend reading our documentation from beginning to end. -

-
-
- - -
-
- - -
- -
- -
-

Laracasts

-

- Laracasts offers thousands of video tutorials on Laravel, PHP, and JavaScript development. Check them out, see for yourself, and massively level up your development skills in the process. -

-
- - -
- - -
- -
- -
-

Laravel News

- -

- Laravel News is a community driven portal and newsletter aggregating all of the latest and most important news in the Laravel ecosystem, including new package releases and tutorials. -

-
- - -
- -
-
- - - - - -
- -
-

Vibrant Ecosystem

+
+ +
+
+ + -
- -
- Laravel v{laravelVersion} (PHP v{phpVersion}) -
+
-
+ - ); -} + ) +} \ No newline at end of file diff --git a/routes/web.php b/routes/web.php index 067c4f5..9939b1d 100644 --- a/routes/web.php +++ b/routes/web.php @@ -1,19 +1,32 @@ Route::has('login'), - 'canRegister' => Route::has('register'), - 'laravelVersion' => Application::VERSION, - 'phpVersion' => PHP_VERSION, + 'canRegister' => Route::has('register') ]); }); +Route::get('/about', function () { + return Inertia::render('About'); +}); + +Route::get('/help', function () { + return Inertia::render('Help'); +}); + +Route::get('/privacy-policy', function () { + return Inertia::render('PrivacyPolicy'); +}); + +Route::get('/terms-of-use', function () { + return Inertia::render('Terms of Use'); +}); + Route::get('/dashboard', function () { return Inertia::render('Dashboard'); })->middleware(['auth', 'verified'])->name('dashboard');