Website: Update homepage category buttons (#16642)

Closes: #16620

Changes:
- Updated the styles for the buttons going to product category landing
pages on the homepage.
This commit is contained in:
Eric 2024-02-06 18:17:01 -06:00 committed by GitHub
parent 78aa1b0080
commit a427058dd4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 21 additions and 3 deletions

View file

@ -252,6 +252,21 @@
p {
margin-bottom: 32px;
}
[purpose='category-button'] {
width: min-content;
height: 48px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
text-decoration: none;
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 21px;
color: #FFF;
padding: 16px 32px;
}
}
[purpose='endpoint-ops-image'] {
max-width: 380px;
@ -990,6 +1005,9 @@
}
[purpose='category-text-block'] {
max-width: 480px;
[purpose='category-button'] {
width: 100%;
}
}
[purpose='endpoint-ops-image'] {
margin-right: auto;

View file

@ -100,7 +100,7 @@
<h3>Manage everything in one place</h3>
<p>Modernize your device management practice with a single, open platform for Apple, Windows, and Linux. De-risk config changes, automate security audits, and clear the way for “zero trust access” in your org.</p>
<div>
<a purpose="animated-arrow-button-red" class="text-nowrap" href="/device-management">Start with device management</a>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/device-management">Start with device management</a>
</div>
</div>
<div purpose="device-management-image">
@ -119,7 +119,7 @@
<h3>Focus on data, not vendors</h3>
<p>Use a consistent interface to deploy, update, and manage thousands of workstations and servers with open standards and data.</p>
<div>
<a purpose="animated-arrow-button-red" class="text-nowrap" href="/endpoint-ops">Start with endpoint ops</a>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/endpoint-ops">Start with endpoint ops</a>
</div>
</div>
</div>
@ -131,7 +131,7 @@
<h3>Build the vulnerability program you actually want</h3>
<p>Show how quickly CVEs are resolved and which teams need extra help. Manage and report on vulnerabilities in operating systems, software packages, browser plugins, anywhere.</p>
<div>
<a purpose="animated-arrow-button-red" class="text-nowrap" href="/vulnerability-management">Start with vuln management</a>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/vulnerability-management">Start with vuln management</a>
</div>
</div>
<div purpose="vuln-management-image">