blog: add back arrow to blog post pages - #25587
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
|
Greptile SummaryThis PR swizzles the Docusaurus Confidence Score: 5/5Safe to merge — docs/UI only change with only P2 suggestions remaining All findings are P2: the undocumented HiringCTA is a process note, and the missing mobile breakpoint is a UX polish item. Neither blocks functionality or correctness. No files require special attention
|
| Filename | Overview |
|---|---|
| docs/my-website/src/theme/BlogPostPage/index.js | Swizzles BlogPostPage to inject BackLink and HiringCTA; HiringCTA addition is not mentioned in the PR description |
| docs/my-website/src/theme/BlogPostPage/styles.module.css | CSS module for BackLink (fixed-position) and HiringCTA; no mobile breakpoints for the fixed back link |
Flowchart
%%{init: {'theme': 'neutral'}}%%
flowchart TD
A[BlogPostPage wrapper] --> B[BackLink component\nfixed top-left arrow]
A --> C[OriginalBlogPostPage\nDocusaurus default]
A --> D[HiringCTA component\nWe are hiring banner]
A --> E[useEffect\nadd/remove blog-post-body class]
B --> F[Navigates to /blog]
D --> G[Links to ashbyhq jobs page]
Reviews (2): Last reviewed commit: "blog: style back arrow — fixed top-left ..." | Re-trigger Greptile
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
| useEffect(() => { | ||
| document.body.classList.add('blog-post-body'); | ||
| return () => document.body.classList.remove('blog-post-body'); |
There was a problem hiding this comment.
blog-post-body class has no CSS consumer
The class is toggled on document.body but a project-wide search finds no CSS rule anywhere in the repository that targets blog-post-body. This useEffect is dead code — the class is added and removed with no observable effect. Either add the intended CSS rule (e.g. in custom.css) or remove this effect entirely.
| function BackLink() { | ||
| return ( | ||
| <div className={styles.backOuter}> | ||
| <a href="/blog" className={styles.backLink}> |
There was a problem hiding this comment.
Link for internal navigation
A bare <a href="/blog"> triggers a full-page reload. Docusaurus ships @docusaurus/Link, which wraps React Router and gives client-side navigation. Consider swapping it in:
| <a href="/blog" className={styles.backLink}> | |
| <Link to="/blog" className={styles.backLink}> |
With the corresponding import added at the top:
import Link from '@docusaurus/Link';
01a0336 to
8657c4f
Compare
Codecov Report✅ All modified and coverable lines are covered by tests. 📢 Thoughts on this report? Let us know! |
* blog: add back arrow to post pages * blog: style back arrow — fixed top-left below navbar
3 participants
Relevant issues
None
Pre-Submission checklist
Type
Changes
Adds a
← Blogback link that appears fixed in the top-left corner of every blog post page, just below the navbar. Clicking it returns to/blog.BlogPostPageto injectBackLinkabove the posttop: calc(var(--ifm-navbar-height) + 1rem); left: 2rem) so it sits flush below the navbar without shifting content