feat(product tours): add banner animations#3098
Merged
Conversation
18 tasks
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
18 tasks
Contributor
Author
This stack of pull requests is managed by Graphite. Learn more about stacking. |
Contributor
Contributor
|
Size Change: +965 B (+0.02%) Total Size: 6.15 MB
ℹ️ View Unchanged
|
Member
|
@adboio A future feature request: when doing SSR it'd be cool if we could know the output of a banner during render time to avoid this. |
adboio
force-pushed
the
02-13-feat_product_tours_add_click_tracking_to_banner_actions
branch
2 times, most recently
from
d00e2bf to
36713c1
Compare
adboio
force-pushed
the
02-13-feat_product_tours_add_banner_animations
branch
from
9aeaa18 to
6acef46
Compare
adboio
added a commit
to PostHog/posthog
that referenced
this pull request
Feb 16, 2026
## Problem banners cause a pretty jarring layout shift when they appear <!-- Who are we building for, what are their needs, why is this important? --> <!-- Does this fix an issue? Uncomment the line below with the issue ID to automatically close it when merged --> <!-- Closes #ISSUE_ID --> ## Changes adds an animation toggle for banners :) | normal sticky/static banners | custom injection banners | | --- | --- | | [banner-animations.mp4 <span class="graphite__hidden">(uploaded via Graphite)</span> <img class="graphite__hidden" src="https://app.graphite.com/user-attachments/thumbnails/ea020f88-2a9b-4dd5-9dae-34441ee4bd03.mp4" />](https://app.graphite.com/user-attachments/video/ea020f88-2a9b-4dd5-9dae-34441ee4bd03.mp4)<br> | [injected-banner-animation.mp4 <span class="graphite__hidden">(uploaded via Graphite)</span> <img class="graphite__hidden" src="https://app.graphite.com/user-attachments/thumbnails/e54d2862-44de-400a-966d-c4eef45c232d.mp4" />](https://app.graphite.com/user-attachments/video/e54d2862-44de-400a-966d-c4eef45c232d.mp4)<br> | depends on PostHog/posthog-js#3098 technically supports a custom animation duration, but only exposing it as a toggle right now -- don't wanna clutter the UI until we have to 😛 <!-- If there are frontend changes, please include screenshots. --> <!-- If a reference design was involved, include a link to the relevant Figma frame! --> ## How did you test this code? <!-- Briefly describe the steps you took. --> <!-- Include automated tests if possible, otherwise describe the manual testing routine. --> <!-- Docs reminder: If this change requires updated docs, please do that! Engineers are the primary people responsible for their documentation. 🙌 --> 👉 _Stay up-to-date with_ [_PostHog coding conventions_](https://posthog.com/docs/contribute/coding-conventions) _for a smoother review._ ## Publish to changelog? <!-- For features only --> <!-- If publishing, you must provide changelog details in the #changelog Slack channel. You will receive a follow-up PR comment or notification. --> <!-- If not, write "no" or "do not publish to changelog" to explicitly opt-out of posting to #changelog. Removing this entire section will not prevent posting. -->
warpbuild-benchmark-bot bot
added a commit
to WarpBuilds/benchmarks-posthog
that referenced
this pull request
Feb 16, 2026
## Problem banners cause a pretty jarring layout shift when they appear <!-- Who are we building for, what are their needs, why is this important? --> <!-- Does this fix an issue? Uncomment the line below with the issue ID to automatically close it when merged --> <!-- Closes #ISSUE_ID --> ## Changes adds an animation toggle for banners :) | normal sticky/static banners | custom injection banners | | --- | --- | | [banner-animations.mp4 <span class="graphite__hidden">(uploaded via Graphite)</span> <img class="graphite__hidden" src="https://app.graphite.com/user-attachments/thumbnails/ea020f88-2a9b-4dd5-9dae-34441ee4bd03.mp4" />](https://app.graphite.com/user-attachments/video/ea020f88-2a9b-4dd5-9dae-34441ee4bd03.mp4)<br> | [injected-banner-animation.mp4 <span class="graphite__hidden">(uploaded via Graphite)</span> <img class="graphite__hidden" src="https://app.graphite.com/user-attachments/thumbnails/e54d2862-44de-400a-966d-c4eef45c232d.mp4" />](https://app.graphite.com/user-attachments/video/e54d2862-44de-400a-966d-c4eef45c232d.mp4)<br> | depends on PostHog/posthog-js#3098 technically supports a custom animation duration, but only exposing it as a toggle right now -- don't wanna clutter the UI until we have to 😛 <!-- If there are frontend changes, please include screenshots. --> <!-- If a reference design was involved, include a link to the relevant Figma frame! --> ## How did you test this code? <!-- Briefly describe the steps you took. --> <!-- Include automated tests if possible, otherwise describe the manual testing routine. --> <!-- Docs reminder: If this change requires updated docs, please do that! Engineers are the primary people responsible for their documentation. 🙌 --> 👉 _Stay up-to-date with_ [_PostHog coding conventions_](https://posthog.com/docs/contribute/coding-conventions) _for a smoother review._ ## Publish to changelog? <!-- For features only --> <!-- If publishing, you must provide changelog details in the #changelog Slack channel. You will receive a follow-up PR comment or notification. --> <!-- If not, write "no" or "do not publish to changelog" to explicitly opt-out of posting to #changelog. Removing this entire section will not prevent posting. -->
abhischekt
pushed a commit
to PostHog/posthog
that referenced
this pull request
Feb 17, 2026
## Problem banners cause a pretty jarring layout shift when they appear <!-- Who are we building for, what are their needs, why is this important? --> <!-- Does this fix an issue? Uncomment the line below with the issue ID to automatically close it when merged --> <!-- Closes #ISSUE_ID --> ## Changes adds an animation toggle for banners :) | normal sticky/static banners | custom injection banners | | --- | --- | | [banner-animations.mp4 <span class="graphite__hidden">(uploaded via Graphite)</span> <img class="graphite__hidden" src="https://app.graphite.com/user-attachments/thumbnails/ea020f88-2a9b-4dd5-9dae-34441ee4bd03.mp4" />](https://app.graphite.com/user-attachments/video/ea020f88-2a9b-4dd5-9dae-34441ee4bd03.mp4)<br> | [injected-banner-animation.mp4 <span class="graphite__hidden">(uploaded via Graphite)</span> <img class="graphite__hidden" src="https://app.graphite.com/user-attachments/thumbnails/e54d2862-44de-400a-966d-c4eef45c232d.mp4" />](https://app.graphite.com/user-attachments/video/e54d2862-44de-400a-966d-c4eef45c232d.mp4)<br> | depends on PostHog/posthog-js#3098 technically supports a custom animation duration, but only exposing it as a toggle right now -- don't wanna clutter the UI until we have to 😛 <!-- If there are frontend changes, please include screenshots. --> <!-- If a reference design was involved, include a link to the relevant Figma frame! --> ## How did you test this code? <!-- Briefly describe the steps you took. --> <!-- Include automated tests if possible, otherwise describe the manual testing routine. --> <!-- Docs reminder: If this change requires updated docs, please do that! Engineers are the primary people responsible for their documentation. 🙌 --> 👉 _Stay up-to-date with_ [_PostHog coding conventions_](https://posthog.com/docs/contribute/coding-conventions) _for a smoother review._ ## Publish to changelog? <!-- For features only --> <!-- If publishing, you must provide changelog details in the #changelog Slack channel. You will receive a follow-up PR comment or notification. --> <!-- If not, write "no" or "do not publish to changelog" to explicitly opt-out of posting to #changelog. Removing this entire section will not prevent posting. -->
adboio
force-pushed
the
02-13-feat_product_tours_add_banner_animations
branch
from
6acef46 to
ce78d65
Compare
adboio
force-pushed
the
02-13-feat_product_tours_add_click_tracking_to_banner_actions
branch
from
36713c1 to
8f5b490
Compare
dustinbyrne
approved these changes
Feb 18, 2026
adboio
force-pushed
the
02-13-feat_product_tours_add_click_tracking_to_banner_actions
branch
from
8f5b490 to
a9dbd6c
Compare
adboio
force-pushed
the
02-13-feat_product_tours_add_banner_animations
branch
from
ce78d65 to
c3cc338
Compare
adboio
changed the base branch from
02-13-feat_product_tours_add_click_tracking_to_banner_actions
to
graphite-base/3098
adboio
force-pushed
the
graphite-base/3098
branch
from
a9dbd6c to
d964a31
Compare
adboio
force-pushed
the
02-13-feat_product_tours_add_banner_animations
branch
from
c3cc338 to
a0434a8
Compare
adboio
force-pushed
the
02-13-feat_product_tours_add_banner_animations
branch
from
a0434a8 to
33f3d9d
Compare
Contributor
Author
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
3 participants
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.
Problem
banners cause a pretty jarring layout shift when they appear
Changes
adds an animation option for banners :)
main app pr: PostHog/posthog#47980
Release info Sub-libraries affected
Libraries affected
Checklist
If releasing new changes
pnpm changesetto generate a changeset file