1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-21 20:55:50 +02:00

CSS & alignment tweaks

This commit is contained in:
Martijn Cuppens
2020-02-25 17:32:23 +02:00
committed by XhmikosR
parent a99c531aa7
commit 0cfd8dfddf
2 changed files with 4 additions and 19 deletions

View File

@@ -28,7 +28,6 @@ body {
} }
} }
.sidebar-sticky { .sidebar-sticky {
position: relative; position: relative;
top: 0; top: 0;
@@ -69,20 +68,6 @@ body {
text-transform: uppercase; text-transform: uppercase;
} }
/*
* Content
*/
[role="main"] {
padding-top: 133px; /* Space for fixed navbar */
}
@media (min-width: 768px) {
[role="main"] {
padding-top: 48px; /* Space for fixed navbar */
}
}
/* /*
* Navbar * Navbar
*/ */
@@ -96,8 +81,8 @@ body {
} }
.navbar .navbar-toggler { .navbar .navbar-toggler {
top: 4px; top: .25rem;
right: 4px; right: 1rem;
} }
.navbar .form-control { .navbar .form-control {

View File

@@ -11,7 +11,7 @@ extra_js:
- src: "dashboard.js" - src: "dashboard.js"
--- ---
<nav class="navbar navbar-dark fixed-top bg-dark flex-md-nowrap p-0 shadow"> <nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 shadow">
<a class="navbar-brand col-md-2 mr-0" href="#">Company name</a> <a class="navbar-brand col-md-2 mr-0" href="#">Company name</a>
<button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-toggle="collapse" data-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation"> <button class="navbar-toggler position-absolute d-md-none collapsed" type="button" data-toggle="collapse" data-target="#sidebarMenu" aria-controls="sidebarMenu" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span> <span class="navbar-toggler-icon"></span>
@@ -102,7 +102,7 @@ extra_js:
</div> </div>
</nav> </nav>
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4"> <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-md-4">
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom"> <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
<h1 class="h2">Dashboard</h1> <h1 class="h2">Dashboard</h1>
<div class="btn-toolbar mb-2 mb-md-0"> <div class="btn-toolbar mb-2 mb-md-0">