Spliting an archetype and using style-first.css

[saurabh-sm]

I have a file archetype/default.md which looks like:

+++
title = 'Find Median From Data Stream'
description = 'Brief description for find median from data stream'
date = 2024-05-28T13:47:02-07:00
authors = ['yangshun-tay', 'navdeep-singh']
categories = ['heap']
tags = ['min-heap', 'max-heap']
weight = 90
[paige]
style = """
#paige-authors,
#paige-keywords,
#paige-toc,
#paige-date,
.paige-authors,
.paige-keywords,
.paige-date,
"""
[paige.file_link]
disable = false
+++

When I move the part containing the styling ([paige] in the front matter) to layouts/partials/paige/style-first.css, the result is not the same.

Is there a way I can use an archetype and style-first.css together ?

---

For example, single pages have the previous and next pages displayed at the bottom. If I want to disable this feature, I can add the below Paige styling to archetype/default.md and content pages which are already present:

#paige-prev-next,
.paige-prev-next {
    display: none;
}

Is there a better way of doing this ?

[saurabh-sm]

I can split the configuration in the archetype and style-first.css in the following manner to achieve the desired results:

• archetypes/default.md

+++
title = '{{ replace .File.ContentBaseName "-" " " | title }}'
description = 'Brief description for {{ replace .File.ContentBaseName "-" " " }}'
date = {{ .Date }}
authors = ['john', 'jane']
categories = ['foo']
tags = ['bar']
weight = 50
[paige.file_link]
disable = false
+++

• style-first.css

#paige-authors,
#paige-keywords,
#paige-toc,
#paige-date,
#paige-prev-next,
#paige-reading-time,
.paige-authors,
.paige-keywords,
.paige-date,
.paige-prev-next {
    display: none;
}
.paige-summary {
    display: none;
}
.paige-reading-time {
    display: none;
}

[willfaught]

Is there a way I can use an archetype and style-first.css together ?

Sure. See the exampleSite, which inherits Paige's archetype (https://github.com/willfaught/paige/blob/master/archetypes/default.md) and also defines a style-first.css (https://github.com/willfaught/paige/blob/master/exampleSite/layouts/partials/paige/style-first.css).

Is there a better way of doing this ?

Nope. Put that in style-first.css too.

.paige-prev-next

There's no class for this, only the ID #paige-prev-next.

I can split the configuration in the archetype and style-first.css in the following manner to achieve the desired results:

That looks good to me. Note that you can combine all the display: none; blocks into one if you want.

[saurabh-sm]

Thanks @willfaught, how can I combine all the display: none; into one block ?

[willfaught]

#paige-authors,
#paige-keywords,
#paige-toc,
#paige-date,
#paige-prev-next,
#paige-reading-time,
.paige-authors,
.paige-keywords,
.paige-date,
.paige-reading-time,
.paige-summary {
    display: none;
}

[saurabh-sm]

Thanks, so the summary comprises of authors, keywords, date, and reading-time (everything in .paige), and is set to not be displayed.

[willfaught]

By summary, do you mean .paige-summary, or are you summarizing what I wrote? .paige-summary is a snippet of the first part of the post body content; it's separate from the other fields.

[saurabh-sm]

Yep, I meant .paige-summary