jprdonnelly/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-01-09 15:06:15 -05:00
Code Issues Projects Releases Wiki Activity

fix(client): fsd scroll issue (#57646)

Browse Source
This commit is contained in:
Tom
2024-12-21 20:05:37 -06:00
committed by GitHub
parent da36fe96f1
commit eddfc4c1fd
2 changed files with 20 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
client/src/templates/Introduction/components/block.tsx
View File

@@ -336,7 +336,10 @@ class Block extends Component<BlockProps> {
* so we can play with it without affecting the existing block layouts.
*/
const ChallengeListBlock = (
<ScrollableAnchor id={block}>
<>
<ScrollableAnchor id={block}>
<span className='hide-scrollable-anchor'></span>
</ScrollableAnchor>
<div
className={`block block-grid challenge-list-block ${isExpanded ? 'open' : ''}`}
>
@@ -371,7 +374,7 @@ class Block extends Component<BlockProps> {
</div>
)}
</div>
</ScrollableAnchor>
</>
);
/**
@@ -381,7 +384,10 @@ class Block extends Component<BlockProps> {
* so we can play with it without affecting the existing block layouts.
*/
const LinkBlock = (
<ScrollableAnchor id={block}>
<>
<ScrollableAnchor id={block}>
<span className='hide-scrollable-anchor'></span>
</ScrollableAnchor>
<div className='block block-grid grid-project-block grid-project-block-no-margin'>
<div className='tags-wrapper'>
{!isAudited && (
@@ -415,7 +421,7 @@ class Block extends Component<BlockProps> {
</div>
<BlockIntros intros={blockIntroArr} />
</div>
</ScrollableAnchor>
</>
);
/**
@@ -423,7 +429,10 @@ class Block extends Component<BlockProps> {
* This layout is specifically used for the new Full Stack Developer Certification.
*/
const ChallengeGridBlock = (
<ScrollableAnchor id={block}>
<>
<ScrollableAnchor id={block}>
<span className='hide-scrollable-anchor'></span>
</ScrollableAnchor>
<div
className={`block block-grid challenge-grid-block ${isExpanded ? 'open' : ''}`}
>
@@ -460,7 +469,7 @@ class Block extends Component<BlockProps> {
</div>
)}
</div>
</ScrollableAnchor>
</>
);
const layoutToComponent = {

5
client/src/templates/Introduction/intro.css
View File

@@ -11,6 +11,11 @@
overflow-wrap: break-word;
}
.hide-scrollable-anchor {
display: inline-block;
max-height: 0px;
}
.block-label {
align-self: center;
height: fit-content;