Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Show breadcrumbs on mobile too #784

Merged
merged 3 commits into from
Nov 29, 2021

Conversation

chalin
Copy link
Collaborator

@chalin chalin commented Nov 25, 2021

Preview, for example visit the following links on mobile or in a browser with a narrow window:

For a screenshot, see below.

No net change in the generated site files except for the nav's change in class styles, whitespace being trimmed, and the new style definition:

$ npm run build
...
$ (cd public && git diff -bw --ignore-blank-lines -I 'class="(td-breadcrumbs|d-none d-md-block d-print-none)"' -- . ':(exclude)*.xml' ':(exclude)*.map')
... see below for the syntax-highlighted diff ...
diff --git a/scss/main.css b/scss/main.css
index 5fcf278..b8f8160 100644
--- a/scss/main.css
+++ b/scss/main.css
@@ -13797,8 +13797,12 @@ nav.foldable-nav .with-child ul {
   .btn-sm, .btn-group-sm > .btn {
     border-radius: 1rem; }
 
-.breadcrumb {
-  background: none;
+@media print {
+  .td-breadcrumbs {
+    display: none !important; } }
+
+.td-breadcrumbs .breadcrumb {
+  background: inherit;
   padding-left: 0;
   padding-top: 0; }

Screenshot

@google-cla google-cla bot added the cla: yes Indicates the PR's author has signed the CLA. label Nov 25, 2021
<nav aria-label="breadcrumb" class="td-breadcrumbs">
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The only significant change here is the use of the td-breadcrumbs class. Every other change in the partial is a whitespace fix.

@chalin
Copy link
Collaborator Author

chalin commented Nov 29, 2021

I'll take #780 (comment) as a thumbs up and merge this now. I'll add support for #781 before updating the docs.

@chalin chalin merged commit e5d4dc9 into google:master Nov 29, 2021
@chalin chalin deleted the chalin-breadcrumbs-on-mobile-2021-11-25 branch November 29, 2021 16:23
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
cla: yes Indicates the PR's author has signed the CLA.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Show breadcrumbs on mobile
1 participant