chore: optimize the layout of main content and search input
This commit is contained in:
parent
35cadf969d
commit
fd0f983bbe
5 changed files with 17 additions and 6 deletions
|
@ -1,6 +1,6 @@
|
|||
<!-- The Footer -->
|
||||
|
||||
<footer class="row">
|
||||
<footer class="row pl-3 pr-3">
|
||||
<div class="col-12 d-flex justify-content-between align-items-center text-muted pl-0 pr-0">
|
||||
<div class="footer-left">
|
||||
<p class="mb-0">
|
||||
|
|
|
@ -26,7 +26,7 @@ layout: compress
|
|||
{% include topbar.html %}
|
||||
|
||||
<div id="main-wrapper" class="d-flex justify-content-center">
|
||||
<div id="main" class="container">
|
||||
<div id="main" class="container pl-xl-4 pr-xl-4">
|
||||
|
||||
{{ content }}
|
||||
|
||||
|
|
|
@ -9,7 +9,7 @@ layout: default
|
|||
<div class="row">
|
||||
|
||||
<!-- core -->
|
||||
<div id="core-wrapper" class="col-12 col-lg-11 col-xl-9 pr-xl-5">
|
||||
<div id="core-wrapper" class="col-12 col-lg-11 col-xl-9 pr-xl-4">
|
||||
<div class="post pl-1 pr-1 pl-md-2 pr-md-2">
|
||||
|
||||
{% capture _content %}
|
||||
|
@ -54,7 +54,7 @@ layout: default
|
|||
<!-- tail -->
|
||||
{% if layout.tail_includes %}
|
||||
<div class="row">
|
||||
<div id="tail-wrapper" class="col-12 col-lg-11 col-xl-9 pl-4 pr-4 pr-xl-5">
|
||||
<div id="tail-wrapper" class="col-12 col-lg-11 col-xl-9 pl-3 pr-3 pr-xl-4">
|
||||
{% for _include in layout.tail_includes %}
|
||||
{% assign _include_path = _include | append: '.html' %}
|
||||
{% include {{ _include_path }} %}
|
||||
|
|
|
@ -1377,7 +1377,7 @@ $sidebar-display: "sidebar-display";
|
|||
}
|
||||
|
||||
#search-wrapper {
|
||||
max-width: 210px;
|
||||
max-width: $search-max-width;
|
||||
}
|
||||
|
||||
#search-result-wrapper {
|
||||
|
@ -1541,11 +1541,20 @@ $sidebar-display: "sidebar-display";
|
|||
left: $sidebar-width-large;
|
||||
}
|
||||
|
||||
#search-wrapper {
|
||||
margin-right: calc(#{$main-content-max-width} * 0.25 - #{$search-max-width});
|
||||
}
|
||||
|
||||
#topbar,
|
||||
#main {
|
||||
max-width: $main-content-max-width;
|
||||
}
|
||||
|
||||
#core-wrapper,
|
||||
#tail-wrapper {
|
||||
padding-right: 4.5rem !important;
|
||||
}
|
||||
|
||||
#back-to-top {
|
||||
right: calc((100vw - #{$sidebar-width-large} - #{$main-content-max-width}) / 2 + 2rem);
|
||||
}
|
||||
|
|
|
@ -20,10 +20,12 @@ $cursor-width: 2px !default; /* the cursor width of the selected tab */
|
|||
|
||||
$topbar-height: 3rem !default;
|
||||
|
||||
$search-max-width: 210px !default;
|
||||
|
||||
$footer-height: 5rem !default;
|
||||
$footer-height-mobile: 6rem !default; /* screen width: <= 576px */
|
||||
|
||||
$main-content-max-width: 1200px !default;
|
||||
$main-content-max-width: 1250px !default;
|
||||
|
||||
$bottom-min-height: 35rem !default;
|
||||
|
||||
|
|
Loading…
Reference in a new issue