Elgato_dark/fleet
1
0
Fork 0
mirror of https://github.com/fleetdm/fleet synced 2026-05-23 17:08:53 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 83

Add more padding to the docs at <990px width (#1982)

Browse source 
* remove padding class from container

* styles for >576px and 576px - 990px

* mobile styles, rearranged stylesheet to go from larger sizes to smaller sizes

* fix padding on breadcrumbs-and-search

* Update homepage.ejs
This commit is contained in:
eashaw 2021-09-10 15:31:03 -05:00 committed by GitHub
parent 61579b3b2e
commit ca9cb48ae4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 41 additions and 50 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

81
website/assets/styles/pages/docs/basic-documentation.less vendored
View file

@ -334,8 +334,9 @@
img {
display: flex;
width: 100%;
max-width: 100%;
height: auto;
margin: auto;
padding-top: 24px;
padding-bottom: 24px;
}
@ -376,36 +377,8 @@
}
// for smaller screens
@media (max-width: 991px) {
[purpose='right-sidebar'] {
width: 100%;
[purpose='subtopics'] {
color: @core-fleet-black;
a {
color: @core-vibrant-blue;
}
}
}
[purpose='content'] {
width: 100%;
h1:first-of-type {
display: none; // hides on mobile
}
}
}
// for larger screens
@media (min-width: 992px) {
@media (min-width: 990px) {
ul {
.topic {
@ -449,18 +422,6 @@
}
// .active {
// color: @core-vibrant-blue;
// position: absolute;
// height: 32px;
// transform: translate(-2px, -4px);
// border-left: 3px solid @core-vibrant-blue;
// border-radius: 2px;
// a {
// color: @core-vibrant-blue;
// }
// }
}
}
@ -471,6 +432,42 @@
}
// for smaller screens
@media (max-width: 990px) {
padding: 0px 40px;
[purpose='right-sidebar'] {
width: 100%;
[purpose='subtopics'] {
color: @core-fleet-black;
a {
color: @core-vibrant-blue;
}
}
}
[purpose='content'] {
width: 100%;
h1:first-of-type {
display: none; // hides on mobile
}
}
}
// for mobile
@media (max-width: 576px) {
padding: 0px 24px;
}
}
@import 'code-blocks.less'; // styles for code blocks and hljs

4
website/views/pages/docs/basic-documentation.ejs vendored
View file

@ -68,7 +68,7 @@
</div>
<div v-else>
<div purpose="docs-template" style="max-width: 1200px;" class="container-fluid px-3 px-sm-4 mb-5">
<div purpose="docs-template" style="max-width: 1200px;" class="container-fluid px-lg-3 mb-5">
<div purpose="breadcrumbs-and-search" class="conainer-fluid d-flex flex-column flex-lg-row justify-content-lg-between p-0 pt-4 pb-lg-2 m-0 breadcrumbs-search">
@ -188,7 +188,7 @@
</div>
<div purpose="content" id="body-content" class="d-flex flex-column p-0 px-lg-5 content" parasails-has-no-page-script>
<div purpose="content" id="body-content" class="d-flex flex-column px-lg-5 content" parasails-has-no-page-script>
<%- partial(
path.relative(
path.dirname(__filename),

6
website/views/pages/homepage.ejs vendored
View file

@ -237,12 +237,6 @@
<p class="px-4">
Teams use osquery with Fleet every day to stay secure and compliant.
</p>
<div class="logos container d-flex flex-wrap justify-content-center align-items-center pb-2 pb-md-5">
<img alt="The logo of a significant contributor, production user, and/or customer of Fleet" style="width: 160px; height: auto;" class="px-3 my-3" src="/images/logo-gusto-140x58@2x.png"/>
<img alt="The logo of a significant contributor, production user, and/or customer of Fleet" style="width: 160px; height: auto;" class="px-3 my-3" src="/images/logo-duo-93x47@2x.png"/>
<img alt="The logo of a significant contributor, production user, and/or customer of Fleet" style="width: 160px; height: auto;" class="px-3 my-3" src="/images/logo-cisco-117x70@2x.png"/>
<img alt="The logo of a significant contributor, production user, and/or customer of Fleet" style="width: 160px; height: auto;" class="px-3 my-3" src="/images/logo-adarga-112x32@2x.png"/>
</div>
<div class="btn-toolbar justify-content-center px-5 px-sm-0 pt-3 pb-5 mb-md-5">
<a
style="max-width: 220px"