Files
NetAlertX/docs/stylesheets/custom.css
jokob-sk 604bbbaa5b DOCS: promocards + features
Signed-off-by: jokob-sk <jokob.sk@gmail.com>
2026-01-31 15:52:04 +11:00

71 lines
1.6 KiB
CSS

/**
* Copyright 2026 UCP Authors
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/* --- PROMO CARDS --- */
.promo-card-wrapper {
display: flex;
gap: 24px;
max-width: 1200px;
margin: 60px auto;
flex-wrap: wrap;
}
.promo-card {
flex: 1;
min-width: 300px;
background-color: #f8f9fa;
border-radius: 24px;
padding: 16px 24px;
display: flex;
flex-direction: column;
align-items: flex-start;
}
.promo-card h3 {
color: #202124;
margin-top: 0;
margin-bottom: 12px;
}
.promo-card p {
margin-bottom: 16px;
flex-grow: 1;
}
.promo-button,
.learn-more-btn {
display: inline-block;
padding: 0.5rem 1.2rem;
border: 1px solid #000;
border-radius: 50px; /* Pill shape */
text-decoration: none;
color: #000;
font-weight: 500;
font-size: 0.8rem;
transition: background-color 0.2s ease-in-out;
background-color: transparent;
}
/* Ensure link buttons don't inherit blue color */
:is(a.promo-button, a.learn-more-btn):is(:link, :visited) {
color: #000;
}
.promo-button:hover,
.learn-more-btn:hover {
background-color: #e9ecef;
color: #000;
}