Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/muan/details-on-details

Details on <details> @ Brooklyn JS 2018/07/19.
https://github.com/muan/details-on-details

details html talk-slides

Last synced: 3 months ago
JSON representation

Details on <details> @ Brooklyn JS 2018/07/19.

Host: GitHub
URL: https://github.com/muan/details-on-details
Owner: muan
Archived: true
Created: 2018-09-04T14:15:45.000Z (about 6 years ago)
Default Branch: main
Last Pushed: 2022-05-21T14:26:23.000Z (over 2 years ago)
Last Synced: 2024-07-21T03:38:57.785Z (4 months ago)
Topics: details, html, talk-slides
Homepage:
Size: 20.5 KB
Stars: 282
Watchers: 5
Forks: 7
Open Issues: 1
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

        # Details on ``

Notes from my talk *Details on ``* at Brooklyn JS on 2018/07/19.

## Spec

- [HTML Living Standard](https://html.spec.whatwg.org/multipage/interactive-elements.html#the-details-element)

- [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details)

## Browser support

- [Can I use](http://caniuse.com/#search=details)

- [Accessible polyfill for Edge/IE – `javan/details-element-polyfill`](https://github.com/javan/details-element-polyfill)

## CSS helpers

- [Overlay utility from `primer/primer`](https://github.com/primer/css/blob/e3d988a0fde0c9421d51139cecf134996588161a/src/utilities/details.scss#L3-L19)

- [Reset utility from `primer/primer`](https://github.com/primer/css/blob/e3d988a0fde0c9421d51139cecf134996588161a/src/utilities/details.scss#L21-L28)

  - [How to style/reset `` cross browsers?](https://github.com/whatwg/html/issues/722)

  - [Spec `list-style: disclosure-closed inside`](https://html.spec.whatwg.org/#the-details-and-summary-elements)

  - [Chrome issue tracker](https://bugs.chromium.org/p/chromium/issues/detail?id=590014)

  - ~~[Firefox issue tracker](https://bugzilla.mozilla.org/show_bug.cgi?id=1221416)~~ (implemented)

  - [Safari issue tracker](https://bugs.webkit.org/show_bug.cgi?id=157323)

## Compatibility issues

- ~~[**Safari** bug with `` when used with `rem`](https://bugs.webkit.org/show_bug.cgi?id=173876)~~ (fixed) 

- [**Safari** bug with `` and `display: flex`](https://bugs.webkit.org/show_bug.cgi?id=167111)

- ~~[**Chrome** bug where `` triangle marker color doesn't update as CSS is applied](https://bugs.chromium.org/p/chromium/issues/detail?id=882462)~~ (fixed) 

## GitHub's `` dependent Custom Elements

- [``](https://github.com/github/details-dialog-element)

- [``](https://github.com/github/details-menu-element)

## Spec and background discussions

- [Should interactive elements inside of `` be banned?](https://github.com/whatwg/html/issues/2272)

- [Shouldn't/Why doesn't `toggle` event bubble?](https://github.com/whatwg/html/issues/1533)

- [Should `` be unselectable?](https://github.com/whatwg/html/issues/3191)

- [How it went from `` to `
` to ``](https://www.w3.org/html/wg/tracker/issues/83)

- [That time `` almost got removed](https://www.w3.org/html/wg/tracker/issues/93)

- [Why semantic elements and built-in accessibility are important](https://lists.w3.org/Archives/Public/public-html/2010Apr/0049.html)

- [Seaching inside of `` with `beforematch` event](https://www.chromestatus.com/feature/5400510406328320)