50 lines
1.3 KiB
CSS
50 lines
1.3 KiB
CSS
.btn {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 0.35rem;
|
|
padding: 0.35rem 0.75rem;
|
|
border: 1px solid var(--ifm-color-emphasis-300);
|
|
border-radius: 6px;
|
|
background: var(--ifm-background-color);
|
|
color: var(--ifm-color-emphasis-700);
|
|
font-size: 0.8rem;
|
|
cursor: pointer;
|
|
transition: all 0.15s ease;
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.btn:hover {
|
|
border-color: var(--ifm-color-primary);
|
|
color: var(--ifm-color-primary);
|
|
background: var(--ifm-color-primary-contrast-background);
|
|
}
|
|
|
|
.btn.active {
|
|
border-color: var(--ifm-color-primary);
|
|
color: var(--ifm-color-primary);
|
|
background: var(--ifm-color-primary-contrast-background);
|
|
}
|
|
|
|
.toast {
|
|
position: fixed;
|
|
bottom: 2rem;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
padding: 0.5rem 1.2rem;
|
|
border-radius: 6px;
|
|
background: var(--ifm-color-emphasis-700);
|
|
color: var(--ifm-color-emphasis-100);
|
|
font-size: 0.85rem;
|
|
z-index: var(--ifm-z-index-fixed);
|
|
box-shadow: 0 2px 8px rgba(0,0,0,0.15);
|
|
animation: fadeInOut 2s ease forwards;
|
|
pointer-events: none;
|
|
}
|
|
|
|
@keyframes fadeInOut {
|
|
0% { opacity: 0; transform: translateX(-50%) translateY(8px); }
|
|
15% { opacity: 1; transform: translateX(-50%) translateY(0); }
|
|
85% { opacity: 1; transform: translateX(-50%) translateY(0); }
|
|
100% { opacity: 0; transform: translateX(-50%) translateY(-8px); }
|
|
}
|