msb-public
/
tech-interview-handbook
mirror of https://github.com/yangshun/tech-interview-handbook
2
1
Code Issues Projects Releases Wiki Activity

[questions][feat] add nav bar

Browse Source
pull/312/head
wlren 3 years ago committed by Jeff Sieu
parent 38f433255c
commit b43f980e2b
3 changed files with 100 additions and 1 deletions
Show Stats Download Patch File Download Diff File

39
apps/portal/public/logo.svg
Unescape View File

@ -0,0 +1,39 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 582.39 458.49">
<defs>
<style>
.cls-1{fill:#5252ee}.cls-2{fill:#7f7ff0}.cls-3{fill:#fff}.cls-4{fill:#363636}.cls-5{fill:#ff4585}.cls-6{fill:#00e5a0}
</style>
</defs>
<ellipse cx="291.19" cy="428.46" fill="#eef2f5" rx="291.19" ry="30.03"/>
<rect width="346.05" height="180.28" x="197.89" y="168.35" class="cls-1" rx="30" ry="30" transform="rotate(-90 370.92 258.49)"/>
<rect width="346.05" height="180.28" x="189.19" y="168.35" class="cls-2" rx="30" ry="30" transform="rotate(-90 362.22 258.49)"/>
<path d="M257.71 419.94V97.04h152.1a28.18 28.18 0 0128.18 28.18v266.54a28.18 28.18 0 01-28.18 28.18h-152.1z" class="cls-3"/>
<path d="M206.96 431.51v-346h151.11a29.17 29.17 0 0129.17 29.08v287.75a29.17 29.17 0 01-29.17 29.17H206.96z" class="cls-1"/>
<rect width="346.05" height="244.06" x="80.86" y="136.46" class="cls-2" rx="33.94" ry="33.94" transform="rotate(-90 253.89 258.49)"/>
<path fill="#ffcb2c" d="M131.87 397.57V119.41a33.94 33.94 0 0133.94-33.94h5.06v346h-5.07a33.94 33.94 0 01-33.93-33.9z"/>
<g opacity=".2">
<circle cx="148.62" cy="375.73" r="11.84"/>
<circle cx="148.62" cy="329.54" r="11.84"/>
<circle cx="148.62" cy="283.35" r="11.84"/>
<circle cx="148.62" cy="237.16" r="11.84"/>
<circle cx="148.62" cy="190.96" r="11.84"/>
<circle cx="148.62" cy="144.77" r="11.84"/>
</g>
<rect width="11.93" height="27.44" x="129.79" y="362.01" class="cls-4" rx="4.5" ry="4.5" transform="rotate(-90 135.755 375.735)"/>
<rect width="11.93" height="27.44" x="129.79" y="315.82" class="cls-4" rx="4.5" ry="4.5" transform="rotate(-90 135.75 329.54)"/>
<rect width="11.93" height="27.44" x="129.79" y="269.63" class="cls-4" rx="4.5" ry="4.5" transform="rotate(-90 135.75 283.35)"/>
<rect width="11.93" height="27.44" x="129.79" y="223.44" class="cls-4" rx="4.5" ry="4.5" transform="rotate(-90 135.75 237.16)"/>
<rect width="11.93" height="27.44" x="129.79" y="177.24" class="cls-4" rx="4.5" ry="4.5" transform="rotate(-90 135.755 190.965)"/>
<rect width="11.93" height="27.44" x="129.79" y="131.05" class="cls-4" rx="4.5" ry="4.5" transform="rotate(-90 135.75 144.77)"/>
<path d="M396.07 97.04h2.47v189.3h-2.47zm0 233.12h2.47v90.57h-2.47zm15.44-107.97h2.47v197.75h-2.47zm16.06 10.68h-2.47V101.54l2.47 1.79v129.54zm-2.47 58.71h2.47v45.59h-2.47zm-13.59-163h2.47v45.59h-2.47z" opacity=".1"/>
<path d="M237.95 271a5 5 0 01-3.54-1.46L211.9 247a5 5 0 010-7.07l22.51-22.51a5 5 0 017.07 7.07l-19 19 19 19a5 5 0 01-3.54 8.54zm64.82 0a5 5 0 01-3.54-8.54l19-19-19-19a5 5 0 017.07-7.07l22.51 22.51a5 5 0 010 7.07l-22.51 22.51a5 5 0 01-3.53 1.52zm-41.58 14.87a5 5 0 01-4.84-6.27l19.72-74.85a5 5 0 119.67 2.55L266 282.14a5 5 0 01-4.81 3.73z" class="cls-3"/>
<path fill="#ffe400" d="M92.72 186.5l5 13.1A2.32 2.32 0 0099 201l13.1 5a2.32 2.32 0 010 4.34l-13.1 5a2.32 2.32 0 00-1.35 1.35l-5 13.1a2.32 2.32 0 01-4.34 0l-5-13.1a2.32 2.32 0 00-1.35-1.35l-13.1-5a2.32 2.32 0 010-4.34l13.1-5a2.32 2.32 0 001.35-1.35l5-13.1a2.32 2.32 0 014.41-.05zm386.36 79.39l5.38 14.22a2.52 2.52 0 001.47 1.47l14.22 5.42a2.52 2.52 0 010 4.72l-14.22 5.38a2.52 2.52 0 00-1.47 1.47l-5.38 14.22a2.52 2.52 0 01-4.72 0L469 298.52a2.52 2.52 0 00-1.47-1.47l-14.22-5.38a2.52 2.52 0 010-4.72l14.22-5.38a2.52 2.52 0 001.47-1.47l5.38-14.22a2.52 2.52 0 014.7.01zM258.14 18l5.67 15a2.66 2.66 0 001.55 1.55l15 5.67a2.66 2.66 0 010 5l-15 5.67a2.66 2.66 0 00-1.55 1.55l-5.67 15a2.66 2.66 0 01-5 0l-5.67-15a2.66 2.66 0 00-1.55-1.55l-15-5.67a2.66 2.66 0 010-5l15-5.67a2.66 2.66 0 001.55-1.55l5.67-15a2.66 2.66 0 015 0zm-49.69 344.87l5.67 15a2.66 2.66 0 001.55 1.55l15 5.67a2.66 2.66 0 010 5l-15 5.67a2.66 2.66 0 00-1.55 1.55l-5.67 15a2.66 2.66 0 01-5 0l-5.67-15a2.66 2.66 0 00-1.55-1.55l-15-5.67a2.66 2.66 0 010-5l15-5.67a2.66 2.66 0 001.55-1.55l5.67-15a2.66 2.66 0 015 0z"/>
<rect width="90.16" height="59.5" x="480.14" y="173.05" class="cls-5" rx="11.44" ry="11.44" transform="rotate(30.42 525.27 202.83)"/>
<path d="M505.53 242.61a4.27 4.27 0 01-5.83-3.43l-1.49-11.87-1.1-8.77a4.27 4.27 0 016.4-4.21l10.94 6.42 10.94 6.42a4.27 4.27 0 01-.56 7.64l-8.19 3.31z" class="cls-5"/>
<circle cx="507.01" cy="194.63" r="5.78" class="cls-3" transform="rotate(-59.76 507.024 194.63)"/>
<circle cx="524.1" cy="204.6" r="5.78" class="cls-3" transform="rotate(-59.76 524.112 204.598)"/>
<circle cx="541.31" cy="214.63" r="5.78" class="cls-3" transform="rotate(-59.76 541.326 214.627)"/>
<rect width="86.2" height="56.89" x="69.02" y="11.6" class="cls-6" rx="10.94" ry="10.94" transform="rotate(-24.07 112.12 40.037)"/>
<path d="M132.16 77.47a4.08 4.08 0 01-5.9 2.64l-10.06-5.43-7.43-4a4.08 4.08 0 01.27-7.32l11.07-4.95 11.07-4.95a4.08 4.08 0 015.63 4.68l-2 8.21z" class="cls-6"/>
<path d="M115.94 53.34l-17.08-5.28 2.41-7.83 9.67 2.99 7.81-21.18 7.68 2.84-10.49 28.46z" class="cls-3"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.8 KiB

56
apps/portal/src/components/questions/NavBar.tsx
Unescape View File

@ -0,0 +1,56 @@
import Link from 'next/link';
const navigation = [
{ href: '/questions/landing', name: 'Landing' },
{ href: '#', name: 'Home' },
{ href: '#', name: 'My Lists' },
{ href: '#', name: 'My Questions' },
{ href: '#', name: 'History' },
];
export default function NavBar() {
return (
<header className="bg-indigo-600">
<nav aria-label="Top" className="max-w-8xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="flex w-full items-center justify-between border-b border-indigo-500 py-3 lg:border-none">
<div className="flex items-center">
<a className="flex items-center" href="/questions">
<span className="sr-only">TIH Question Bank</span>
<img alt="TIH Logo" className="h-10 w-auto" src="/logo.svg" />
<span className="ml-4 font-bold text-white">
TIH Question Bank
</span>
</a>
<div className="ml-8 hidden space-x-6 lg:block">
{navigation.map((link) => (
<Link
key={link.name}
className="font-sm text-sm text-white hover:text-indigo-50"
href={link.href}>
{link.name}
</Link>
))}
</div>
</div>
<div className="ml-8 space-x-4">
<a
className="inline-block rounded-md border border-transparent bg-indigo-500 py-2 px-4 text-base font-medium text-white hover:bg-opacity-75"
href="#">
Sign in
</a>
</div>
</div>
<div className="flex flex-wrap justify-center space-x-6 py-4 lg:hidden">
{navigation.map((link) => (
<Link
key={link.name}
className="text-base font-medium text-white hover:text-indigo-50"
href={link.href}>
{link.name}
</Link>
))}
</div>
</nav>
</header>
);
}

6
apps/portal/src/pages/questions/index.tsx
Unescape View File

@ -1,10 +1,14 @@
import ContributeQuestionCard from '~/components/questions/ContributeQuestionCard'; import ContributeQuestionCard from '~/components/questions/ContributeQuestionCard';
import NavBar from '~/components/questions/NavBar';
import QuestionOverviewCard from '~/components/questions/QuestionOverviewCard'; import QuestionOverviewCard from '~/components/questions/QuestionOverviewCard';
import QuestionSearchBar from '~/components/questions/QuestionSearchBar'; import QuestionSearchBar from '~/components/questions/QuestionSearchBar';
export default function QuestionsHomePage() { export default function QuestionsHomePage() {
return ( return (
<main className="flex flex-1 justify-center overflow-y-auto p-4"> <main className="flex flex-1 flex-col items-center justify-center overflow-y-auto p-4">
<div className="w-full pb-4">
<NavBar></NavBar>
</div>
<div className="flex max-w-4xl flex-1 gap-x-4"> <div className="flex max-w-4xl flex-1 gap-x-4">
<div className="flex flex-1 flex-col items-stretch justify-start gap-4"> <div className="flex flex-1 flex-col items-stretch justify-start gap-4">
<ContributeQuestionCard <ContributeQuestionCard

Write Preview
Loading…
Cancel
Save