knative
/
docs
mirror of https://github.com/knative/docs.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix the Trusted by spacing problems on Homepage (#3920) 

Fixes #3909
This commit is contained in:
Chris Suszynski 2021-07-02 18:56:40 +02:00 committed by GitHub
parent bed558454f
commit 018186fe23
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 40 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
overrides/assets/stylesheets/home.css
View File

@ -145,16 +145,42 @@ body {
justify-content: center;
}
.features-container {
color: #000;
background: #fff;
.usedby-container #usedby-title {
display: flex;
justify-content: center;
}
.usedby-container #usedby-title h3 {
margin-bottom: 0;
}
.logo {
.usedby-container #usedby {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.usedby-container #usedby-more {
font-style: italic;
font-size: smaller;
color: #aaa;
text-align: center;
}
.usedby-container .logo {
display: flex;
justify-content: center;
align-items: center;
margin: 1.2em;
margin: 1em 2em;
width: 170px;
}
.usedby-container .logo img {
max-width: 170px;
}
.features-container {
color: #000;
background: #fff;
}
@media only screen and (max-width: 1440px) {

18
overrides/home.html
View File

@ -77,27 +77,27 @@
<section class="usedby-container">
<div class="md-grid md-typeset" style="width: 100%">
<div style="display: flex; justify-content: center">
<h3 style="margin-bottom: 0">Trusted by:</h3>
<div id="usedby-title">
<h3>Trusted by:</h3>
</div>
<div style="display: inline-flex; justify-content: center; flex-gap: 2em; flex-wrap: wrap" id="usedby">
<div id="usedby">
<div class="logo">
<img src="images/corporate-logos/Google.svg" alt="" width="170" draggable="false" />
<img src="images/corporate-logos/Google.svg" alt="" draggable="false" />
</div>
<div class="logo">
<img src="images/corporate-logos/vmware.svg" alt="" width="150" draggable="false" />
<img src="images/corporate-logos/vmware.svg" alt="" draggable="false" />
</div>
<div class="logo">
<img src="images/corporate-logos/IBM.png" alt="" width="150" draggable="false" />
<img src="images/corporate-logos/IBM.png" alt="" draggable="false" />
</div>
<div class="logo">
<img src="images/corporate-logos/Redhat.svg" alt="" width="130" draggable="false" />
<img src="images/corporate-logos/Redhat.svg" alt="" draggable="false" />
</div>
<div class="logo">
<img src="images/corporate-logos/Triggermesh.svg" alt="" width="130" draggable="false" />
<img src="images/corporate-logos/Triggermesh.svg" alt="" draggable="false" />
</div>
<div class="logo" style="font-style: italic; font-size: smaller; color: #999">..and more!</div>
</div>
<div id="usedby-more">..and more!</div>
</div>
</section>