99 lines
2.8 KiB
CSS
99 lines
2.8 KiB
CSS
/* awesome-agentic-ai-zh — site branding + landing-page styles.
|
|
Loaded via mkdocs.yml `extra_css`. Material defaults stay intact;
|
|
this refines brand color, the home hero, grid cards, and tables. */
|
|
|
|
/* ---- Brand color (indigo) ---- */
|
|
:root {
|
|
--md-primary-fg-color: #4f46e5;
|
|
--md-primary-fg-color--light: #6366f1;
|
|
--md-primary-fg-color--dark: #4338ca;
|
|
--md-accent-fg-color: #6366f1;
|
|
}
|
|
|
|
/* ---- Landing hero (index.md) ---- */
|
|
.aaz-hero {
|
|
text-align: center;
|
|
padding: 2.5rem 1rem 1.5rem;
|
|
}
|
|
.aaz-hero .aaz-repo {
|
|
font-family: var(--md-code-font-family);
|
|
font-size: .72rem;
|
|
color: var(--md-default-fg-color--light);
|
|
}
|
|
.aaz-hero h1 { font-size: 2.1rem; font-weight: 700; margin: .35rem 0 .25rem; }
|
|
.aaz-hero .aaz-tagline {
|
|
font-size: 1.05rem;
|
|
color: var(--md-default-fg-color--light);
|
|
max-width: 34rem;
|
|
margin: .4rem auto 1.4rem;
|
|
line-height: 1.6;
|
|
}
|
|
.aaz-cta {
|
|
display: inline-flex;
|
|
gap: .6rem;
|
|
flex-wrap: wrap;
|
|
justify-content: center;
|
|
margin-bottom: 1rem;
|
|
}
|
|
.aaz-cta .md-button { border-radius: 24px; }
|
|
.aaz-langs { display: flex; gap: .4rem; justify-content: center; flex-wrap: wrap; }
|
|
.aaz-langs a {
|
|
font-size: .72rem;
|
|
color: var(--md-default-fg-color--light);
|
|
border: 1px solid var(--md-default-fg-color--lighter);
|
|
border-radius: 20px;
|
|
padding: .15rem .7rem;
|
|
text-decoration: none;
|
|
transition: color .15s ease, border-color .15s ease, background .15s ease;
|
|
}
|
|
.aaz-langs a:hover {
|
|
color: var(--md-accent-fg-color);
|
|
border-color: var(--md-accent-fg-color);
|
|
background: var(--md-default-fg-color--lightest);
|
|
}
|
|
|
|
/* ---- Stat strip ---- */
|
|
.aaz-stats {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, 1fr);
|
|
gap: .75rem;
|
|
max-width: 40rem;
|
|
margin: 1.5rem auto;
|
|
}
|
|
.aaz-stat {
|
|
text-align: center;
|
|
padding: 1rem .4rem;
|
|
border-radius: 12px;
|
|
background: var(--md-default-fg-color--lightest);
|
|
}
|
|
.aaz-stat .aaz-num { font-size: 1.6rem; font-weight: 700; display: block; line-height: 1.2; }
|
|
.aaz-stat .aaz-lbl { font-size: .78rem; color: var(--md-default-fg-color--light); }
|
|
@media (max-width: 30rem) {
|
|
.aaz-stats { grid-template-columns: repeat(2, 1fr); }
|
|
}
|
|
|
|
/* ---- Grid-card polish (Material `.grid.cards`) ---- */
|
|
.md-typeset .grid.cards > ul > li {
|
|
border-radius: 12px;
|
|
transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
|
|
}
|
|
.md-typeset .grid.cards > ul > li:hover {
|
|
border-color: var(--md-accent-fg-color);
|
|
box-shadow: 0 4px 18px rgba(0, 0, 0, .08);
|
|
transform: translateY(-2px);
|
|
}
|
|
|
|
/* ---- Tables: tighter, rounded, hover ---- */
|
|
.md-typeset table:not([class]) {
|
|
border-radius: 10px;
|
|
overflow: hidden;
|
|
font-size: .80rem;
|
|
}
|
|
.md-typeset table:not([class]) th {
|
|
background: var(--md-default-fg-color--lightest);
|
|
font-weight: 600;
|
|
}
|
|
.md-typeset table:not([class]) tr:hover td {
|
|
background: var(--md-default-fg-color--lightest);
|
|
}
|