Skip to content
This repository has been archived by the owner on Jan 13, 2025. It is now read-only.

Commit

Permalink
style(dialog): Making full-screen dialogs on wide but short viewport …
Browse files Browse the repository at this point in the history
…sizes take up the full viewport.

PiperOrigin-RevId: 457992980
  • Loading branch information
sayris authored and copybara-github committed Jun 29, 2022
1 parent 9bfd12f commit 764de22
Showing 1 changed file with 3 additions and 18 deletions.
21 changes: 3 additions & 18 deletions packages/mdc-dialog/_mixins.scss
Original file line number Diff line number Diff line change
Expand Up @@ -923,25 +923,10 @@
}
}

// X-Small Screens (horizontal)
@media (max-width: 720px) and (max-height: 400px) {
@include feature-targeting.targets($feat-structure) {
// Use 100% instead of vw/vh so the url bar is taken into account on
// mobile.
height: 100%;
max-height: 100vh;
max-width: 100vw;
width: 100vw;
@include _fullscreen-header(
$close-icon-padding: variables.$close-icon-padding,
$title-side-padding: variables.$title-side-padding
);
}
@include shape-mixins.radius(0, $query: $query);
}

// X-Small Screens
@media (max-width: 600px) {
@media (max-width: 720px) and (max-height: 400px),
(max-width: 600px),
(min-width: 720px) and (max-height: 400px) {
@include feature-targeting.targets($feat-structure) {
// Use 100% instead of vw/vh so the url bar is taken into account on
// mobile.
Expand Down

0 comments on commit 764de22

Please sign in to comment.