✨ Changing Inline Page Attachment Button UI #33142
Merged
gmajoulet merged 106 commits intoampproject:masterfrom Mar 12, 2021
Merged
✨ Changing Inline Page Attachment Button UI #33142gmajoulet merged 106 commits intoampproject:masterfrom
gmajoulet merged 106 commits intoampproject:masterfrom
Conversation
Co-authored-by: Enrique Marroquin <5449100+Enriqe@users.noreply.github.com>
…ing if page text is RTL of LTR
gmajoulet
approved these changes
Mar 12, 2021
westonruter
added a commit
to westonruter/amphtml
that referenced
this pull request
Mar 15, 2021
* 'master' of github.com:ampproject/amphtml: (536 commits) ✨ Send extension versions from AMPHTML ads to FIE (ampproject#33190) Update amp-autocomplete test output file (ampproject#33216) ✨ Changing Inline Page Attachment Button UI (ampproject#33142) ✨Launch no-signing (ampproject#33229) ♻️ Add logic for story ad page manager. (ampproject#33201) Migrate Bento components to V1 (ampproject#32974) 📦 Update dependency mocha to v8.3.2 (ampproject#33234) 📦 Update build system devDependencies (ampproject#33178) 🧪 [amp-consent] Turn on TCF PostMessage Proxy API Experiment (ampproject#33196) Fix amp-video amp_video_quality parameter name. (ampproject#33227) 🏗 Guard access to `BASH_ENV` during CircleCI push builds (ampproject#33231) 🏗 Clean up CircleCI merge SHA logic (ampproject#33215) 📦 Update dependency karma to v6.1.2 (ampproject#33151) 🏗 Ensure up-to-date and clean `package-lock.json` before running any CI job (ampproject#33223) Ensure that pre-stubbing always happens before the first element is upgraded (ampproject#33212) 🏗 Restore `package-lock.json` to `lockfileVersion = 1` (ampproject#33222) Fixed text align of buttons (ampproject#33217) [amp-story] ♿ Add label for next story and add i18n for pagination buttons (ampproject#33205) [amp-story-player] 📖 Rename skip-next control to skip-to-next (ampproject#33164) 🚀 Report cls-fcp and cls-vis to compare with cls (ampproject#33207) ...
muuki88
pushed a commit
to highfivve/amphtml
that referenced
this pull request
Mar 15, 2021
* moved page attachment styling to a shadow DOM * prettier formating * create open-attachment helper class * create new file * fixed exports * make this class non-overridable by publishers Co-authored-by: Enrique Marroquin <5449100+Enriqe@users.noreply.github.com> * removing active attribute * appending class list correctly * trying to make click target work * moving template to new file * pausing page nav * resync * fixes * remove manual activation * new CSS file * new CSS file * fixes * fixes * fixes * separating CSS into separate files * separating CSS into separate files * separating shadow DOM css * removing extra CSS import * removing new CSS file * removing new CSS file * removing import * separating CSS * separating CSS * separating CSS * formatting * remove CSS changes * moving container code out of mutate block * npm build * npm build * merge * merge * add flag * lint * z-index * typo * merge issue * separating inline and outlink * cleanup * added image and new chip * added new image * added arrow * newline * added multiple image API * nit * merge conflicts * change img input api to separate attributes * chip tweaks * styling fixups - matched to figma * make spans divs * added aria labels, dynamically rendered 2nd image * removed image * validator for new fields * accessibility fixes * change img to image * change img to image in attachment.html * adding localized string for accessibility * removing redundant display block * changing to data-cta-text to match other story instances * adding data- prefix and swipe up aria text * Do not allow relative paths To allow this PR to move forward and give time for the necessary transformers to be released, we're going to disallow relative URLs for now. Once the transformers are released and in production then we can allow relative URLs. * removing data prefixes for new attributes * merge master * merge master * merge master * merge master * fixes * adding internationalized aria label to new button * changing function name to with-images * validator tests * validator tests * remove package lock changes * remove package lock changes * newline * remove package lock changes * remove package lock changes * remove package lock changes * remove package lock changes * remove package lock changes * remove package lock changes * remove package lock changes * remove package lock changes * add margin to center image that is either on the left or right depending if page text is RTL of LTR * add unit tests * add internationalized aria label * example nit * prettier Co-authored-by: Enrique Marroquin <5449100+Enriqe@users.noreply.github.com> Co-authored-by: honeybadgerdontcare <honeybadgerdontcare@users.noreply.github.com>
Gregable
pushed a commit
that referenced
this pull request
Mar 15, 2021
This file contains hidden or 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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #32770.
Firebase demo: https://amp-story-inline-cta.web.app/examples/amp-story/attachment.html
To see it, be sure to set the feature flag in the console with: AMP.toggleExperiment('amp-story-page-attachment-ui-v2');.
Feature is on page 1.
Preview:

One image:

No text:
