Leilukin
/
leilukin-site
mirror of https://github.com/helenclx/leilukin-site.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Change headings in accessible foornotes article

This commit is contained in:
Helen Chong 2024-08-06 17:05:55 +08:00
parent 7402983bcf
commit 0676974f96
1 changed files with 2 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/articles/myarticles/accessible-footnotes.md
View File

@ -151,7 +151,7 @@ Here is my final HTML markup sample to create accessible footnotes:
As for the CSS, in addition to using the `.visually-hidden` utility class, I refer to Kitty Giraudel's ["Accessible Footnotes with CSS"](https://www.sitepoint.com/accessible-footnotes-css/) article to style the highlight background color when heading to a footnote from a reference. As for the CSS, in addition to using the `.visually-hidden` utility class, I refer to Kitty Giraudel's ["Accessible Footnotes with CSS"](https://www.sitepoint.com/accessible-footnotes-css/) article to style the highlight background color when heading to a footnote from a reference.
## Configure My Markup in Eleventy's Configurations ## Configure markdown-it-footnote in Eleventy's Configuration File
(If you do not use Eleventy, you may skip this section) (If you do not use Eleventy, you may skip this section)
@ -200,14 +200,13 @@ module.exports = function (eleventyConfig) {
} }
``` ```
If you are a fellow Eleventy user, feel free to borrow my markdown-it-footnote configurations in your own. Make sure you install markdown-it-footnote first by keying in the installation command in the terminal: If you are a fellow Eleventy user, feel free to borrow my markdown-it-footnote configurations in your own. Make sure you install markdown-it-footnote first by keying in the installation command in the terminal:
```powershell ```powershell
npm install markdown-it-footnote --save npm install markdown-it-footnote --save
``` ```
## Bonus: Alternative to Footnotes ## Bonus: Alternatives to Footnotes
As you likely have realised, footnotes are really tricky to implement on web pages, so you may be wondering: is there any alternative to footnotes? As you likely have realised, footnotes are really tricky to implement on web pages, so you may be wondering: is there any alternative to footnotes?