mirror of
https://github.com/go-i2p/go-github-dashboard.git
synced 2025-06-16 13:54:45 -04:00
265 lines
4.3 KiB
CSS
265 lines
4.3 KiB
CSS
/* Base styles */
|
||
:root {
|
||
--primary-color: #0366d6;
|
||
--secondary-color: #586069;
|
||
--background-color: #ffffff;
|
||
--border-color: #e1e4e8;
|
||
--pr-color: #28a745;
|
||
--issue-color: #d73a49;
|
||
--discussion-color: #6f42c1;
|
||
--hover-color: #f6f8fa;
|
||
--font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
|
||
}
|
||
|
||
* {
|
||
box-sizing: border-box;
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
|
||
body {
|
||
font-family: var(--font-family);
|
||
line-height: 1.5;
|
||
color: #24292e;
|
||
background-color: var(--background-color);
|
||
padding: 20px;
|
||
max-width: 1200px;
|
||
margin: 0 auto;
|
||
}
|
||
|
||
/* Header styles */
|
||
header {
|
||
margin-bottom: 30px;
|
||
padding-bottom: 20px;
|
||
border-bottom: 1px solid var(--border-color);
|
||
}
|
||
|
||
header h1 {
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.dashboard-stats {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 15px;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.dashboard-stats span {
|
||
background-color: #f1f8ff;
|
||
border-radius: 20px;
|
||
padding: 5px 12px;
|
||
font-size: 14px;
|
||
}
|
||
|
||
.generated-at {
|
||
font-size: 14px;
|
||
color: var(--secondary-color);
|
||
}
|
||
|
||
/* Repository styles */
|
||
.repositories {
|
||
margin-bottom: 30px;
|
||
}
|
||
|
||
.repositories h2 {
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.repository {
|
||
margin-bottom: 15px;
|
||
border: 1px solid var(--border-color);
|
||
border-radius: 6px;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.repo-details {
|
||
padding: 15px;
|
||
border-bottom: 1px solid var(--border-color);
|
||
}
|
||
|
||
.repo-description {
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.repo-meta {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 15px;
|
||
font-size: 14px;
|
||
color: var(--secondary-color);
|
||
}
|
||
|
||
.repo-links {
|
||
padding: 10px 15px;
|
||
font-size: 14px;
|
||
border-top: 1px solid var(--border-color);
|
||
}
|
||
|
||
/* Collapsible sections */
|
||
.collapsible {
|
||
width: 100%;
|
||
}
|
||
|
||
.toggle {
|
||
position: absolute;
|
||
opacity: 0;
|
||
z-index: -1;
|
||
}
|
||
|
||
.toggle-label {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 12px 15px;
|
||
font-weight: 600;
|
||
cursor: pointer;
|
||
background-color: #f6f8fa;
|
||
position: relative;
|
||
}
|
||
|
||
.section-label {
|
||
border-top: 1px solid var(--border-color);
|
||
font-weight: 500;
|
||
}
|
||
|
||
.pr-label {
|
||
color: var(--pr-color);
|
||
}
|
||
|
||
.issue-label {
|
||
color: var(--issue-color);
|
||
}
|
||
|
||
.discussion-label {
|
||
color: var(--discussion-color);
|
||
}
|
||
|
||
.toggle-label::after {
|
||
content: '+';
|
||
font-size: 18px;
|
||
transition: transform 0.3s ease;
|
||
}
|
||
|
||
.toggle:checked ~ .toggle-label::after {
|
||
content: '−';
|
||
}
|
||
|
||
.collapsible-content {
|
||
max-height: 0;
|
||
overflow: hidden;
|
||
transition: max-height 0.35s ease;
|
||
}
|
||
|
||
.toggle:checked ~ .collapsible-content {
|
||
max-height: 100vh;
|
||
}
|
||
|
||
/* Table styles */
|
||
.data-table {
|
||
width: 100%;
|
||
border-collapse: collapse;
|
||
font-size: 14px;
|
||
}
|
||
|
||
.data-table th,
|
||
.data-table td {
|
||
padding: 8px 15px;
|
||
text-align: left;
|
||
border-bottom: 1px solid var(--border-color);
|
||
}
|
||
|
||
.data-table th {
|
||
background-color: #f6f8fa;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.data-table tr:hover {
|
||
background-color: var(--hover-color);
|
||
}
|
||
|
||
/* Links */
|
||
a {
|
||
color: var(--primary-color);
|
||
text-decoration: none;
|
||
}
|
||
|
||
a:hover {
|
||
text-decoration: underline;
|
||
}
|
||
|
||
/* Repository name and stats */
|
||
.repo-name {
|
||
font-size: 16px;
|
||
}
|
||
|
||
.repo-stats {
|
||
display: flex;
|
||
gap: 10px;
|
||
}
|
||
|
||
.stat {
|
||
font-size: 12px;
|
||
padding: 2px 8px;
|
||
border-radius: 12px;
|
||
background-color: #f1f8ff;
|
||
color: var(--primary-color);
|
||
}
|
||
|
||
/* Footer */
|
||
footer {
|
||
margin-top: 40px;
|
||
padding-top: 20px;
|
||
border-top: 1px solid var(--border-color);
|
||
font-size: 14px;
|
||
color: var(--secondary-color);
|
||
text-align: center;
|
||
}
|
||
|
||
/* Responsive adjustments */
|
||
@media (max-width: 768px) {
|
||
.toggle-label {
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 5px;
|
||
}
|
||
|
||
.repo-stats {
|
||
align-self: flex-start;
|
||
}
|
||
|
||
.data-table {
|
||
display: block;
|
||
overflow-x: auto;
|
||
}
|
||
|
||
.dashboard-stats {
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 5px;
|
||
}
|
||
|
||
.workflow-label {
|
||
color: #2088ff;
|
||
}
|
||
|
||
.workflow-status {
|
||
font-weight: 500;
|
||
}
|
||
|
||
.workflow-status-completed.workflow-conclusion-success {
|
||
color: #22863a;
|
||
}
|
||
|
||
.workflow-status-completed.workflow-conclusion-failure {
|
||
color: #cb2431;
|
||
}
|
||
|
||
.workflow-status-in_progress {
|
||
color: #dbab09;
|
||
}
|
||
|
||
.workflow-status-queued {
|
||
color: #6f42c1;
|
||
}
|
||
} |