fix: update font serif and wrap section with container (#2443)
fix: update font serif and wrap section with container
This commit is contained in:
commit
680620ac9c
@ -133,7 +133,7 @@ export default function DownloadApp() {
|
||||
}
|
||||
|
||||
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">
|
||||
{groupTemnplate.map((item, i) => {
|
||||
return (
|
||||
|
||||
@ -78,7 +78,8 @@ const Testimonial = () => {
|
||||
|
||||
return (
|
||||
<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">
|
||||
<div className="w-full mx-auto relative py-8 text-center">
|
||||
<h1 className="text-5xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
|
||||
People say nice things
|
||||
</h1>
|
||||
@ -257,7 +258,7 @@ const Testimonial = () => {
|
||||
</svg>
|
||||
</p>
|
||||
</div>
|
||||
<div className="w-full xl:w-3/4 mx-auto relative text-center">
|
||||
<div className="w-full mx-auto relative text-center">
|
||||
<div data-theme={colorMode} className="mt-10">
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 lg:gap-8 text-left">
|
||||
<div className="space-y-4 lg:space-y-8">
|
||||
@ -364,6 +365,7 @@ const Testimonial = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
@ -18,6 +18,7 @@ export default function Download() {
|
||||
>
|
||||
<main>
|
||||
{/* Hero */}
|
||||
<div className="container">
|
||||
<div className="text-center px-4 py-20">
|
||||
<h1 className="text-6xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
|
||||
Download Jan for your desktop
|
||||
@ -46,6 +47,7 @@ export default function Download() {
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</Layout>
|
||||
</>
|
||||
|
||||
@ -148,13 +148,12 @@ export default function Home() {
|
||||
return (
|
||||
<>
|
||||
<Banner />
|
||||
<Layout
|
||||
description="Jan turns your computer into an AI machine by running LLMs locally on your computer. It's a privacy-focus, local-first, open-source solution."
|
||||
>
|
||||
<Layout description="Jan turns your computer into an AI machine by running LLMs locally on your computer. It's a privacy-focus, local-first, open-source solution.">
|
||||
<main>
|
||||
{/* Hero */}
|
||||
<div className="container">
|
||||
<div className="text-center px-4 py-16">
|
||||
<h1 className="text-6xl lg:text-8xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
|
||||
<h1 className="text-6xl lg:text-[80px] !font-normal leading-tight lg:leading-tight mt-2 font-serif">
|
||||
Rethink the Computer
|
||||
</h1>
|
||||
<p className="text-2xl -mt-1 leading-relaxed text-black/60 dark:text-white/60">
|
||||
@ -187,9 +186,11 @@ export default function Home() {
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Build with Love */}
|
||||
<div className="w-full px-4 xl:w-3/5 mx-auto relative py-8">
|
||||
<div className="container">
|
||||
<div className="w-full px-4 xl:w-3/4 mx-auto relative py-8">
|
||||
<div className="text-center">
|
||||
<h1 className="text-5xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
|
||||
Built with love
|
||||
@ -268,12 +269,14 @@ export default function Home() {
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Wall of love */}
|
||||
<Testimonial />
|
||||
|
||||
{/* Feature */}
|
||||
<div className="w-full xl:w-10/12 mx-auto relative py-8 lg:pt-24">
|
||||
<div className="container">
|
||||
<div className="w-full mx-auto relative py-8 lg:pt-24">
|
||||
<div className="flex p-4 lg:px-0 lg:justify-between flex-col lg:flex-row items-end">
|
||||
<div className="w-full">
|
||||
<h1 className="text-5xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
|
||||
@ -368,10 +371,12 @@ export default function Home() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Philosophy */}
|
||||
<div className="px-4 lg:px-8 mt-10 lg:mt-20 border-y border-[#F0F0F0] dark:border-gray-800">
|
||||
<div className="w-full xl:w-3/4 mx-auto relative pt-8 text-center">
|
||||
<div className="container">
|
||||
<div className="w-full mx-auto relative pt-8 text-center">
|
||||
<h1 className="text-5xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
|
||||
Our Philosophy
|
||||
</h1>
|
||||
@ -491,9 +496,9 @@ export default function Home() {
|
||||
</svg>
|
||||
<h5 className="mt-4 mb-2">Local-first</h5>
|
||||
<p className="text-black/60 dark:text-white/60">
|
||||
We believe your conversations and files should remain yours
|
||||
alone. That's why we prioritize local-first AI, running
|
||||
open-source models directly on your computer.
|
||||
We believe your conversations and files should remain
|
||||
yours alone. That's why we prioritize local-first AI,
|
||||
running open-source models directly on your computer.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
@ -555,9 +560,9 @@ export default function Home() {
|
||||
</svg>
|
||||
<h5 className="mt-4 mb-2">User-owned</h5>
|
||||
<p className="text-black/60 dark:text-white/60">
|
||||
Your data, your rules. Jan stores everything on your device
|
||||
in universal formats, giving you total freedom to move your
|
||||
data without tricks or traps.
|
||||
Your data, your rules. Jan stores everything on your
|
||||
device in universal formats, giving you total freedom to
|
||||
move your data without tricks or traps.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
@ -710,9 +715,11 @@ export default function Home() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* CTA email newsletter */}
|
||||
<div className="bg-[#F0F0F0] dark:bg-[#242424] text-center py-16">
|
||||
<div className="container">
|
||||
<div className="w-full xl:w-10/12 mx-auto relative">
|
||||
<div className="flex p-4 lg:justify-between flex-col lg:flex-row items-end">
|
||||
<div className="w-full">
|
||||
@ -757,9 +764,11 @@ export default function Home() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Location and statistic */}
|
||||
<div className="lg:w-4/5 w-full px-4 mx-auto py-10 lg:pb-20 lg:pt-32">
|
||||
<div className="container">
|
||||
<div className="w-full lg:w-3/4 mx-auto pb-20">
|
||||
<div className="grid grid-cols-2 lg:grid-cols-4 gap-4">
|
||||
<div className="text-center">
|
||||
@ -797,9 +806,11 @@ export default function Home() {
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* CTA Bottom */}
|
||||
<div className="w-full xl:w-10/12 mx-auto relative py-8">
|
||||
<div className="container">
|
||||
<div className="flex p-4 lg:justify-between flex-col lg:flex-row">
|
||||
<div className="w-full">
|
||||
<h1 className="text-5xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
|
||||
@ -824,6 +835,7 @@ export default function Home() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</Layout>
|
||||
</>
|
||||
|
||||
@ -169,5 +169,5 @@
|
||||
}
|
||||
|
||||
.font-serif {
|
||||
letter-spacing: -4px;
|
||||
letter-spacing: -1.6px;
|
||||
}
|
||||
|
||||
41
docs/src/styles/components/font.scss
Normal file
41
docs/src/styles/components/font.scss
Normal 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;
|
||||
}
|
||||
@ -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/components';
|
||||
@import 'tailwindcss/utilities';
|
||||
|
||||
@import './components/font.scss';
|
||||
@import './components/base.scss';
|
||||
@import './components/typography.scss';
|
||||
@import './components/card.scss';
|
||||
|
||||
BIN
docs/static/font/PPEditorialNew-Regular.otf
vendored
Normal file
BIN
docs/static/font/PPEditorialNew-Regular.otf
vendored
Normal file
Binary file not shown.
BIN
docs/static/font/PPEditorialNew-RegularItalic.otf
vendored
Normal file
BIN
docs/static/font/PPEditorialNew-RegularItalic.otf
vendored
Normal file
Binary file not shown.
BIN
docs/static/font/PPEditorialNew-Ultrabold.otf
vendored
Normal file
BIN
docs/static/font/PPEditorialNew-Ultrabold.otf
vendored
Normal file
Binary file not shown.
BIN
docs/static/font/PPEditorialNew-UltraboldItalic.otf
vendored
Normal file
BIN
docs/static/font/PPEditorialNew-UltraboldItalic.otf
vendored
Normal file
Binary file not shown.
BIN
docs/static/font/PPEditorialNew-Ultralight.otf
vendored
Normal file
BIN
docs/static/font/PPEditorialNew-Ultralight.otf
vendored
Normal file
Binary file not shown.
BIN
docs/static/font/PPEditorialNew-UltralightItalic.otf
vendored
Normal file
BIN
docs/static/font/PPEditorialNew-UltralightItalic.otf
vendored
Normal file
Binary file not shown.
@ -56,7 +56,7 @@ module.exports = {
|
||||
'Helvetica',
|
||||
'sans-serif',
|
||||
],
|
||||
serif: ['Josefin Sans'],
|
||||
serif: ['PPEditorialNew'],
|
||||
},
|
||||
extend: {
|
||||
backgroundImage: {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user