Skip to content

Commit 8a8ef5e

Browse files
mxclmxcl
committed
adjustments on feed presentations
1 parent 338018f commit 8a8ef5e

3 files changed

Lines changed: 62 additions & 45 deletions

File tree

‎.github/scripts/gen-feed.ts‎

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ for (const pkg of JSON.parse(Deno.readTextFileSync(pkgsJson))) {
3131
}
3232

3333
import { extract } from "https://deno.land/std@0.206.0/front_matter/any.ts";
34+
import { describe } from "node:test";
3435

3536
for (const {name, isFile} of Deno.readDirSync(`./blog/content`)) {
3637
if (!isFile || !name.endsWith(".md")) continue
@@ -50,13 +51,13 @@ for (const {name, isFile} of Deno.readDirSync(`./blog/content`)) {
5051
}
5152

5253
for (const script of JSON.parse(Deno.readTextFileSync(scripthubJson)).scripts) {
53-
const { fullname, description, birthtime, avatar } = script
54+
const { cmd, fullname, description, birthtime, avatar } = script
5455
const url = `https://mash.pkgx.sh/${fullname}`
5556
if (description) rv.push({
56-
type: 'script',
57+
type: 'mash',
5758
time: new Date(birthtime),
58-
description: description.split(". ")?.[0] ?? description,
59-
title: fullname,
59+
description: demarkdown(description),
60+
title: cmd,
6061
image: avatar,
6162
url
6263
})
@@ -65,3 +66,11 @@ for (const script of JSON.parse(Deno.readTextFileSync(scripthubJson)).scripts) {
6566
rv.sort((a, b) => b.time.getTime() - a.time.getTime())
6667

6768
console.log(JSON.stringify(rv))
69+
70+
function demarkdown(input: string): string {
71+
let sentences = input.split('.').filter(x => x);
72+
if (sentences.length > 1) {
73+
input = sentences[0] + '.'
74+
}
75+
return input.replaceAll(/\[([^\]]+?)\]\(([^\)]+?)\)/g, '$1');
76+
}

‎src/pkgx.dev/HomeFeed.tsx‎

Lines changed: 48 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export default function HomeFeed() {
1717
const isxs = useMediaQuery(theme.breakpoints.down('md'));
1818

1919
return <>
20-
<Stack textAlign='center'>
20+
<Stack textAlign='center' sx={{pb: 6}}>
2121
<Typography variant='overline'>We are Crafters of Fine</Typography>
2222
<HeroTypography>
2323
Open Source
@@ -26,90 +26,98 @@ export default function HomeFeed() {
2626

2727
<Grid container spacing={{xs: 1, md: 2}}>
2828
<Grid size={{xs: 6, md: 4}}>
29-
<Card raised={true}>
30-
<CardActionArea href='https://github.com/pkgxdev/pkgx'>
31-
<CardMedia sx={{aspectRatio: '1/1'}} component={Box} image={img_pkgx} />
29+
<Card raised={true} sx={{ height: '100%' }}>
30+
<CardActionArea href='https://github.com/pkgxdev/pkgx' sx={{ height: '100%' }}>
3231
<CardContent sx={isxs ? {p: 0.75} : undefined}>
33-
<Typography variant='overline' component="h2">
32+
<Typography variant='h3' component="h2" style={{fontFamily: 'shader', textTransform: 'uppercase'}}>
3433
pkgx
3534
</Typography>
36-
<Typography variant='caption' component="h3">
37-
Fast, small, package runner
35+
<Typography variant='caption' component="h3" style={{fontSize: "1em"}}>
36+
Fast, small, package runner.
3837
</Typography>
3938
</CardContent>
4039
</CardActionArea>
4140
</Card>
4241
</Grid>
4342
<Grid size={{xs: 6, md: 4}}>
44-
<Card raised={true}>
45-
<CardActionArea href='https://github.com/pkgxdev/dev'>
46-
<CardMedia sx={{aspectRatio: '1/1'}} component={Box} image={img_dev} />
43+
<Card raised={true} sx={{ height: '100%' }}>
44+
<CardActionArea href='https://github.com/pkgxdev/pkgm' sx={{ height: '100%' }}>
4745
<CardContent sx={isxs ? {p: 0.75} : undefined}>
48-
<Typography variant='overline' component="h2">
49-
dev
46+
<Typography variant='h3' component="h2" style={{fontFamily: 'shader', textTransform: 'uppercase'}}>
47+
pkgm
5048
</Typography>
51-
<Typography variant='caption' component="h3">
52-
Isolated, reproducible development environments
49+
<Typography variant='caption' component="h3" style={{fontSize: "1em"}}>
50+
Install <code>pkgx</code> packages to <code>/usr/local</code>.
5351
</Typography>
5452
</CardContent>
5553
</CardActionArea>
5654
</Card>
5755
</Grid>
5856
<Grid size={{xs: 6, md: 4}}>
59-
<Card raised={true}>
60-
<CardActionArea href='https://github.com/pkgxdev/pkgm'>
61-
<CardMedia sx={{aspectRatio: '1/1'}} component={Box} image={img_pkgm} />
57+
<Card raised={true} sx={{ height: '100%' }}>
58+
<CardActionArea href='https://github.com/pkgxdev/dev' sx={{ height: '100%' }}>
6259
<CardContent sx={isxs ? {p: 0.75} : undefined}>
63-
<Typography variant='overline' component="h2">
64-
pkgm
60+
<Typography variant='h3' component="h2" style={{fontFamily: 'shader', textTransform: 'uppercase'}}>
61+
dev
6562
</Typography>
66-
<Typography variant='caption' component="h3">
67-
Install <code>pkgx</code> packages to <code>/usr/local</code>
63+
<Typography variant='caption' component="h3" style={{fontSize: "1em"}}>
64+
Isolated, reproducible development environments.
6865
</Typography>
6966
</CardContent>
7067
</CardActionArea>
7168
</Card>
7269
</Grid>
7370
<Grid size={{xs: 6, md: 4}}>
74-
<Card raised={true}>
75-
<CardActionArea href='https://github.com/pkgxdev/mash'>
76-
<CardMedia sx={{aspectRatio: '1/1'}} component={Box} image={img_mash} />
71+
<Card raised={true} sx={{ height: '100%' }}>
72+
<CardActionArea href='https://github.com/pkgxdev/mash' sx={{ height: '100%' }}>
7773
<CardContent sx={isxs ? {p: 0.75} : undefined}>
78-
<Typography variant='overline' component="h2">
74+
<Typography variant='h3' component="h2" style={{fontFamily: 'shader', textTransform: 'uppercase'}}>
7975
mash
8076
</Typography>
81-
<Typography variant='caption' component="h3">
82-
The package manager for scripts
77+
<Typography variant='caption' component="h3" style={{fontSize: "1em"}}>
78+
The package manager for scripts.
8379
</Typography>
8480
</CardContent>
8581
</CardActionArea>
8682
</Card>
8783
</Grid>
8884
<Grid size={{xs: 6, md: 4}}>
8985
<Card raised={true}>
90-
<CardActionArea href='https://github.com/pkgxdev/pkgo'>
91-
<CardMedia sx={{aspectRatio: '1/1'}} component={Box} image={img_unpkg} />
86+
<CardActionArea href='https://github.com/pkgxdev/pkgo' sx={{ height: '100%' }}>
9287
<CardContent sx={isxs ? {p: 0.75} : undefined}>
93-
<Typography variant='overline' component="h2">
88+
<Typography variant='h3' component="h2" style={{fontFamily: 'shader', textTransform: 'uppercase'}}>
9489
pkgo
9590
</Typography>
96-
<Typography variant='caption' component="h3">
97-
Package…GO! Run typically unpackagable OSS in sandboxes
91+
<Typography variant='caption' component="h3" style={{fontSize: "1em"}}>
92+
Package…GO! Run typically unpackagable OSS in sandboxes.
93+
</Typography>
94+
</CardContent>
95+
</CardActionArea>
96+
</Card>
97+
</Grid>
98+
<Grid size={{xs: 6, md: 4}}>
99+
<Card raised={true} sx={{ height: '100%' }}>
100+
<CardActionArea href='https://github.com/pkgxdev/mcp' sx={{ height: '100%' }}>
101+
<CardContent sx={isxs ? {p: 0.75} : undefined}>
102+
<Typography variant='h3' component="h2" style={{fontFamily: 'shader', fontVariant: 'small-caps'}}>
103+
pkgxMCP
104+
</Typography>
105+
<Typography variant='caption' component="h3" style={{fontSize: "1em"}}>
106+
Can your LLM run anything? Now it can.
98107
</Typography>
99108
</CardContent>
100109
</CardActionArea>
101110
</Card>
102111
</Grid>
103112
<Grid size={{xs: 6, md: 4}}>
104113
<Card raised={true}>
105-
<CardActionArea href='https://github.com/teaxyz/teaBASE'>
106-
<CardMedia sx={{aspectRatio: '1/1'}} component={Box} image={img_teaBASE} />
114+
<CardActionArea href='https://github.com/teaxyz/teaBASE' sx={{ height: '100%' }}>
107115
<CardContent sx={isxs ? {p: 0.75} : undefined}>
108-
<Typography variant='overline' component="h2">
116+
<Typography variant='h3' component="h2" style={{fontFamily: 'shader', fontVariant: 'small-caps'}}>
109117
teaBASE
110118
</Typography>
111-
<Typography variant='caption' component="h3">
112-
The Developer Cockpit
119+
<Typography variant='caption' component="h3" style={{fontSize: "1em"}}>
120+
The Developer Cockpit.
113121
</Typography>
114122
</CardContent>
115123
</CardActionArea>
@@ -184,7 +192,7 @@ function FeedItemBox(item: FeedItem) {
184192
const color = (() => {
185193
switch (type) {
186194
case 'blog': return 'secondary'
187-
case 'script': return 'primary'
195+
case 'mash': return 'primary'
188196
}
189197
})()
190198

@@ -203,9 +211,9 @@ function FeedItemBox(item: FeedItem) {
203211
<Card
204212
variant={color ? 'outlined' : undefined}
205213
raised={!!color}
206-
sx={{ borderColor, borderWidth }}
214+
sx={{ borderColor, borderWidth, height: '100%' }}
207215
>
208-
<CardActionArea href={url}>
216+
<CardActionArea href={url} sx={{ height: '100%' }}>
209217
<CardMedia
210218
height={isxs ? 150 : undefined}
211219
sx={{aspectRatio: isxs ? undefined : '1/1'}}

‎src/utils/FeedItem.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11

22
type FeedItem = {
3-
type: 'blog' | 'pkg' |'script' | 'highlight'
3+
type: 'blog' | 'pkg' |'mash' | 'highlight'
44
url: string,
55
title: string,
66
time: Date,

0 commit comments

Comments
 (0)