Use the old toast button in Bearblog

09.06.2023

Bearblog (which this blog runs on) used to have this cool toast button at the end of the post. Recently it was changed to general looking upvote button, which I don't like.

If you want to use the old toast button (check the end of this post to see how it looks) you can achieve it with this css wizardry:

.upvote-button {
  position: relative;
}

.upvote-button::after {
  content: 'Toast this post';
  display: block;
  position: absolute;
  top: 50%;
  left: 100%;
  transform: translateY(-50%);
  padding: 5px;
}

.upvote-button:disabled::after {
  content: 'Toasted';
}

Unfortunately I couldn't get the button background color working properly (the heights of the button and the pseudo-element are different). If someone figures out how to do that lemme know :)