* Set autoplay video configuration according to specification:
- Do not autoplay video initially
- If the video is visible on the viewport (with a threshold of 80% of the video is visible), autoplay video, and everytime it autoplays, set the video starting point to 0
- If the video is not visible on the viewport (with a threshold of 80% of the video is not visible), pause the video
- If user screen stops at video that's currently in autoplay, the autoplay will stop after it endedand replay every 15 seconds.
- For user with reduced motion preference, show video controls.
* Add a comment explaining error in firefox if user is pressing the seek bar relatively fast.
It seems to be a bug specific to firefox.
* Reduce the threshold to 70% of the visible video on the screen.
0.7 value will make the video autoplays instantly for the `new-design-registration` variant since the video on that variant will not be shown fully on the screen at initial homepage load (in desktop screen).
* Set attribute without empty string, fix video that lacked data attribute
* Remove duplicated autoplay video setup on homepage
* Remove autoplay pause/reset on scroll away, don't play if not visible
Refactors the autoplay-video code and removes the pause/reset on scroll
away while also keeping track of the video elements visibility so that
the video doesn't immediately start playing after 15s if not visible.
We also prevent trying to call .play() before the video is in a
"canplay" state. If the video is not ready, then add an event listener
for the "canplay" event and only play() once this is fired. We only do
this once to avoid adding duplicate listeners.
We also check that the video is not playing before calling play(),
because it could still be in playback if we scroll out of view and then
back into view.
* Refactor autoplay-video to match style of similar JS enhancement implementations
* Move autoplay-video from shared/utils to features/
---------
Co-authored-by: Thomas Mees <thomas.mees@overleaf.com>
Co-authored-by: Thomas <thomas-@users.noreply.github.com>
GitOrigin-RevId: 13011af04baaeba4b8053478a09e3e4d7c960d5c
* Fix organization logos styling:
- stop forcing explicit height to the image itself, this will remove any visible stretching.
- Force 2 column for screen size < 1200px (and remove flex-wrap) to make sure no single logo that wraps to the next line.
* Update crest images with higher resolution assets
---------
Co-authored-by: M Fahru <m.fahru@overleaf.com>
GitOrigin-RevId: c463d207fdbd750cdbfe6666bb79f69dfd85c673
* fixing premium badge display on every page
* Aligning header sections and fixing buttons
This aligns the header section to the left on mobile layouts
This also fixes the buttons width on mobile layouts
GitOrigin-RevId: 795af064989272969a5707c086b422b4be58ec25
* Change h1 text content on homepage
* Change text below plans page on homepage
* Change some text copy on features overview page
GitOrigin-RevId: 7ace00041d59aa75cbc4abd79c4335fbbb089135
* Implement visual assets for the universities page
* Remove unnecessary video-w-md-90 class
* Change copy according to figma
* Add The Forgotten Sticker
GitOrigin-RevId: 731e71850d5ebd5c40a7d9c0cbb4d6a4f40cd5d9
* adding padding to images of 15px on mobile screen
* fixing margin of footer
* removing padding and changing size to xs-max
GitOrigin-RevId: 185cad8a0a21b3c800f401d3ae59b10aff1a1f58
* adding mean and a comma
* capital S
* changing so that text takes max of 2 lines
* adding new hero image
* adding correct dropbox logo
* fixing the premium badge alignment in mobile designs
* removing an extra copy of security text
GitOrigin-RevId: 5bf15b2f8d5eaa4514f952b6acfdbccab86fd9bc