Skip to content

Commit a9bae7f

Browse files
authored
Fixed navigation spacing in Safari 18.3 (#7979)
1 parent 9be17e7 commit a9bae7f

File tree

5 files changed

+8
-6
lines changed

5 files changed

+8
-6
lines changed

material/templates/assets/stylesheets/main.6fdb9009.min.css

-1
This file was deleted.

material/templates/assets/stylesheets/main.8608ea7d.min.css

+1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

material/templates/assets/stylesheets/main.6fdb9009.min.css.map material/templates/assets/stylesheets/main.8608ea7d.min.css.map

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

material/templates/base.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@
4444
{% endif %}
4545
{% endblock %}
4646
{% block styles %}
47-
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.6fdb9009.min.css' | url }}">
47+
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.8608ea7d.min.css' | url }}">
4848
{% if config.theme.palette %}
4949
{% set palette = config.theme.palette %}
5050
<link rel="stylesheet" href="{{ 'assets/stylesheets/palette.06af60db.min.css' | url }}">

src/templates/assets/stylesheets/main/components/_nav.scss

+5-3
Original file line numberDiff line numberDiff line change
@@ -555,7 +555,9 @@
555555
// Hide nested navigation
556556
&__toggle ~ & {
557557
display: grid;
558-
grid-template-rows: 0fr;
558+
// Hack: we must set a minimum of 8px to work around a bug introduced in
559+
// Safari 18.3, collapsing to a height of 0 – see https://t.ly/ViA3N
560+
grid-template-rows: minmax(#{px2rem(8px)}, 0fr);
559561
visibility: collapse;
560562
opacity: 0;
561563
transition:
@@ -571,7 +573,7 @@
571573

572574
// Show nested navigation when toggle is active or indeterminate
573575
&__toggle:is(:checked, .md-toggle--indeterminate) ~ & {
574-
grid-template-rows: 1fr;
576+
grid-template-rows: minmax(#{px2rem(8px)}, 1fr);
575577
visibility: visible;
576578
opacity: 1;
577579
transition:
@@ -726,7 +728,7 @@
726728
// Hack: Always show active navigation tab on breakpoint screen, despite
727729
// of checkbox being checked or not - see https://t.ly/Qc311
728730
.md-nav[data-md-level="1"] {
729-
grid-template-rows: 1fr;
731+
grid-template-rows: minmax(#{px2rem(8px)}, 1fr);
730732
visibility: visible;
731733
opacity: 1;
732734
}

0 commit comments

Comments
 (0)