Elgato_dark/fleet
1
0
Fork 0
mirror of https://github.com/fleetdm/fleet synced 2026-05-21 16:08:47 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 100

Website: Bring back product category switch on homepage. (#16782)

Browse source 
Closes: #16770

Changes:
- Brought back the product category switch on the homepage.
This commit is contained in:
Eric 2024-02-13 11:17:01 -06:00 committed by GitHub
parent ab508028f5
commit 5c3be09bf0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 27 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
website/assets/styles/pages/homepage.less vendored
View file

@ -240,6 +240,15 @@
margin-bottom: 120px;
max-width: 1080px;
}
[purpose='platform-block'].visible {
animation: fadeIn 0.3s forwards;
}
@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
[purpose='category-text-block'] {
max-width: 468px;
h4 {
@ -1007,6 +1016,7 @@
max-width: 480px;
[purpose='category-button'] {
width: 100%;
margin-bottom: 60px;
}
}
[purpose='endpoint-ops-image'] {
@ -1222,7 +1232,9 @@
margin-left: 0px;
}
}
[purpose='platform-block'] {
margin-bottom: 100px;
}
[purpose='testimonials'] {
margin-bottom: 40px;
}
@ -1243,6 +1255,9 @@
}
}
}
[purpose='category-text-block'] {
max-width: 100%;
}
[purpose='vuln-management-image'] {
margin-right: auto;
margin-left: auto;
@ -1445,6 +1460,9 @@
display: inline;
}
}
[purpose='platform-block'] {
margin-bottom: 80px;
}
[purpose='endpoints-banner'] {
[purpose='endpoint-banner-text'] {
margin-bottom: 32px;

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

@ -86,15 +86,15 @@
</div>
</div>
<!-- <div purpose="category-switch" class="d-flex flex-md-row flex-column justify-content-center mx-auto">
<div purpose="category-switch" class="d-flex flex-md-row flex-column justify-content-center mx-auto">
<div purpose="category-switch-option" class="security" :class="[selectedCategory === 'device-management' ? 'selected' : '']" @click="selectedCategory = 'device-management'">Device management</div>
<div purpose="category-switch-option" class="all" :class="[selectedCategory === 'endpoint-ops' ? 'selected' : '']" @click="selectedCategory = 'endpoint-ops'">Endpoint ops</div>
<div purpose="category-switch-option" class="it" :class="[selectedCategory === 'vulnerability-management' ? 'selected' : '']" @click="selectedCategory = 'vulnerability-management'">Vuln<span class="d-inline d-md-none d-lg-inline">erability</span> management</div>
<div purpose="category-tier-switch" :class="selectedCategory+'-selected'"></div>
</div> -->
</div>
<%/* Device management block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column-reverse justify-content-md-between mx-auto align-items-center">
<div purpose="platform-block" :class="[selectedCategory === 'device-management' ? 'visible' : '']" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center" v-if="selectedCategory === 'device-management'">
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Device management</h4>
<h3>Manage everything in one place</h3>
@ -108,12 +108,8 @@
</div>
</div>
<%/* Endpoint ops block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center">
<div purpose="endpoint-ops-image">
<img alt="Endpoint ops" src="images/endpoint-operations-hero-image-380x383@2x.png">
</div>
<div purpose="platform-block" :class="[selectedCategory === 'endpoint-ops' ? 'visible' : '']" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center" v-if="selectedCategory === 'endpoint-ops'">
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Endpoint ops</h4>
<h3>Focus on data, not vendors</h3>
@ -122,10 +118,13 @@
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/endpoint-ops">Start with endpoint ops</a>
</div>
</div>
<div purpose="endpoint-ops-image">
<img alt="Endpoint ops" src="images/endpoint-operations-hero-image-380x383@2x.png">
</div>
</div>
<%/* Vulnerability management block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column-reverse justify-content-md-between mx-auto align-items-center">
<div purpose="platform-block" :class="[selectedCategory === 'vulnerability-management' ? 'visible' : '']" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center" v-if="selectedCategory === 'vulnerability-management'">
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Vulnerability management</h4>
<h3>Build the vulnerability program you actually want</h3>