make the lines more condensed
This commit is contained in:
parent
62b4c105a9
commit
ea600b05f7
4 changed files with 16 additions and 12 deletions
|
@ -5,11 +5,12 @@ import { sortBy } from "lodash-es";
|
|||
import TagList from "./TagList.astro";
|
||||
|
||||
interface Props {
|
||||
class: string;
|
||||
basePath: string;
|
||||
/** Whether or not to include drafts in this list */
|
||||
drafts?: "exclude" | "include" | "only";
|
||||
filteredPosts?: Post[];
|
||||
timeFormat?: string;
|
||||
class?: string | undefined;
|
||||
timeFormat?: string | undefined;
|
||||
}
|
||||
|
||||
type Post = CollectionEntry<"posts">;
|
||||
|
@ -54,17 +55,17 @@ const sortedPosts = sortBy(allPosts, (post) => -post.data.date);
|
|||
return (
|
||||
<>
|
||||
<tr class="row">
|
||||
<td class="info">
|
||||
<span class="spacer" />
|
||||
<Timestamp timestamp={post.data.date} format={timeFormat} />
|
||||
</td>
|
||||
<td>
|
||||
<div class="title">
|
||||
<a href={`${basePath}/${post.slug}`} class="brand-colorlink">
|
||||
{post.data.title}
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<Timestamp timestamp={post.data.date} format={timeFormat} />
|
||||
·
|
||||
<TagList tags={post.data.tags} />
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</>
|
||||
|
@ -76,11 +77,11 @@ const sortedPosts = sortBy(allPosts, (post) => -post.data.date);
|
|||
<style lang="scss">
|
||||
.postListing {
|
||||
width: 100%;
|
||||
border-spacing: 6px 10px;
|
||||
border-spacing: 6px 16px;
|
||||
|
||||
td {
|
||||
// padding-bottom: 10px;
|
||||
// line-height: 1;
|
||||
line-height: 1;
|
||||
|
||||
.title {
|
||||
font-size: 12pt;
|
||||
|
|
|
@ -7,10 +7,10 @@ const { extraFront, tags, extraBack } = Astro.props;
|
|||
<div class="tags">
|
||||
{extraFront}
|
||||
{
|
||||
tags.toSorted().map((tag) => (
|
||||
tags.toSorted().map((tag: string) => (
|
||||
<a href={`/tags/${tag}`} class="tag">
|
||||
<i class="fa fa-tag" aria-hidden="true" />
|
||||
<span class="text">{tag}</span>
|
||||
<span class="text">#{tag}</span>
|
||||
</a>
|
||||
))
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
---
|
||||
interface Props {
|
||||
timestamp: Date;
|
||||
format: string | undefined;
|
||||
format?: string | undefined;
|
||||
}
|
||||
|
||||
const { timestamp, format: customFormat } = Astro.props;
|
||||
|
|
|
@ -1,10 +1,13 @@
|
|||
.home.postListing {
|
||||
.timestamp {
|
||||
font-family: var(--monofont);
|
||||
color: var(--smaller-text-color);
|
||||
font-size: 0.75em;
|
||||
}
|
||||
|
||||
.tags {
|
||||
gap: 4px;
|
||||
display: inline-flex;
|
||||
|
||||
.tag {
|
||||
background-color: inherit;
|
||||
|
|
Loading…
Reference in a new issue