This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Modified from https://developer.mozilla.org/en-US/docs/Web/API/ChildNode/remove#Polyfill | |
[ | |
Element.prototype, | |
CharacterData.prototype, | |
DocumentType.prototype, | |
].forEach(function (proto) { | |
if (!proto.hasOwnProperty('remove')) { | |
Object.defineProperty(proto, 'remove', { | |
configurable: true, | |
enumerable: true, |
(a.k.a. No framework)
- Be aware of built-in methods and properties of HTMLElement and its prototype chain.
- Node ← Element ← HTMLElement
Miscellaneous links to stuff I find interesting or useful.
- style-dictionary - quickly generate design tokens for multiple platforms
- docsify - simple documentation from markdown files
Below are details worth noting when considering to support or continue supporting Internet Explorer.
- IE is no longer actively receiving new feature updates [needs reference]
- IE11 is the only version still supported by Microsoft [needs reference]
- IE11 is only receiving patches for critical security issues [needs reference]
- IE11 has broken implemntations of valid, semantic HTML5 elements
- for unknown elements, browsers will style them as inline elements. This is problematic when you want to use valid semantic HTML5 elements to provide a11y support and the browser doesn't know about them.
- As a workaround, you have to add additional markup (
role="main"
, etc.) and CSS (main { display: block; }
) in order to drag IE forward to modern times.
NOTE: This setup assumes that your project is for a shared NPM package and your workflow has a start
script defined in package.json
.
Recommendation: git-hooks/
Since git ignores the .git/
directory, you'll need to create a separate
directory to house your version-controlled hooks. I'd recommend git-hooks/
to
make its purpose obvious. Whatever name you give your hooks directory, you'll
- A Certain Magical Index
- A Certain Scientific Accelerator
- A Certain Scientific Railgun
- BAKI
- The Big O
- Black Clover
- Bleach
- Blood Blockade Battlefront
- Boruto: Next Generations
- Castlevania (Netflix Original)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
Reset the box-sizing | |
https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ | |
*/ | |
html { | |
box-sizing: border-box; | |
} | |
*, | |
*::before, |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@mixin visuallyHidden { | |
// remove external box decoration | |
border: 0; | |
outline: none; | |
box-shadow: none; | |
// shrink as small as possible without removing | |
// content from the accessibility tree | |
width: 1px; | |
height: 1px; | |
// eliminate any space being taken up by the element |