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

Packages Updated #76

Open
wants to merge 3 commits into
base: rewamp-run
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
57 changes: 29 additions & 28 deletions components/Hero.tsx
Original file line number Diff line number Diff line change
@@ -1,49 +1,50 @@
import { Button } from "./ui";
import { Button } from './ui';

const Hero = () => {
return (
<div className="relative bg-slate-900">
<div className="absolute inset-x-0 bottom-0">
<div className='relative bg-slate-900'>
<div className='absolute inset-x-0 bottom-0'>
<svg
viewBox="0 0 224 12"
fill="currentColor"
className="w-full -mb-1 text-white"
preserveAspectRatio="none"
viewBox='0 0 224 12'
fill='currentColor'
className='w-full -mb-1 text-white'
preserveAspectRatio='none'
>
<path d="M0,0 C48.8902582,6.27314026 86.2235915,9.40971039 112,9.40971039 C137.776408,9.40971039 175.109742,6.27314026 224,0 L224,12.0441132 L0,12.0441132 L0,0 Z" />
<path d='M0,0 C48.8902582,6.27314026 86.2235915,9.40971039 112,9.40971039 C137.776408,9.40971039 175.109742,6.27314026 224,0 L224,12.0441132 L0,12.0441132 L0,0 Z' />
</svg>
</div>
<div className="px-4 py-16 mx-auto sm:max-w-xl md:max-w-full lg:max-w-screen-xl md:px-24 lg:px-8 lg:py-20">
<div className="relative max-w-2xl sm:mx-auto sm:max-w-xl md:max-w-2xl sm:text-center">
<h2 className="mb-6 font-sans text-3xl font-bold tracking-tight text-white sm:text-4xl sm:leading-none">
<div className='px-4 py-16 mx-auto sm:max-w-xl md:max-w-full lg:max-w-screen-xl md:px-24 lg:px-8 lg:py-20'>
<div className='relative max-w-2xl sm:mx-auto sm:max-w-xl md:max-w-2xl sm:text-center'>
<h2 className='mb-6 font-sans text-3xl font-bold tracking-tight text-white sm:text-4xl sm:leading-none'>
Curated list of security tools for&nbsp;
<span className="inline-block">Hackers &amp; Builders!</span>
<span className='inline-block'>Hackers &amp; Builders!</span>
</h2>
<form className="flex flex-col items-center w-full mb-4 md:flex-row md:px-16">
<form className='flex flex-col items-center w-full mb-4 md:flex-row md:px-16'>
<input
placeholder="Search a tool or a category"
placeholder='Search a tool or a category'
required
type="text"
className="flex-grow w-full h-12 px-4 mb-3 text-white transition duration-200 bg-transparent border-2 border-slate-400 rounded appearance-none md:mr-2 md:mb-0 focus:outline-none focus:shadow-outline"
type='text'
className='flex-grow w-full h-12 px-4 mb-3 text-white transition duration-200 bg-transparent border-2 border-slate-400 rounded appearance-none md:mr-2 md:mb-0 focus:outline-none focus:shadow-outline'
/>
<Button type="submit">Search</Button>
<Button type='submit'>Search</Button>
</form>
<p className="max-w-md mb-10 text-xs font-thin tracking-wide text-slate-500 sm:text-sm sm:mx-auto md:mb-16">
An initiative to share and educate about various tools used in the field of information security.
<p className='max-w-md mb-10 text-xs font-thin tracking-wide text-slate-500 sm:text-sm sm:mx-auto md:mb-16'>
An initiative to share and educate about various tools used in the
field of information security.
</p>
<a
href="#tools"
aria-label="Scroll down"
className="flex items-center justify-center w-10 h-10 mx-auto text-white duration-300 transform border border-slate-400 rounded-full hover:text-teal-accent-400 hover:border-teal-accent-400 hover:shadow hover:scale-110"
href='#tools'
aria-label='Scroll down'
className='flex items-center justify-center w-10 h-10 mx-auto text-white duration-300 transform border border-slate-400 rounded-full hover:text-teal-accent-400 hover:border-teal-accent-400 hover:shadow hover:scale-110'
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="12"
height="12"
viewBox="0 0 12 12"
fill="currentColor"
xmlns='http://www.w3.org/2000/svg'
width='12'
height='12'
viewBox='0 0 12 12'
fill='currentColor'
>
<path d="M10.293,3.293,6,7.586,1.707,3.293A1,1,0,0,0,.293,4.707l5,5a1,1,0,0,0,1.414,0l5-5a1,1,0,1,0-1.414-1.414Z" />
<path d='M10.293,3.293,6,7.586,1.707,3.293A1,1,0,0,0,.293,4.707l5,5a1,1,0,0,0,1.414,0l5-5a1,1,0,1,0-1.414-1.414Z' />
</svg>
</a>
</div>
Expand Down
117 changes: 60 additions & 57 deletions components/Nav.tsx
Original file line number Diff line number Diff line change
@@ -1,118 +1,121 @@
import { useState } from "react";
import { useState } from 'react';

const Nav = () => {
const [isMenuOpen, setIsMenuOpen] = useState(false);

return (
<div className="bg-slate-900">
<div className="px-4 py-5 mx-auto sm:max-w-xl md:max-w-full lg:max-w-screen-xl md:px-24 lg:px-8">
<div className="relative flex items-center justify-between">
<div className='bg-slate-900'>
<div className='px-4 py-5 mx-auto sm:max-w-xl md:max-w-full lg:max-w-screen-xl md:px-24 lg:px-8'>
<div className='relative flex items-center justify-between'>
<a
href="/"
aria-label="Company"
title="Company"
className="inline-flex items-center"
href='/'
aria-label='Company'
title='Company'
className='inline-flex items-center'
>
<img src="/assets/logo.png" alt="tldr.run" className="w-8" />
<span className="ml-2 text-xl font-bold tracking-wide text-slate-100 uppercase">
<img src='/assets/logo.png' alt='tldr.run' className='w-8' />
<span className='ml-2 text-xl font-bold tracking-wide text-slate-100 uppercase'>
TLDR
</span>
</a>
<ul className="hidden lg:flex items-center space-x-8 lg:flex">
<ul className='hidden lg:flex items-center space-x-8 lg:flex'>
<li>
<a
href="/"
aria-label="Try tools"
title="Try tools"
className="font-medium tracking-wide text-slate-100 transition-colors duration-200 hover:text-teal-accent-400"
href='/'
aria-label='Submit a tool'
title='Submit a tool'
className='font-medium tracking-wide text-slate-100 transition-colors duration-200 hover:text-teal-accent-400'
>
Try tools
Submit
</a>
</li>
<li>
<a
href="/"
className="inline-flex items-center justify-center h-12 px-6 font-medium tracking-wide text-white transition duration-200 rounded shadow-md bg-sky-400 hover:bg-sky-700 focus:shadow-outline focus:outline-none"
aria-label="Submit a tool"
title="Submit a tool"
href='/'
className='inline-flex items-center justify-center h-12 px-6 font-medium tracking-wide text-white transition duration-200 rounded shadow-md bg-sky-400 hover:bg-sky-700 focus:shadow-outline focus:outline-none'
aria-label='Submit a tool'
title='Submit a tool'
>
Submit
Account
</a>
</li>
</ul>
<div className="lg:hidden">
<div className='lg:hidden'>
<button
aria-label="Open Menu"
title="Open Menu"
className="p-2 -mr-1 transition duration-200 rounded focus:outline-none focus:shadow-outline"
aria-label='Open Menu'
title='Open Menu'
className='p-2 -mr-1 transition duration-200 rounded focus:outline-none focus:shadow-outline'
onClick={() => setIsMenuOpen(true)}
>
<svg className="w-5 text-slate-600" viewBox="0 0 24 24">
<svg className='w-5 text-slate-600' viewBox='0 0 24 24'>
<path
fill="currentColor"
d="M23,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h22c0.6,0,1,0.4,1,1S23.6,13,23,13z"
fill='currentColor'
d='M23,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h22c0.6,0,1,0.4,1,1S23.6,13,23,13z'
/>
<path
fill="currentColor"
d="M23,6H1C0.4,6,0,5.6,0,5s0.4-1,1-1h22c0.6,0,1,0.4,1,1S23.6,6,23,6z"
fill='currentColor'
d='M23,6H1C0.4,6,0,5.6,0,5s0.4-1,1-1h22c0.6,0,1,0.4,1,1S23.6,6,23,6z'
/>
<path
fill="currentColor"
d="M23,20H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h22c0.6,0,1,0.4,1,1S23.6,20,23,20z"
fill='currentColor'
d='M23,20H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h22c0.6,0,1,0.4,1,1S23.6,20,23,20z'
/>
</svg>
</button>
{isMenuOpen && (
<div className="absolute top-0 left-0 w-full z-10">
<div className="p-5 bg-white border rounded shadow-sm">
<div className="flex items-center justify-between mb-4">
<div className='absolute top-0 left-0 w-full z-10'>
<div className='p-5 bg-white border rounded shadow-sm'>
<div className='flex items-center justify-between mb-4'>
<div>
<a
href="/"
aria-label="Company"
title="Company"
className="inline-flex items-center"
href='/'
aria-label='Company'
title='Company'
className='inline-flex items-center'
>
<img src="/assets/logo.png" alt="tldr.run" className="w-8" />
<span className="ml-2 text-xl font-bold tracking-wide text-slate-800 uppercase">
<img
src='/assets/logo.png'
alt='tldr.run'
className='w-8'
/>
<span className='ml-2 text-xl font-bold tracking-wide text-slate-800 uppercase'>
TLDR
</span>
</a>
</div>
<div>
<button
aria-label="Close Menu"
title="Close Menu"
className="p-2 -mt-2 -mr-2 transition duration-200 rounded hover:bg-slate-200 focus:bg-slate-200 focus:outline-none focus:shadow-outline"
aria-label='Close Menu'
title='Close Menu'
className='p-2 -mt-2 -mr-2 transition duration-200 rounded hover:bg-slate-200 focus:bg-slate-200 focus:outline-none focus:shadow-outline'
onClick={() => setIsMenuOpen(false)}
>
<svg className="w-5 text-slate-600" viewBox="0 0 24 24">
<svg className='w-5 text-slate-600' viewBox='0 0 24 24'>
<path
fill="currentColor"
d="M19.7,4.3c-0.4-0.4-1-0.4-1.4,0L12,10.6L5.7,4.3c-0.4-0.4-1-0.4-1.4,0s-0.4,1,0,1.4l6.3,6.3l-6.3,6.3 c-0.4,0.4-0.4,1,0,1.4C4.5,19.9,4.7,20,5,20s0.5-0.1,0.7-0.3l6.3-6.3l6.3,6.3c0.2,0.2,0.5,0.3,0.7,0.3s0.5-0.1,0.7-0.3 c0.4-0.4,0.4-1,0-1.4L13.4,12l6.3-6.3C20.1,5.3,20.1,4.7,19.7,4.3z"
fill='currentColor'
d='M19.7,4.3c-0.4-0.4-1-0.4-1.4,0L12,10.6L5.7,4.3c-0.4-0.4-1-0.4-1.4,0s-0.4,1,0,1.4l6.3,6.3l-6.3,6.3 c-0.4,0.4-0.4,1,0,1.4C4.5,19.9,4.7,20,5,20s0.5-0.1,0.7-0.3l6.3-6.3l6.3,6.3c0.2,0.2,0.5,0.3,0.7,0.3s0.5-0.1,0.7-0.3 c0.4-0.4,0.4-1,0-1.4L13.4,12l6.3-6.3C20.1,5.3,20.1,4.7,19.7,4.3z'
/>
</svg>
</button>
</div>
</div>
<nav>
<ul className="space-y-4">
<ul className='space-y-4'>
<li>
<a
href="/"
aria-label="Try tools"
title="Try tools"
className="font-medium tracking-wide text-slate-700 transition-colors duration-200 hover:text-sky-400"
href='/'
aria-label='Try tools'
title='Try tools'
className='font-medium tracking-wide text-slate-700 transition-colors duration-200 hover:text-sky-400'
>
Try tools
</a>
</li>
<li>
<a
href="/"
className="inline-flex items-center justify-center w-full h-12 px-6 font-medium tracking-wide text-white transition duration-200 rounded shadow-md bg-sky-400 hover:bg-sky-700 focus:shadow-outline focus:outline-none"
aria-label="Submit a tool"
title="Submit a tool"
href='/'
className='inline-flex items-center justify-center w-full h-12 px-6 font-medium tracking-wide text-white transition duration-200 rounded shadow-md bg-sky-400 hover:bg-sky-700 focus:shadow-outline focus:outline-none'
aria-label='Submit a tool'
title='Submit a tool'
>
Submit a tool
</a>
Expand Down
Loading