An embeddable back arrow script tag.
(on https://purarue.xyz/feed/)
Made this for a couple of my websites which are hosted as subprojects on my website
To build, yarn && yarn check && yarn build
, outputs to back-arrow-bundle.js
Add that as a script tag to the bottom of your <body>
<script src="/path/to/back-arrow-bundle.js"></script>
That adds the back arrow to the top left of the page
I host a version at https://purarue.xyz/p/back-arrow-bundle.js
To configure, uses meta tags, like:
<head>
...
<!-- on hover, where to link to, and the color -->
<meta property="ba:title" content="back home" />
<meta property="ba:url" content="https://mywebsite.com/home" />
<meta property="ba:color" content="#fd6c6c" />
</head>
To customize positioning further, can overwrite the default CSS using !important
, like:
.back-arrow {
margin-top: 0.5rem !important;
margin-left: 0.5rem !important;
top: 60px !important;
z-index: 9999 !important;
}