ampproject / ampproject/amp-toolbox-php
Add SSR transformer which adds `noscript > style[amp-noscript]` with base styles
- Dominant language
- PHP
- Stars
- 74
- Forks
- 25
- Avg merge
- 1d 15h
- Merged PRs (30d)
- 3
Description
As of https://github.com/ampproject/amphtml/issues/20609, AMP now supports a `noscript > style[amp-noscript]` element to include styles specifically targeting pages on which JS is disabled. This is particularly important to ensure that certain AMP components have all their information accessible to such users. For example, in https://github.com/ampproject/amphtml/issues/20609#issuecomment-901426550 there is the example of `amp-accordion` where all accordion sections should be forcibly expanded in no-JS context, which can be achieved with this CSS:
```css
amp-accordion > section:not([expanded]) > :last-child {
display: block !important;
}
```
(Disregard the use of `!important` not being allowed in AMP, for which I've opened https://github.com/ampproject/amphtml/issues/36051.)
In the same way as there is an `AmpRuntimeCss` transformer to inline `style[amp-custom]` there should also be a transformer to populate `noscript > style[amp-noscript]` with styles that ensure AMP components are able to be rendered accessibly to users with JS disabled. Part of this effort should include contributing base `noscript` styles to each component which we can then be downloaded from the AMP CDN.
Contributor guide
No contributing guide indexed for this repository
Research direction
Start by reading the existing AmpRuntimeCss transformer and the AMP issue references describing style[amp-noscript]. Define how a new transformer should populate noscript > style[amp-noscript], then identify the component base styles and CDN contribution process needed for accessible no-JS rendering.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- php
- Domain
- backend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100