upstream #1

Merged
jblu merged 1007 commits from upstream into main 2024-11-04 22:35:57 -06:00
7 changed files with 25 additions and 24 deletions
Showing only changes of commit 2c0d11d414 - Show all commits

View File

@ -3,13 +3,13 @@ import Link from '@/components/Link'
const Card = ({ title, description, imgSrc, href }) => ( const Card = ({ title, description, imgSrc, href }) => (
<div className="p-4 md:w-1/2 md" style={{ maxWidth: '544px' }}> <div className="p-4 md:w-1/2 md" style={{ maxWidth: '544px' }}>
<div className="h-full border-2 border-gray-200 border-opacity-60 dark:border-gray-700 rounded-md overflow-hidden"> <div className="h-full overflow-hidden border-2 border-gray-200 rounded-md border-opacity-60 dark:border-gray-700">
{href ? ( {href ? (
<Link href={href} aria-label={`Link to ${title}`}> <Link href={href} aria-label={`Link to ${title}`}>
<Image <Image
alt={title} alt={title}
src={imgSrc} src={imgSrc}
className="lg:h-48 md:h-36 object-cover object-center" className="object-cover object-center lg:h-48 md:h-36"
width={544} width={544}
height={306} height={306}
/> />
@ -18,13 +18,13 @@ const Card = ({ title, description, imgSrc, href }) => (
<Image <Image
alt={title} alt={title}
src={imgSrc} src={imgSrc}
className="lg:h-48 md:h-36 object-cover object-center" className="object-cover object-center lg:h-48 md:h-36"
width={544} width={544}
height={306} height={306}
/> />
)} )}
<div className="p-6"> <div className="p-6">
<h2 className="text-2xl font-bold leading-8 tracking-tight mb-3"> <h2 className="mb-3 text-2xl font-bold leading-8 tracking-tight">
{href ? ( {href ? (
<Link href={href} aria-label={`Link to ${title}`}> <Link href={href} aria-label={`Link to ${title}`}>
{title} {title}
@ -33,11 +33,11 @@ const Card = ({ title, description, imgSrc, href }) => (
title title
)} )}
</h2> </h2>
<p className="prose text-gray-500 max-w-none dark:text-gray-400 mb-3">{description}</p> <p className="mb-3 prose text-gray-500 max-w-none dark:text-gray-400">{description}</p>
{href && ( {href && (
<Link <Link
href={href} href={href}
className="text-base font-medium leading-6 text-blue-500 hover:text-blue-600 dark:hover:text-blue-400" className="text-base font-medium leading-6 text-primary-500 hover:text-primary-600 dark:hover:text-primary-400"
aria-label={`Link to ${title}`} aria-label={`Link to ${title}`}
> >
Learn more &rarr; Learn more &rarr;

View File

@ -4,7 +4,7 @@ import kebabCase from '@/lib/utils/kebabCase'
const Tag = ({ text }) => { const Tag = ({ text }) => {
return ( return (
<Link href={`/tags/${kebabCase(text)}`}> <Link href={`/tags/${kebabCase(text)}`}>
<a className="mr-3 text-sm font-medium text-blue-500 uppercase hover:text-blue-600 dark:hover:text-blue-400"> <a className="mr-3 text-sm font-medium uppercase text-primary-500 hover:text-primary-600 dark:hover:text-primary-400">
{text.split(' ').join('-')} {text.split(' ').join('-')}
</a> </a>
</Link> </Link>

View File

@ -30,7 +30,7 @@ export default function ListLayout({ posts, title, initialDisplayPosts = [], pag
type="text" type="text"
onChange={(e) => setSearchValue(e.target.value)} onChange={(e) => setSearchValue(e.target.value)}
placeholder="Search articles" placeholder="Search articles"
className="block w-full px-4 py-2 text-gray-900 bg-white border border-gray-300 rounded-md dark:border-gray-900 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-800 dark:text-gray-100" className="block w-full px-4 py-2 text-gray-900 bg-white border border-gray-300 rounded-md dark:border-gray-900 focus:ring-primary-500 focus:border-primary-500 dark:bg-gray-800 dark:text-gray-100"
/> />
<svg <svg
className="absolute w-5 h-5 text-gray-400 right-3 top-3 dark:text-gray-300" className="absolute w-5 h-5 text-gray-400 right-3 top-3 dark:text-gray-300"

View File

@ -59,7 +59,7 @@ export default function PostLayout({ frontMatter, authorDetails, next, prev, chi
{author.twitter && ( {author.twitter && (
<Link <Link
href={author.twitter} href={author.twitter}
className="text-blue-500 hover:text-blue-600 dark:hover:text-blue-400" className="text-primary-500 hover:text-primary-600 dark:hover:text-primary-400"
> >
{author.twitter.replace('https://twitter.com/', '@')} {author.twitter.replace('https://twitter.com/', '@')}
</Link> </Link>
@ -102,7 +102,7 @@ export default function PostLayout({ frontMatter, authorDetails, next, prev, chi
<h2 className="text-xs tracking-wide text-gray-500 uppercase dark:text-gray-400"> <h2 className="text-xs tracking-wide text-gray-500 uppercase dark:text-gray-400">
Previous Article Previous Article
</h2> </h2>
<div className="text-blue-500 hover:text-blue-600 dark:hover:text-blue-400"> <div className="text-primary-500 hover:text-primary-600 dark:hover:text-primary-400">
<Link href={`/blog/${prev.slug}`}>{prev.title}</Link> <Link href={`/blog/${prev.slug}`}>{prev.title}</Link>
</div> </div>
</div> </div>
@ -112,7 +112,7 @@ export default function PostLayout({ frontMatter, authorDetails, next, prev, chi
<h2 className="text-xs tracking-wide text-gray-500 uppercase dark:text-gray-400"> <h2 className="text-xs tracking-wide text-gray-500 uppercase dark:text-gray-400">
Next Article Next Article
</h2> </h2>
<div className="text-blue-500 hover:text-blue-600 dark:hover:text-blue-400"> <div className="text-primary-500 hover:text-primary-600 dark:hover:text-primary-400">
<Link href={`/blog/${next.slug}`}>{next.title}</Link> <Link href={`/blog/${next.slug}`}>{next.title}</Link>
</div> </div>
</div> </div>
@ -123,7 +123,7 @@ export default function PostLayout({ frontMatter, authorDetails, next, prev, chi
<div className="pt-4 xl:pt-8"> <div className="pt-4 xl:pt-8">
<Link <Link
href="/blog" href="/blog"
className="text-blue-500 hover:text-blue-600 dark:hover:text-blue-400" className="text-primary-500 hover:text-primary-600 dark:hover:text-primary-400"
> >
&larr; Back to the blog &larr; Back to the blog
</Link> </Link>

View File

@ -44,7 +44,7 @@ export default function PostLayout({ frontMatter, authorDetails, next, prev, chi
<div className="pt-4 xl:pt-8"> <div className="pt-4 xl:pt-8">
<Link <Link
href={`/blog/${prev.slug}`} href={`/blog/${prev.slug}`}
className="text-blue-500 hover:text-blue-600 dark:hover:text-blue-400" className="text-primary-500 hover:text-primary-600 dark:hover:text-primary-400"
> >
&larr; {prev.title} &larr; {prev.title}
</Link> </Link>
@ -54,7 +54,7 @@ export default function PostLayout({ frontMatter, authorDetails, next, prev, chi
<div className="pt-4 xl:pt-8"> <div className="pt-4 xl:pt-8">
<Link <Link
href={`/blog/${next.slug}`} href={`/blog/${next.slug}`}
className="text-blue-500 hover:text-blue-600 dark:hover:text-blue-400" className="text-primary-500 hover:text-primary-600 dark:hover:text-primary-400"
> >
{next.title} &rarr; {next.title} &rarr;
</Link> </Link>

View File

@ -70,7 +70,7 @@ export default function Home({ posts }) {
<div className="text-base font-medium leading-6"> <div className="text-base font-medium leading-6">
<Link <Link
href={`/blog/${slug}`} href={`/blog/${slug}`}
className="text-blue-500 hover:text-blue-600 dark:hover:text-blue-400" className="text-primary-500 hover:text-primary-600 dark:hover:text-primary-400"
aria-label={`Read "${title}"`} aria-label={`Read "${title}"`}
> >
Read more &rarr; Read more &rarr;
@ -88,7 +88,7 @@ export default function Home({ posts }) {
<div className="flex justify-end text-base font-medium leading-6"> <div className="flex justify-end text-base font-medium leading-6">
<Link <Link
href="/blog" href="/blog"
className="text-blue-500 hover:text-blue-600 dark:hover:text-blue-400" className="text-primary-500 hover:text-primary-600 dark:hover:text-primary-400"
aria-label="all posts" aria-label="all posts"
> >
All Posts &rarr; All Posts &rarr;

View File

@ -20,13 +20,14 @@ module.exports = {
sans: ['Inter', ...defaultTheme.fontFamily.sans], sans: ['Inter', ...defaultTheme.fontFamily.sans],
}, },
colors: { colors: {
blue: colors.lightBlue, primary: colors.cyan,
gray: colors.trueGray,
code: { code: {
green: '#b5f4a5', green: '#b5f4a5',
yellow: '#ffe484', yellow: '#ffe484',
purple: '#d9a9ff', purple: '#d9a9ff',
red: '#ff8383', red: '#ff8383',
blue: '#93ddfd', primary: '#93ddfd',
white: '#fff', white: '#fff',
}, },
}, },
@ -35,11 +36,11 @@ module.exports = {
css: { css: {
color: theme('colors.gray.700'), color: theme('colors.gray.700'),
a: { a: {
color: theme('colors.blue.500'), color: theme('colors.primary.500'),
'&:hover': { '&:hover': {
color: theme('colors.blue.600'), color: theme('colors.primary.600'),
}, },
code: { color: theme('colors.blue.400') }, code: { color: theme('colors.primary.400') },
}, },
h1: { h1: {
fontWeight: '700', fontWeight: '700',
@ -92,11 +93,11 @@ module.exports = {
css: { css: {
color: theme('colors.gray.300'), color: theme('colors.gray.300'),
a: { a: {
color: theme('colors.blue.500'), color: theme('colors.primary.500'),
'&:hover': { '&:hover': {
color: theme('colors.blue.400'), color: theme('colors.primary.400'),
}, },
code: { color: theme('colors.blue.400') }, code: { color: theme('colors.primary.400') },
}, },
h1: { h1: {
fontWeight: '700', fontWeight: '700',