update
This commit is contained in:
parent
e347292cac
commit
91b0a3b32b
2 changed files with 195 additions and 1 deletions
|
|
@ -1019,6 +1019,139 @@ p { margin: 0 0 1em; color: var(--c-text-dim); }
|
|||
box-shadow: 0 10px 24px rgba(0, 242, 255, .35);
|
||||
}
|
||||
|
||||
/* ---------- Self-hosted Git banner ---------- */
|
||||
.mx-git-banner {
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: 1.1fr 1fr;
|
||||
gap: 48px;
|
||||
align-items: center;
|
||||
padding: 56px;
|
||||
border-radius: var(--r-xl);
|
||||
background:
|
||||
linear-gradient(135deg, rgba(0,242,255,.06), rgba(150,0,244,.10)),
|
||||
rgba(255,255,255,.03);
|
||||
border: 1px solid var(--c-border-2);
|
||||
box-shadow: var(--shadow-card), var(--shadow-glow);
|
||||
overflow: hidden;
|
||||
isolation: isolate;
|
||||
}
|
||||
.mx-git-banner-glow {
|
||||
position: absolute;
|
||||
inset: -2px;
|
||||
border-radius: inherit;
|
||||
background: var(--grad-brand);
|
||||
opacity: .25;
|
||||
filter: blur(60px);
|
||||
z-index: -1;
|
||||
pointer-events: none;
|
||||
animation: gitGlow 8s ease-in-out infinite alternate;
|
||||
}
|
||||
@keyframes gitGlow {
|
||||
0% { opacity: .15; transform: translate(-4%, -2%) scale(1); }
|
||||
100% { opacity: .35; transform: translate(4%, 2%) scale(1.05); }
|
||||
}
|
||||
.mx-git-banner-content h2 {
|
||||
font-family: var(--f-display);
|
||||
font-size: clamp(1.6rem, 2.6vw, 2.2rem);
|
||||
line-height: 1.15;
|
||||
margin: 12px 0 16px;
|
||||
}
|
||||
.mx-git-banner-content h2 code {
|
||||
font-family: var(--f-mono);
|
||||
font-size: .8em;
|
||||
padding: 4px 10px;
|
||||
border-radius: var(--r-sm);
|
||||
background: rgba(0,0,0,.35);
|
||||
border: 1px solid var(--c-border);
|
||||
color: var(--c-accent);
|
||||
white-space: nowrap;
|
||||
}
|
||||
.mx-git-banner-content p {
|
||||
color: var(--c-text-dim);
|
||||
line-height: 1.7;
|
||||
margin: 0 0 22px;
|
||||
}
|
||||
.mx-git-features {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
}
|
||||
.mx-git-features span {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 8px 14px;
|
||||
border-radius: var(--r-pill);
|
||||
background: rgba(255,255,255,.04);
|
||||
border: 1px solid var(--c-border);
|
||||
color: var(--c-text-dim);
|
||||
font-size: 13px;
|
||||
}
|
||||
.mx-git-features span i { color: var(--c-accent); }
|
||||
|
||||
/* Terminal mock */
|
||||
.mx-git-terminal {
|
||||
border-radius: var(--r-md);
|
||||
background: #0a0c18;
|
||||
border: 1px solid var(--c-border-2);
|
||||
box-shadow: var(--shadow-card);
|
||||
overflow: hidden;
|
||||
font-family: var(--f-mono);
|
||||
transform: perspective(900px) rotateY(-4deg) rotateX(2deg);
|
||||
transition: transform .6s var(--ease-out);
|
||||
}
|
||||
.mx-git-banner:hover .mx-git-terminal {
|
||||
transform: perspective(900px) rotateY(-2deg) rotateX(1deg) translateY(-4px);
|
||||
}
|
||||
.mx-git-terminal-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 10px 14px;
|
||||
background: rgba(255,255,255,.04);
|
||||
border-bottom: 1px solid var(--c-border);
|
||||
}
|
||||
.mx-git-terminal-bar > span {
|
||||
width: 11px; height: 11px;
|
||||
border-radius: 50%;
|
||||
background: #ff5f56;
|
||||
}
|
||||
.mx-git-terminal-bar > span:nth-child(2) { background: #ffbd2e; }
|
||||
.mx-git-terminal-bar > span:nth-child(3) { background: #27c93f; }
|
||||
.mx-git-terminal-title {
|
||||
margin-left: auto;
|
||||
width: auto !important;
|
||||
height: auto !important;
|
||||
border-radius: 0 !important;
|
||||
background: none !important;
|
||||
color: var(--c-text-mute);
|
||||
font-size: 12px;
|
||||
}
|
||||
.mx-git-terminal-body {
|
||||
margin: 0;
|
||||
padding: 18px 20px;
|
||||
font-size: 13px;
|
||||
line-height: 1.7;
|
||||
color: var(--c-text);
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
}
|
||||
.mx-git-terminal-body .t-prompt { color: var(--c-accent); margin-right: 6px; }
|
||||
.mx-git-terminal-body .t-str { color: #d42bff; }
|
||||
.mx-git-terminal-body .t-ok { color: #27c93f; margin-right: 6px; }
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.mx-git-banner {
|
||||
grid-template-columns: 1fr;
|
||||
padding: 36px 28px;
|
||||
gap: 32px;
|
||||
}
|
||||
.mx-git-terminal {
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* ---------- Footer ---------- */
|
||||
.mx-footer {
|
||||
padding: 40px 0;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue