Fix navbar version and language selectors visibility on tablet screens#55205
Open
perashanid wants to merge 1 commit intokubernetes:mainfrom
Open
Fix navbar version and language selectors visibility on tablet screens#55205perashanid wants to merge 1 commit intokubernetes:mainfrom
perashanid wants to merge 1 commit intokubernetes:mainfrom
Conversation
k8s-ci-robot
added
the
do-not-merge/invalid-commit-message
Contributor
|
[APPROVALNOTIFIER] This PR is NOT APPROVED This pull-request has been approved by: The full list of commands accepted by this bot can be found here. DetailsNeeds approval from an approver in each of these files:Approvers can indicate their approval by writing |
k8s-ci-robot
added
the
sig/docs
k8s-ci-robot
added
size/XS
Changed responsive classes from d-lg-block to d-md-block to make selectors visible on tablet screens (768px-991px). This fixes the issue where version and language selectors were hidden on iPad and other tablet devices.
perashanid
force-pushed
the
fix/navbar-selectors-tablet
branch
from
9234563 to
e0eba95
Compare
k8s-ci-robot
removed
the
do-not-merge/invalid-commit-message
✅ Pull request preview available for checkingBuilt without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify project configuration. |
✅ Pull request preview available for checkingBuilt without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify project configuration. |
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.
This PR fixes the navbar version and language selectors not being visible on tablet screens (iPad, iPad mini, and mobile devices in desktop mode).
Problem:
The version and language selector dropdowns in the navbar were using the Bootstrap class d-lg-block, which only displays elements on large screens (992px and above). This caused the selectors to be hidden on tablet screens (768px-991px), making it impossible for tablet users to switch versions or languages.
Solution:
Changed the responsive display classes from d-none d-lg-block to d-none d-md-block for both version selector dropdown and language selector dropdown. This change makes the selectors visible on medium screens and above (768px and above), which includes tablet devices.
Changes Made:
Testing:
The fix ensures that selectors remain hidden on mobile screens (less than 768px) where hamburger menu is used instead, selectors are now visible on tablet screens (768px-991px), selectors continue to work on desktop screens (992px and above), and there is no visual regression on existing layouts.
Related Issue: 54939