Nicholai/jan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: update font serif and wrap section with container (#2443)

Browse Source 
fix: update font serif and wrap section with container
This commit is contained in:
Henry 2024-03-22 14:51:30 +09:00 committed by GitHub
commit 680620ac9c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
14 changed files with 1025 additions and 969 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/src/containers/DownloadApp/index.js
View File

@ -133,7 +133,7 @@ export default function DownloadApp() {
} }
return ( return (
<div className="w-full lg:w-3/5 mx-auto px-4"> <div className="w-full lg:w-3/4 mx-auto px-4">
<div className="grid grid-cols-1 lg:grid-cols-3 py-10 gap-8"> <div className="grid grid-cols-1 lg:grid-cols-3 py-10 gap-8">
{groupTemnplate.map((item, i) => { {groupTemnplate.map((item, i) => {
return ( return (

564
docs/src/containers/Testimonial/index.js
View File

@ -78,287 +78,289 @@ const Testimonial = () => {
return ( return (
<div className="bg-[#F0F0F0] dark:bg-[#242424] p-8 mt-10 pb-20"> <div className="bg-[#F0F0F0] dark:bg-[#242424] p-8 mt-10 pb-20">
<div className="w-full xl:w-3/5 mx-auto relative py-8 text-center"> <div className="container">
<h1 className="text-5xl !font-normal leading-tight lg:leading-tight mt-2 font-serif"> <div className="w-full mx-auto relative py-8 text-center">
People say nice things <h1 className="text-5xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
</h1> People say nice things
<p className="leading-relaxed mt-2 text-black/60 dark:text-white/60 flex gap-x-2 justify-center"> </h1>
...despite our bugs and fast moving releases{' '} <p className="leading-relaxed mt-2 text-black/60 dark:text-white/60 flex gap-x-2 justify-center">
<svg ...despite our bugs and fast moving releases{' '}
width="24" <svg
height="24" width="24"
viewBox="0 0 24 24" height="24"
fill="none" viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg" fill="none"
> xmlns="http://www.w3.org/2000/svg"
<g clip-path="url(#clip0_1810_7276)"> >
<path <g clip-path="url(#clip0_1810_7276)">
d="M24.0001 11.4301H22.8601V19.4326H24.0001V11.4301Z" <path
className="fill-black/60 dark:fill-white/60" d="M24.0001 11.4301H22.8601V19.4326H24.0001V11.4301Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M22.8599 19.4325H21.7124V20.5725H22.8599V19.4325Z" <path
className="fill-black/60 dark:fill-white/60" d="M22.8599 19.4325H21.7124V20.5725H22.8599V19.4325Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M22.8599 9.14246H21.7124V11.43H22.8599V9.14246Z" <path
className="fill-black/60 dark:fill-white/60" d="M22.8599 9.14246H21.7124V11.43H22.8599V9.14246Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M21.7125 20.5725H20.5725V21.72H21.7125V20.5725Z" <path
className="fill-black/60 dark:fill-white/60" d="M21.7125 20.5725H20.5725V21.72H21.7125V20.5725Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M21.7125 6.86255H20.5725V9.14255H21.7125V6.86255Z" <path
className="fill-black/60 dark:fill-white/60" d="M21.7125 6.86255H20.5725V9.14255H21.7125V6.86255Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M20.5726 21.72H19.4326V22.86H20.5726V21.72Z" <path
className="fill-black/60 dark:fill-white/60" d="M20.5726 21.72H19.4326V22.86H20.5726V21.72Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M20.5726 5.71497H19.4326V6.86247H20.5726V5.71497Z" <path
className="fill-black/60 dark:fill-white/60" d="M20.5726 5.71497H19.4326V6.86247H20.5726V5.71497Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M19.4324 2.28748H18.2849V5.71498H19.4324V2.28748Z" <path
className="fill-black/60 dark:fill-white/60" d="M19.4324 2.28748H18.2849V5.71498H19.4324V2.28748Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M12.5701 22.86V21.72H14.8576V20.5725H11.4301V21.72H5.71509V22.86H11.4301V24H19.4326V22.86H12.5701Z" <path
className="fill-black/60 dark:fill-white/60" d="M12.5701 22.86V21.72H14.8576V20.5725H11.4301V21.72H5.71509V22.86H11.4301V24H19.4326V22.86H12.5701Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M18.285 1.14746H17.145V2.28746H18.285V1.14746Z" <path
className="fill-black/60 dark:fill-white/60" d="M18.285 1.14746H17.145V2.28746H18.285V1.14746Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M17.1449 11.4301H14.8574V12.5701H17.1449V11.4301Z" <path
className="fill-black/60 dark:fill-white/60" d="M17.1449 11.4301H14.8574V12.5701H17.1449V11.4301Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M16.0049 19.4325H14.8574V20.5725H16.0049V19.4325Z" <path
className="fill-black/60 dark:fill-white/60" d="M16.0049 19.4325H14.8574V20.5725H16.0049V19.4325Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M17.145 0H13.7175V1.1475H17.145V0Z" <path
className="fill-black/60 dark:fill-white/60" d="M17.145 0H13.7175V1.1475H17.145V0Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M14.8575 18.285H13.7175V19.4325H14.8575V18.285Z" <path
className="fill-black/60 dark:fill-white/60" d="M14.8575 18.285H13.7175V19.4325H14.8575V18.285Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M14.8575 12.5699H13.7175V13.7174H14.8575V12.5699Z" <path
className="fill-black/60 dark:fill-white/60" d="M14.8575 12.5699H13.7175V13.7174H14.8575V12.5699Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M16.005 2.28748H13.7175V4.57498H16.005V2.28748Z" <path
className="fill-black/60 dark:fill-white/60" d="M16.005 2.28748H13.7175V4.57498H16.005V2.28748Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M13.7176 13.7175H12.5701V18.285H13.7176V13.7175Z" <path
className="fill-black/60 dark:fill-white/60" d="M13.7176 13.7175H12.5701V18.285H13.7176V13.7175Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M13.7176 1.14746H12.5701V2.28746H13.7176V1.14746Z" <path
className="fill-black/60 dark:fill-white/60" d="M13.7176 1.14746H12.5701V2.28746H13.7176V1.14746Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M12.5699 2.28748H11.4299V4.57498H12.5699V2.28748Z" <path
className="fill-black/60 dark:fill-white/60" d="M12.5699 2.28748H11.4299V4.57498H12.5699V2.28748Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M11.43 19.4325H10.29V20.5725H11.43V19.4325Z" <path
className="fill-black/60 dark:fill-white/60" d="M11.43 19.4325H10.29V20.5725H11.43V19.4325Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M10.2901 16.005H9.14258V19.4325H10.2901V16.005Z" <path
className="fill-black/60 dark:fill-white/60" d="M10.2901 16.005H9.14258V19.4325H10.2901V16.005Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M11.4301 4.57495H9.14258V5.71495H11.4301V4.57495Z" <path
className="fill-black/60 dark:fill-white/60" d="M11.4301 4.57495H9.14258V5.71495H11.4301V4.57495Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M9.14244 14.8575H8.00244V16.005H9.14244V14.8575Z" <path
className="fill-black/60 dark:fill-white/60" d="M9.14244 14.8575H8.00244V16.005H9.14244V14.8575Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M9.14244 6.86255H8.00244V8.00255H9.14244V6.86255Z" <path
className="fill-black/60 dark:fill-white/60" d="M9.14244 6.86255H8.00244V8.00255H9.14244V6.86255Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M9.14244 2.28748H8.00244V4.57498H9.14244V2.28748Z" <path
className="fill-black/60 dark:fill-white/60" d="M9.14244 2.28748H8.00244V4.57498H9.14244V2.28748Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M8.00255 1.14746H6.86255V2.28746H8.00255V1.14746Z" <path
className="fill-black/60 dark:fill-white/60" d="M8.00255 1.14746H6.86255V2.28746H8.00255V1.14746Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M8.00245 8.00244H4.57495V9.14244H8.00245V8.00244Z" <path
className="fill-black/60 dark:fill-white/60" d="M8.00245 8.00244H4.57495V9.14244H8.00245V8.00244Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M5.71495 20.5725H4.57495V21.72H5.71495V20.5725Z" <path
className="fill-black/60 dark:fill-white/60" d="M5.71495 20.5725H4.57495V21.72H5.71495V20.5725Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M6.86249 0H3.42749V1.1475H6.86249V0Z" <path
className="fill-black/60 dark:fill-white/60" d="M6.86249 0H3.42749V1.1475H6.86249V0Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M1.1475 22.86V21.72H0V24H5.715V22.86H1.1475Z" <path
className="fill-black/60 dark:fill-white/60" d="M1.1475 22.86V21.72H0V24H5.715V22.86H1.1475Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M8.0026 13.7175H2.2876V14.8575H8.0026V13.7175Z" <path
className="fill-black/60 dark:fill-white/60" d="M8.0026 13.7175H2.2876V14.8575H8.0026V13.7175Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M5.71499 2.28748H3.42749V4.57498H5.71499V2.28748Z" <path
className="fill-black/60 dark:fill-white/60" d="M5.71499 2.28748H3.42749V4.57498H5.71499V2.28748Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M3.42746 20.5725H4.57496V19.4325H2.28746V20.5725H1.14746V21.72H3.42746V20.5725Z" <path
className="fill-black/60 dark:fill-white/60" d="M3.42746 20.5725H4.57496V19.4325H2.28746V20.5725H1.14746V21.72H3.42746V20.5725Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M3.4276 5.71497H2.2876V8.00247H3.4276V5.71497Z" <path
className="fill-black/60 dark:fill-white/60" d="M3.4276 5.71497H2.2876V8.00247H3.4276V5.71497Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M3.4276 1.14746H2.2876V2.28746H3.4276V1.14746Z" <path
className="fill-black/60 dark:fill-white/60" d="M3.4276 1.14746H2.2876V2.28746H3.4276V1.14746Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M2.28746 18.285H1.14746V19.4325H2.28746V18.285Z" <path
className="fill-black/60 dark:fill-white/60" d="M2.28746 18.285H1.14746V19.4325H2.28746V18.285Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M2.28746 8.00244H1.14746V10.2899H2.28746V8.00244Z" <path
className="fill-black/60 dark:fill-white/60" d="M2.28746 8.00244H1.14746V10.2899H2.28746V8.00244Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M2.28746 2.28748H1.14746V5.71498H2.28746V2.28748Z" <path
className="fill-black/60 dark:fill-white/60" d="M2.28746 2.28748H1.14746V5.71498H2.28746V2.28748Z"
/> className="fill-black/60 dark:fill-white/60"
<path />
d="M2.2875 16.005V14.8575H1.1475V10.29H0V18.285H1.1475V16.005H2.2875Z" <path
className="fill-black/60 dark:fill-white/60" d="M2.2875 16.005V14.8575H1.1475V10.29H0V18.285H1.1475V16.005H2.2875Z"
/> className="fill-black/60 dark:fill-white/60"
</g> />
<defs> </g>
<clipPath id="clip0_1810_7276"> <defs>
<rect width="24" height="24" fill="white" /> <clipPath id="clip0_1810_7276">
</clipPath> <rect width="24" height="24" fill="white" />
</defs> </clipPath>
</svg> </defs>
</p> </svg>
</div> </p>
<div className="w-full xl:w-3/4 mx-auto relative text-center"> </div>
<div data-theme={colorMode} className="mt-10"> <div className="w-full mx-auto relative text-center">
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 lg:gap-8 text-left"> <div data-theme={colorMode} className="mt-10">
<div className="space-y-4 lg:space-y-8"> <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 lg:gap-8 text-left">
{firstColumn.map((item, i) => { <div className="space-y-4 lg:space-y-8">
if (item.type === 'tweet') {firstColumn.map((item, i) => {
return ( if (item.type === 'tweet')
<div key={i} className="tweet-wrapper"> return (
<Tweet id={item.id} /> <div key={i} className="tweet-wrapper">
</div> <Tweet id={item.id} />
) </div>
if (item.type === 'youtube') )
return ( if (item.type === 'youtube')
<div key={i}> return (
<iframe <div key={i}>
width="100%" <iframe
height="260" width="100%"
src={`https://www.youtube.com/embed/${item.id}`} height="260"
title="Install Jan to Run LLM Offline and Local First" src={`https://www.youtube.com/embed/${item.id}`}
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" title="Install Jan to Run LLM Offline and Local First"
allowFullScreen allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
className="rounded-xl" allowFullScreen
loading="lazy" className="rounded-xl"
/> loading="lazy"
</div> />
) </div>
})} )
</div> })}
<div className="space-y-4 lg:space-y-8"> </div>
{secondColumn.map((item, i) => { <div className="space-y-4 lg:space-y-8">
if (item.type === 'tweet') {secondColumn.map((item, i) => {
return ( if (item.type === 'tweet')
<div key={i} className="tweet-wrapper"> return (
<Tweet id={item.id} /> <div key={i} className="tweet-wrapper">
</div> <Tweet id={item.id} />
) </div>
if (item.type === 'youtube') )
return ( if (item.type === 'youtube')
<div key={i}> return (
<iframe <div key={i}>
width="100%" <iframe
height="260" width="100%"
src={`https://www.youtube.com/embed/${item.id}`} height="260"
title="Install Jan to Run LLM Offline and Local First" src={`https://www.youtube.com/embed/${item.id}`}
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" title="Install Jan to Run LLM Offline and Local First"
allowFullScreen allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
className="rounded-xl" allowFullScreen
loading="lazy" className="rounded-xl"
/> loading="lazy"
</div> />
) </div>
})} )
</div> })}
<div className="space-y-4 lg:space-y-8"> </div>
{thirdColumn.map((item, i) => { <div className="space-y-4 lg:space-y-8">
if (item.type === 'tweet') {thirdColumn.map((item, i) => {
return ( if (item.type === 'tweet')
<div key={i} className="tweet-wrapper"> return (
<Tweet id={item.id} /> <div key={i} className="tweet-wrapper">
</div> <Tweet id={item.id} />
) </div>
if (item.type === 'youtube') )
return ( if (item.type === 'youtube')
<div key={i}> return (
<iframe <div key={i}>
width="100%" <iframe
height="260" width="100%"
src={`https://www.youtube.com/embed/${item.id}`} height="260"
title="Install Jan to Run LLM Offline and Local First" src={`https://www.youtube.com/embed/${item.id}`}
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" title="Install Jan to Run LLM Offline and Local First"
allowFullScreen allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
className="rounded-xl" allowFullScreen
loading="lazy" className="rounded-xl"
/> loading="lazy"
</div> />
) </div>
})} )
</div> })}
<div className="space-y-4 lg:space-y-8"> </div>
{fourthColumn.map((item, i) => { <div className="space-y-4 lg:space-y-8">
if (item.type === 'tweet') {fourthColumn.map((item, i) => {
return ( if (item.type === 'tweet')
<div key={i} className="tweet-wrapper"> return (
<Tweet id={item.id} /> <div key={i} className="tweet-wrapper">
</div> <Tweet id={item.id} />
) </div>
if (item.type === 'youtube') )
return ( if (item.type === 'youtube')
<div key={i}> return (
<iframe <div key={i}>
width="100%" <iframe
height="260" width="100%"
src={`https://www.youtube.com/embed/${item.id}`} height="260"
title="Install Jan to Run LLM Offline and Local First" src={`https://www.youtube.com/embed/${item.id}`}
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" title="Install Jan to Run LLM Offline and Local First"
allowFullScreen allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
className="rounded-xl" allowFullScreen
loading="lazy" className="rounded-xl"
/> loading="lazy"
</div> />
) </div>
})} )
})}
</div>
</div> </div>
</div> </div>
</div> </div>

52
docs/src/pages/download.js
View File

@ -18,32 +18,34 @@ export default function Download() {
> >
<main> <main>
{/* Hero */} {/* Hero */}
<div className="text-center px-4 py-20"> <div className="container">
<h1 className="text-6xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif"> <div className="text-center px-4 py-20">
Download Jan for your desktop <h1 className="text-6xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
</h1> Download Jan for your desktop
<p className="text-2xl -mt-1 leading-relaxed text-black/60 dark:text-white/60"> </h1>
Turn your computer into an AI machine <p className="text-2xl -mt-1 leading-relaxed text-black/60 dark:text-white/60">
</p> Turn your computer into an AI machine
<div className="my-8"> </p>
<DownloadApp /> <div className="my-8">
</div> <DownloadApp />
</div>
<div className="mb-14"> <div className="mb-14">
<a <a
href="https://jan.ai/guides/install/" href="https://jan.ai/guides/install/"
target="_blank" target="_blank"
className="text-blue-500 hover:text-blue-500 pr-4 border-r border-black/40 dark:border-white/40 mr-4 inline-block" className="text-blue-500 hover:text-blue-500 pr-4 border-r border-black/40 dark:border-white/40 mr-4 inline-block"
> >
Installation Guide Installation Guide
</a> </a>
<a <a
href="https://jan.ai/changelog/" href="https://jan.ai/changelog/"
target="_blank" target="_blank"
className="text-blue-500 hover:text-blue-500" className="text-blue-500 hover:text-blue-500"
> >
Changelog Changelog
</a> </a>
</div>
</div> </div>
</div> </div>
</main> </main>

1328
docs/src/pages/index.js
View File

File diff suppressed because it is too large Load Diff

2
docs/src/styles/components/base.scss
View File

@ -169,5 +169,5 @@
} }
.font-serif { .font-serif {
letter-spacing: -4px; letter-spacing: -1.6px;
} }

41
docs/src/styles/components/font.scss Normal file
View File

@ -0,0 +1,41 @@
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
@font-face {
font-family: 'PPEditorialNew';
src: url('/static/font/PPEditorialNew-Regular.otf') format('opentype');
font-weight: 400;
}
@font-face {
font-family: 'PPEditorialNew';
src: url('/static/font/PPEditorialNew-RegularItalic.otf') format('opentype');
font-weight: 400;
font-style: italic;
}
@font-face {
font-family: 'PPEditorialNew';
src: url('/static/font/PPEditorialNew-Ultrabold.otf') format('opentype');
font-weight: 700;
}
@font-face {
font-family: 'PPEditorialNew';
src: url('/static/font/PPEditorialNew-UltraboldItalic.otf') format('opentype');
font-weight: 700;
font-style: italic;
}
@font-face {
font-family: 'PPEditorialNew';
src: url('/static/font/PPEditorialNew-Ultralight.otf') format('opentype');
font-weight: 300;
}
@font-face {
font-family: 'PPEditorialNew';
src: url('/static/font/PPEditorialNew-UltralightItalic.otf')
format('opentype');
font-weight: 300;
font-style: italic;
}

3
docs/src/styles/main.scss
View File

@ -1,9 +1,8 @@
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&display=swap&family=Inter:wght@100..900&display=swap');
@import 'tailwindcss/base'; @import 'tailwindcss/base';
@import 'tailwindcss/components'; @import 'tailwindcss/components';
@import 'tailwindcss/utilities'; @import 'tailwindcss/utilities';
@import './components/font.scss';
@import './components/base.scss'; @import './components/base.scss';
@import './components/typography.scss'; @import './components/typography.scss';
@import './components/card.scss'; @import './components/card.scss';

BIN
docs/static/font/PPEditorialNew-Regular.otf vendored Normal file
View File

Binary file not shown.

BIN
docs/static/font/PPEditorialNew-RegularItalic.otf vendored Normal file
View File

Binary file not shown.

BIN
docs/static/font/PPEditorialNew-Ultrabold.otf vendored Normal file
View File

Binary file not shown.

BIN
docs/static/font/PPEditorialNew-UltraboldItalic.otf vendored Normal file
View File

Binary file not shown.

BIN
docs/static/font/PPEditorialNew-Ultralight.otf vendored Normal file
View File

Binary file not shown.

BIN
docs/static/font/PPEditorialNew-UltralightItalic.otf vendored Normal file
View File

Binary file not shown.

2
docs/tailwind.config.js
View File

@ -56,7 +56,7 @@ module.exports = {
'Helvetica', 'Helvetica',
'sans-serif', 'sans-serif',
], ],
serif: ['Josefin Sans'], serif: ['PPEditorialNew'],
}, },
extend: { extend: {
backgroundImage: { backgroundImage: {