Iâve been working on the index pages for my fiction. Itâs pretty much the last thing I want to do before I replace the old version of my site.
The Sims were great, but I was so cruel to my families. Simple things like getting them all in a room, then bricking up the door. Or theyâd be having a nice day outside, get them all in the pool, then taking the ladder away.
Made a page listing which file formats/algorithms/whatever I prefer to use in which cases.
Just shared a write up of my experience getting top surgery in Japan. I plan to keep updating it as I heal and learn more about the recovery side of things.
Iâm glad the surgery worked out for you, and I love the airmail envelope border.
Iâve been working on my tidying up my hoard of graphics links in the Linkware Websets section of my site. I alphabetized the links, went through and rewrote the descriptions so they werenât so wordy, made sure to standardize spellings (had both websets and web sets) and went through each site to make sure I had an accurate accounting of what they offered and what categories the backgrounds and sets were in. Hopefully this will make it easier for someone to search if anyone had a burning desire for, say, Angel themed backgrounds or sets from the late 1990s/early 2000s.
I also had to delete 2 totally because they disappeared and Internet Archive did not save much of the site. :(
Also - a new kitty joined the Kitty Friends, I made a blog post, and I tinkered with link colors.
So, I spent the last few months overhauling my website so that it no longer generated web pages from Markdown using pandoc
, and relaunched it last night.
Today, if youâre using Mozilla Firefox on a desktop or laptop, you can go to View > Page Styles
and select one of several stylesheets with the following limitations:
- it only works for the current page
- it doesnât persist
- it may be a non-standard feature because only Firefox provides it.
Doing this properly wonât be something I can do on my lunch break, so I might save it for a bit. However, Sara L. Fossheim has an article called " Building an accessible theme picker with HTML, CSS and JavaScript." that looks like a reasonable approach. Theyâre using LocalStorage to persist the theme selection instead of a cookie.
I added this page, and will set up a JS-based redirect if you were referred to my site from Hacker News, Facebook, Twitter, Reddit, Bluesky, and some other platforms.
UPDATE!
I ended up adding that JS referrer check. The redirect only happens once if localStorage
is available; I donât want to be too obnoxious. Hereâs how I implemented it; thereâs also some code for handling multiple <details>
elements on the same page.
window.addEventListener("load", loadHandler);
function loadHandler() {
if (!localStorage.getItem("checkedReferrer")) {
checkReferrer();
}
showDestinationLink();
createDetailsToggle();
}
function checkReferrer() {
var welcome = "https://starbreaker.org/about/welcome-personal-web/index.html";
var corporateReferrers = [
"twitter.com",
"facebook.com",
"news.ycombinator.com",
"threads.net",
"reddit.com",
"bsky.app",
"google.com",
"bing.com",
"duckduckgo.com",
"yahoo.com"
];
var isCorporate = corporateReferrers.some((referrer) => testReferrer(referrer));
if (isCorporate) {
localStorage.setItem("checkedReferrer", "true");
window.location.href = `${welcome}?destUrl=${encodeURIComponent(document.URL)}`;
}
}
function testReferrer(referrer) {
return (document.referrer.indexOf(referrer) > -1);
}
// I'm assuming that we want to close one <details> // when we open another. I could be wrong, though.
function createDetailsToggle() {
const details = document.querySelectorAll("details");
details.forEach((targetDetail) => {
targetDetail.addEventListener("click", () => {
details.forEach((detail) => {
if (detail !== targetDetail) {
detail.removeAttribute("open");
}
});
});
});
}
function showDestinationLink() {
const params = new URLSearchParams(document.location.search);
if(params.has('destUrl')) {
let decodedUrl = decodeURI(params.get('destUrl'));
if (document.getElementById('destUrlLink'))
{
let destUrlLink = document.getElementById('destUrlLink');
destUrlLink.setAttribute('href', decodedUrl);
}
}
}
This code is partially redacted; my version also checks for referring sites I consider to be Nazi bars, and instead of redirecting them to a page on my site sends there somewhere far more unpleasant (and thoroughly NSFW).
I finally churned out a first iteration of a page about my childhood trips to some random holiday resort.
Also got a quick little page up showcasing two OCs, which I hope to expand on someday if I remember whatever else I drew during my childhood.
I skimmed through this morning while sorting the kids breakfast, but definitely going to sit down later tonight to read in full.
made two new blog posts today:
also updated my favicon, my 88x31 button, and my websiteâs embed thumbnail, and as an aside, updated my /about/now page
the latter page is mostly for my friends. however, i did take a good look at this thread while writing that whole thing, so you mightâve gotten a mention on this page!
more like âin the last few daysâ than today, but i think i did a fair sight:
- added tags to my blog posts. well, just that part. you canât view posts by a list of tags yet or anything. coming, comingâŚ
- color scheme tweaks
- added styling for <code>
- footnotes now doable :-)
I added a share button that copies the link to a post on a thread to the clipboard. The links have a parameter that if found in the url will modify the open graph meta so that links are friendlier for sharing and someone can direct you to a specific post inside a thread rather than just to the thread itself.
I did some other things but that was the main one.
Hereâs an example. This is the third post on the thread. It correctly shares the third image, and if there was text and title on the post, that would also be shared.
Since I couldnât sleep, I ended up tinkering with my home page.
The copy could still use some work, but Iâve got some more on-page and site navigation.
I also ended up implementing theme switching based on Sarah Fossheimâs demonstration. Only I went a bit further in that you can not only select a theme, but also set the font size and (on desktops and laptops) the page width.
Your selections are stashed in localStorage
, not cookies. I should update my colophon to mention that so people know what theyâre getting into.
After reading the discussion about scroll behaviour I decided to add a user setting to my website so that smooth scrolling can be disabled even when the user has no preference towards reduced motion:
@media (prefers-reduced-motion: no-preference) {
:where(html:focus-within:has([name="smooth-scroll"]:checked)) {
scroll-behavior: smooth;
}
}
This allows folks who donât have reduced motion turned on as an operating system setting to disable smooth scrolling if they choose. The :focus-within
portion of the selector means the page will not smooth scroll if they navigate to a page that has a fragment identifier in it, e.g. https://chrisburnell.com/#projects
Iâve also hidden the setting when the user does have reduced motion enabled because the checkbox will have no effect.
@media (prefers-reduced-motion: reduce) {
fieldset:has([name="smooth-scroll"]) {
display: none;
}
}
I went to TOWN on the CSS for my about me page just to try out some fun styling and make it more personal
I added a new article in my Dreams section, because my latest dreams involved being in Pecacony in Honkai Star Rail. It wasnât a big deal for me, until Firefly briefly appeared in my dream last night with lore that wasnât available in the gameâs canon. It was a very emotional dream due to the events that inspired it, so I decided to type it all out this morning.
I made a digital shoebox page for the random webpages that donât belong anywhere else on my blog.
Thatâs such a cute name! On Sunday I added a similar page to collect misc pages, but I just called it âFun Pages.â
Guess who added syntax highlighting to her blogpage? This girl!
(I still need to fix the CSS so itâll read well.)