numericcitizen
numericcitizen

@Mtt I'd love to add a posts separator built from a string of characters like "******" or "------" or whatever string I decide. Where should I look to add this in the Tiny Theme files? 🧐

|
Embed
Progress spinner
Mtt
Mtt

@numericcitizen You'd want to edit index.html and /layouts/_default/list.html (for category pages). You could put it within (or just outside) the .post-preview div. Can play around with looks on your test blog until you nail it.

|
Embed
Progress spinner
numericcitizen
numericcitizen

@Mtt 🥵

|
Embed
Progress spinner
gdp
gdp

@numericcitizen @mtt That should be fairly easy with some CSS magic, shouldn't it?

|
Embed
Progress spinner
Mtt
Mtt

@numericcitizen Here is a simpler way to accomplish something similar. It's not exactly what you asked for, but it's easier and non-intrusive. Add the following to your custom CSS in micro.blog. Don't need to edit a custom theme.

.post-preview {
    border-bottom: 1px dashed lightgray;
    margin-bottom: 30px;
}

You'll need to play with the exact values to get whatever you want. You can use color variables as well (like in the rest of the theme).

|
Embed
Progress spinner
Mtt
Mtt

@gdp @numericcitizen Yep, basically. I responded with a border version. Could also do it with an :after and content: '***' stuff. Few different options there.

|
Embed
Progress spinner
numericcitizen
numericcitizen

@Mtt I much prefer that way… and the provided example fits perfectly! Thanks!

|
Embed
Progress spinner
Mtt
Mtt

@numericcitizen Here's another way, just to be clear. All done within Custom CSS (no need to edit theme files). Instead of using borders like my previous example, add this:

.post-preview:after { content: "****"; color: var(--link); }

There's a good chance you'll want to add some margin and/or padding to it to space it out properly, but that should be a good start.

|
Embed
Progress spinner