File tree Expand file tree Collapse file tree 2 files changed +17
-0
lines changed Expand file tree Collapse file tree 2 files changed +17
-0
lines changed Original file line number Diff line number Diff line change
1
+ ---
2
+ ' @cloudfour/patterns ' : patch
3
+ ---
4
+
5
+ Fixes issue where a page's alert container with no visible content could block pointer events toward the bottom of the viewport.
Original file line number Diff line number Diff line change 35
35
* 1. Use a $factor of 0.5 to allow the alert to bleed more into the
36
36
* content margins instead of aligning with the content itself.
37
37
* 2. Match the padding-inline for visual balance.
38
+ * 3. Prevent this container from blocking interactions with content beneath
39
+ * its `z-index` layer in case the content within his hidden but not this
40
+ * containing element.
38
41
*/
39
42
40
43
.o-page__alert {
46
49
inline-size : 100% ;
47
50
inset-block-end : 0 ;
48
51
justify-content : center ;
52
+ pointer-events : none ; // 3
49
53
position : fixed ;
50
54
z-index : z-index .$alert ;
51
55
}
52
56
57
+ /* *
58
+ * Restores pointer events for any page alert content.
59
+ */
60
+
61
+ .o-page__alert > * {
62
+ pointer-events : initial ;
63
+ }
64
+
53
65
.o-page__content {
54
66
grid-row : 3 ;
55
67
}
You can’t perform that action at this time.
0 commit comments