Skip to content

Commit 214a142

Browse files
ENGCOM-2878: [Forwardport] Adjust page-main container height for sticky footer; fixes #15118 #17809
- Merge Pull Request #17809 from nmalevanec/magento2:2.3-develop-PR-port-17006 - Merged commits: 1. 5ca1f9c
2 parents 9d6399e + 5ca1f9c commit 214a142

File tree

2 files changed

+20
-19
lines changed

2 files changed

+20
-19
lines changed

app/design/frontend/Magento/blank/Magento_Theme/web/css/source/_module.less

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,16 @@
5252
.lib-css(background-color, @page__background-color);
5353
}
5454

55+
.page-wrapper {
56+
.lib-vendor-prefix-display(flex);
57+
.lib-vendor-prefix-flex-direction(column);
58+
min-height: 100vh; // Stretch content area for sticky footer
59+
}
60+
61+
.page-main {
62+
.lib-vendor-prefix-flex-grow(1);
63+
}
64+
5565
//
5666
// Header
5767
// ---------------------------------------------
@@ -279,17 +289,7 @@
279289
// _____________________________________________
280290

281291
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
282-
283-
html,
284-
body {
285-
height: 100%; // Stretch screen area for sticky footer
286-
}
287-
288292
.page-wrapper {
289-
.lib-vendor-prefix-display(flex);
290-
.lib-vendor-prefix-flex-direction(column);
291-
min-height: 100%; // Stretch content area for sticky footer
292-
293293
> .breadcrumbs,
294294
> .top-container,
295295
> .widget {

app/design/frontend/Magento/luma/Magento_Theme/web/css/source/_module.less

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,16 @@
6767
.lib-css(background-color, @page__background-color);
6868
}
6969

70+
.page-wrapper {
71+
.lib-vendor-prefix-display(flex);
72+
.lib-vendor-prefix-flex-direction(column);
73+
min-height: 100vh; // Stretch content area for sticky footer
74+
}
75+
76+
.page-main {
77+
.lib-vendor-prefix-flex-grow(1);
78+
}
79+
7080
//
7181
// Header
7282
// ---------------------------------------------
@@ -411,12 +421,6 @@
411421
}
412422
}
413423
}
414-
.page-footer,
415-
.copyright {
416-
bottom: 0;
417-
position: absolute;
418-
width: 100%;
419-
}
420424
}
421425

422426
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
@@ -614,10 +618,7 @@
614618
}
615619

616620
.page-wrapper {
617-
.lib-vendor-prefix-display(flex);
618-
.lib-vendor-prefix-flex-direction(column);
619621
margin: 0;
620-
min-height: 100%; // Stretch content area for sticky footer
621622
position: relative;
622623
transition: margin .3s ease-out 0s;
623624

0 commit comments

Comments
 (0)