asandikci.com/web
1
0
Fork 0
Code Issues 5 Pull requests Projects Releases Packages Wiki Activity Actions

perf(layout): optimize the main block height calculation (#1249)

Browse source 
If the post content height is smaller than the panel, there will be a large blank space between the bottom of the post and "Further Reading" section.
This commit is contained in:
Cotes Chung 2023-09-19 04:44:35 +08:00 committed by GitHub
parent 726085c647
commit 73e171b0fb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
_layouts/default.html
View file

@ -27,10 +27,10 @@ layout: compress
{% include sidebar.html lang=lang %} {% include sidebar.html lang=lang %}
<div id="main-wrapper" class="d-flex justify-content-center"> <div id="main-wrapper" class="d-flex justify-content-center">
<div class="container px-xxl-5"> <div class="container d-flex flex-column px-xxl-5">
{% include topbar.html lang=lang %} {% include topbar.html lang=lang %}
<div class="row"> <div class="row flex-grow-1">
<main <main
aria-label="Main Content" aria-label="Main Content"
class="col-12 col-lg-11 col-xl-9 px-md-4{% unless has_tail %} pb-5{% endunless %}" class="col-12 col-lg-11 col-xl-9 px-md-4{% unless has_tail %} pb-5{% endunless %}"

9
_sass/addon/commons.scss
View file

@ -372,7 +372,6 @@ i {
main { main {
line-height: 1.75; line-height: 1.75;
min-height: calc(100vh - $topbar-height - $footer-height);
h1 { h1 {
margin-top: 2rem; margin-top: 2rem;
@ -1127,6 +1126,10 @@ search {
position: relative; position: relative;
@include pl-pr(0); @include pl-pr(0);
> .container {
min-height: 100vh;
}
} }
#topbar-wrapper.row, #topbar-wrapper.row,
@ -1280,10 +1283,6 @@ search {
} }
} }
main {
min-height: calc(100vh - $topbar-height - $footer-height-large);
}
footer { footer {
@include slide; @include slide;