100 lines
2.1 KiB
CSS
100 lines
2.1 KiB
CSS
.glassContainer {
|
|
background: linear-gradient(135deg, rgba(28, 28, 34, 0.92) 0%, rgba(18, 18, 22, 0.88) 100%);
|
|
backdrop-filter: blur(20px) saturate(160%);
|
|
-webkit-backdrop-filter: blur(20px) saturate(160%);
|
|
border-radius: 14px;
|
|
box-shadow:
|
|
0 4px 16px 0 rgba(0, 0, 0, 0.32),
|
|
0 1px 3px 0 rgba(0, 0, 0, 0.18) inset;
|
|
border: 1px solid rgba(60, 60, 80, 0.18);
|
|
}
|
|
|
|
.sourceCard {
|
|
border-radius: 12px;
|
|
background: linear-gradient(120deg, rgba(38, 38, 48, 0.98) 0%, rgba(24, 24, 32, 0.96) 100%);
|
|
border: 1px solid rgba(60, 60, 80, 0.22);
|
|
box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.18);
|
|
transition:
|
|
box-shadow 0.2s ease,
|
|
border-color 0.2s ease,
|
|
transform 0.2s ease;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.sourceCard:hover {
|
|
border-color: rgba(120, 120, 160, 0.35);
|
|
transform: translateY(-1px);
|
|
box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.25);
|
|
}
|
|
|
|
.selected {
|
|
border: 2px solid #34b27b;
|
|
background: linear-gradient(120deg, rgba(52, 178, 123, 0.08) 0%, rgba(38, 38, 48, 0.98) 100%);
|
|
box-shadow:
|
|
0 0 12px rgba(52, 178, 123, 0.15),
|
|
0 0 4px rgba(52, 178, 123, 0.1);
|
|
}
|
|
|
|
.selected:hover {
|
|
transform: translateY(0);
|
|
}
|
|
|
|
.icon {
|
|
width: 13px;
|
|
height: 13px;
|
|
color: #c7d2fe;
|
|
}
|
|
|
|
.name {
|
|
font-size: 0.8rem;
|
|
color: #e4e4e7;
|
|
font-weight: 500;
|
|
letter-spacing: 0.01em;
|
|
}
|
|
|
|
.cardText {
|
|
color: #a1a1aa;
|
|
font-size: 0.75rem;
|
|
}
|
|
|
|
/* Checkmark badge */
|
|
.checkBadge {
|
|
width: 18px;
|
|
height: 18px;
|
|
background: #34b27b;
|
|
border-radius: 9999px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
box-shadow: 0 0 8px rgba(52, 178, 123, 0.4);
|
|
}
|
|
|
|
/* scrollbar */
|
|
.sourceGridScroll {
|
|
scrollbar-width: thin;
|
|
scrollbar-color: rgba(52, 178, 123, 0.5) rgba(40, 40, 50, 0.6);
|
|
}
|
|
|
|
.sourceGridScroll::-webkit-scrollbar {
|
|
width: 8px;
|
|
}
|
|
|
|
.sourceGridScroll::-webkit-scrollbar-track {
|
|
background: rgba(30, 30, 38, 0.5);
|
|
border-radius: 4px;
|
|
margin: 4px 0;
|
|
}
|
|
|
|
.sourceGridScroll::-webkit-scrollbar-thumb {
|
|
background: rgba(80, 80, 100, 0.6);
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.sourceGridScroll::-webkit-scrollbar-thumb:hover {
|
|
background: rgba(52, 178, 123, 0.6);
|
|
}
|
|
|
|
.sourceGridScroll::-webkit-scrollbar-thumb:active {
|
|
background: rgba(52, 178, 123, 0.8);
|
|
}
|