mirror-github-bspeice/speice.io
1
0
Fork 0
mirror of https://github.com/bspeice/speice.io synced 2025-01-12 18:50:04 -05:00
Code Issues Releases Wiki Activity

Fix list keys, div height units

Browse Source
This commit is contained in:
Bradlee Speice 2025-01-04 11:13:14 -05:00
parent e49ba23e3f
commit 544d60c702
2 changed files with 14 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
blog/2024-11-15-playing-with-fire/3-log-density/FlameColor.tsx
View File

@ -55,7 +55,7 @@ export const PaletteBar: React.FC<PaletteBarProps> = ({ height, palette, childre
return ( return (
<> <>
<div ref={sizingRef} style={{ width: "100%", height }}> <div ref={sizingRef} style={{ width: "100%", height: `${height}px` }}>
{width > 0 ? <canvas ref={canvasRef} width={width} height={height} style={canvasStyle} /> : null} {width > 0 ? <canvas ref={canvasRef} width={width} height={height} style={canvasStyle} /> : null}
</div> </div>
{children} {children}

27
src/theme/BlogSidebar/Content/index.tsx
View File

@ -19,8 +19,8 @@ function BlogSidebarGroup({ title, headingType, children }: { title: string, hea
} }
function groupBySeries(items: BlogSidebarItem[], ListComponent: Props["ListComponent"]) { function groupBySeries(items: BlogSidebarItem[], ListComponent: Props["ListComponent"]) {
var returnItems = []; let returnItems = [];
var seriesItems: BlogSidebarItem[] = []; let seriesItems: BlogSidebarItem[] = [];
function flushSeries() { function flushSeries() {
if (seriesItems.length === 0) { if (seriesItems.length === 0) {
@ -41,13 +41,13 @@ function groupBySeries(items: BlogSidebarItem[], ListComponent: Props["ListCompo
// but for a series, we want to show ascending order // but for a series, we want to show ascending order
seriesItems = seriesItems.reverse(); seriesItems = seriesItems.reverse();
returnItems.push(<> returnItems.push(
<BlogSidebarGroup title={seriesTitle} headingType='h4'> <BlogSidebarGroup key={seriesTitle} title={seriesTitle} headingType='h4'>
<ul> <div role="group" style={{paddingInlineStart: "1.5em"}}>
<ListComponent items={seriesItems} /> <ListComponent items={seriesItems} />
</ul> </div>
</BlogSidebarGroup> </BlogSidebarGroup>
</>); );
seriesItems = []; seriesItems = [];
} }
@ -61,7 +61,7 @@ function groupBySeries(items: BlogSidebarItem[], ListComponent: Props["ListCompo
flushSeries(); flushSeries();
returnItems.push(<ListComponent items={[item]} />); returnItems.push(<ListComponent key={item.permalink} items={[item]} />);
} }
flushSeries(); flushSeries();
@ -69,8 +69,8 @@ function groupBySeries(items: BlogSidebarItem[], ListComponent: Props["ListCompo
} }
function groupByYear(items: BlogSidebarItem[], ListComponent: Props["ListComponent"]) { function groupByYear(items: BlogSidebarItem[], ListComponent: Props["ListComponent"]) {
var returnItems = []; let returnItems = [];
var yearItems: BlogSidebarItem[] = []; let yearItems: BlogSidebarItem[] = [];
function flushSeries() { function flushSeries() {
if (yearItems.length === 0) { if (yearItems.length === 0) {
@ -80,11 +80,11 @@ function groupByYear(items: BlogSidebarItem[], ListComponent: Props["ListCompone
const yearTitle = new Date(yearItems[0].date).getFullYear(); const yearTitle = new Date(yearItems[0].date).getFullYear();
const yearItemsGrouped = groupBySeries(yearItems, ListComponent); const yearItemsGrouped = groupBySeries(yearItems, ListComponent);
returnItems.push(<> returnItems.push(
<BlogSidebarGroup title={String(yearTitle)} headingType='h3'> <BlogSidebarGroup key={yearTitle} title={String(yearTitle)} headingType='h3'>
{yearItemsGrouped} {yearItemsGrouped}
</BlogSidebarGroup> </BlogSidebarGroup>
</>); );
yearItems = []; yearItems = [];
} }
@ -111,7 +111,6 @@ function groupByYear(items: BlogSidebarItem[], ListComponent: Props["ListCompone
function BlogSidebarContent({ function BlogSidebarContent({
items, items,
yearGroupHeadingClassName,
ListComponent, ListComponent,
}: Props): ReactNode { }: Props): ReactNode {
return groupByYear(items, ListComponent); return groupByYear(items, ListComponent);