| Current Path : /home/seto/indexator.pm/public/css/ |
| Current File : /home/seto/indexator.pm/public/css/app.css |
/* Indexator — custom styles */
body {
background-color: #f8f9fa;
}
/* Navbar */
.indexator-navbar {
background-color: rgba(18, 18, 20, 0.96);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
border-bottom: 1px solid rgba(255,255,255,0.07);
}
.indexator-navbar .navbar-brand {
color: #fff;
letter-spacing: 0.01em;
}
.indexator-navbar .nav-link {
font-size: 0.875rem;
transition: color 0.15s;
}
.indexator-navbar .nav-link:hover {
color: #fff !important;
}
/* URL table: constrain URL column width */
.url-cell {
max-width: 320px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* Progress bar height */
.indexator-progress {
height: 24px;
font-size: 0.85rem;
}
/* Summary cards */
.stat-card .card-body {
padding: 1rem;
}
.stat-card .stat-value {
font-size: 1.75rem;
font-weight: 700;
line-height: 1;
}
.stat-card .stat-label {
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.05em;
color: #6c757d;
}
/* Checkbox column */
.col-check {
width: 40px;
}
/* Animated badge for URLs currently being checked */
.badge-checking {
display: inline-flex;
align-items: center;
gap: 4px;
background-color: #6c757d;
color: #fff;
font-size: 0.75em;
font-weight: 600;
padding: 0.35em 0.6em;
border-radius: 0.375rem;
animation: badge-pulse 1.2s ease-in-out infinite;
}
@keyframes badge-pulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.45; }
}
/* Indexing status badge */
.badge-indexed-dot {
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 0.75rem;
color: #198754;
cursor: default;
opacity: 0.85;
}
/* Project → arrow link */
.btn-project-arrow {
background: none;
border: none;
padding: 6px 8px;
font-size: 1.1rem;
line-height: 1;
color: #adb5bd;
text-decoration: none;
border-radius: 6px;
transition: color 0.15s, background-color 0.15s;
min-width: 36px;
min-height: 36px;
display: inline-flex;
align-items: center;
justify-content: center;
}
.btn-project-arrow:hover,
.btn-project-arrow:focus {
color: #212529;
background-color: rgba(0, 0, 0, 0.06);
outline: none;
}
/* ── Project cards (redesigned list) ─────────────────────────────────── */
.project-card-inner {
border-radius: 8px;
transition: box-shadow 0.15s;
}
.project-card-inner:hover {
box-shadow: 0 4px 16px rgba(0,0,0,0.10) !important;
}
.project-stats-row {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 0 4px;
font-size: 0.82rem;
color: #495057;
}
.stat-sep {
color: #ced4da;
user-select: none;
}
.project-stats-row .stat-item {
display: inline-flex;
align-items: baseline;
gap: 3px;
}
/* Override the old .stat-card .stat-label to not conflict */
.project-stats-row .stat-label {
font-size: 0.78rem;
color: #adb5bd;
text-transform: none;
letter-spacing: 0;
font-weight: 400;
}
.project-stats-row .stat-val {
font-weight: 600;
}
.indexation-rate-big {
font-size: 1.4rem;
font-weight: 700;
line-height: 1;
}
.project-title {
font-size: 0.95rem;
}
/* Recently-used button pulse */
@keyframes recent-pulse {
0%, 100% { background-color: rgba(255, 193, 7, 0.15); color: #e67700; }
50% { background-color: rgba(255, 193, 7, 0.35); color: #e67700; }
}
.btn-recently-used {
color: #e67700 !important;
background-color: rgba(255, 193, 7, 0.15) !important;
animation: recent-pulse 2s ease-in-out infinite;
}
.btn-recently-used:hover {
animation: none;
color: #cc5500 !important;
background-color: rgba(255, 193, 7, 0.3) !important;
}
/* Spin animation for recheck icon */
@keyframes spin {
to { transform: rotate(360deg); }
}
.spin {
display: inline-block;
animation: spin 0.7s linear infinite;
}
/* Project delete icon button */
.btn-delete-project {
background: none;
border: none;
padding: 6px 8px;
font-size: 1rem;
line-height: 1;
color: #adb5bd;
cursor: pointer;
border-radius: 6px;
transition: color 0.15s, background-color 0.15s;
/* Ensure tap target is comfortable on mobile */
min-width: 36px;
min-height: 36px;
display: inline-flex;
align-items: center;
justify-content: center;
}
.btn-delete-project:hover,
.btn-delete-project:focus {
color: #dc3545;
background-color: rgba(220, 53, 69, 0.08);
outline: none;
}