diff --git a/pkg/templates/style.css b/pkg/templates/style.css index 91a2116..99a91ef 100644 --- a/pkg/templates/style.css +++ b/pkg/templates/style.css @@ -1 +1,279 @@ -/*Empty CSS file, expose for customization*/ \ No newline at end of file +/*Empty CSS file, expose for customization*/ + + /* Base styles */ + :root { + --primary-color: #0366d6; + --secondary-color: #586069; + --background-color: #ffffff; + --sidebar-bg: #f6f8fa; + --border-color: #e1e4e8; + --hover-color: #f1f1f1; + --text-color: #24292e; + --sidebar-width: 260px; + --breakpoint: 768px; + } + + * { + box-sizing: border-box; + } + + body { + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; + line-height: 1.5; + color: var(--text-color); + margin: 0; + padding: 0; + display: flex; + min-height: 100vh; + } + + a { + color: var(--primary-color); + text-decoration: none; + } + + a:hover { + text-decoration: underline; + } + + h1, h2, h3, h4, h5, h6 { + margin-top: 24px; + margin-bottom: 16px; + font-weight: 600; + line-height: 1.25; + } + + h1 { + font-size: 2em; + padding-bottom: 0.3em; + border-bottom: 1px solid var(--border-color); + } + + h2 { + font-size: 1.5em; + padding-bottom: 0.3em; + border-bottom: 1px solid var(--border-color); + } + + pre, code { + font-family: SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace; + font-size: 85%; + } + + pre { + padding: 16px; + overflow: auto; + line-height: 1.45; + background-color: var(--sidebar-bg); + border-radius: 3px; + } + + code { + padding: 0.2em 0.4em; + margin: 0; + background-color: rgba(27, 31, 35, 0.05); + border-radius: 3px; + } + + pre code { + padding: 0; + background-color: transparent; + } + + img { + max-width: 100%; + height: auto; + } + + table { + border-collapse: collapse; + width: 100%; + margin: 16px 0; + } + + table th, table td { + padding: 6px 13px; + border: 1px solid var(--border-color); + } + + table tr { + background-color: var(--background-color); + border-top: 1px solid var(--border-color); + } + + table tr:nth-child(2n) { + background-color: var(--sidebar-bg); + } + + /* Layout */ + .nav-sidebar { + width: var(--sidebar-width); + background-color: var(--sidebar-bg); + border-right: 1px solid var(--border-color); + overflow-y: auto; + position: sticky; + top: 0; + height: 100vh; + padding: 20px; + } + + .main-content { + flex: 1; + padding: 40px; + max-width: 1200px; + margin: 0 auto; + } + + /* Navigation */ + .repo-info { + margin-bottom: 20px; + } + + .repo-info h2 { + margin: 0; + border: none; + font-size: 1.25em; + display: flex; + align-items: center; + } + + .repo-meta { + font-size: 0.9em; + color: var(--secondary-color); + } + + .nav-links { + list-style-type: none; + padding: 0; + margin: 0 0 20px 0; + } + + .nav-links li { + margin-bottom: 8px; + } + + .nav-links a { + display: block; + padding: 6px 8px; + border-radius: 3px; + } + + .nav-links a:hover { + background-color: var(--hover-color); + text-decoration: none; + } + + .nav-links a.active { + font-weight: 600; + background-color: rgba(3, 102, 214, 0.1); + } + + .nav-section-title { + font-weight: 600; + margin: 16px 0 8px 0; + color: var(--secondary-color); + } + + .nav-footer { + margin-top: 20px; + font-size: 0.9em; + color: var(--secondary-color); + } + + /* Repository sections */ + .repo-header { + margin-bottom: 30px; + } + + .repo-stats { + display: flex; + flex-wrap: wrap; + gap: 16px; + margin-bottom: 16px; + font-size: 0.9em; + } + + .repo-stat { + display: flex; + align-items: center; + gap: 5px; + } + + .repo-section { + margin-bottom: 40px; + } + + .contributors-list { + display: flex; + flex-wrap: wrap; + gap: 20px; + margin-top: 20px; + } + + .contributor-item { + flex: 1 1 calc(33% - 20px); + min-width: 200px; + display: flex; + align-items: center; + gap: 10px; + padding: 12px; + border: 1px solid var(--border-color); + border-radius: 3px; + background-color: var(--background-color); + } + + .contributor-avatar { + width: 40px; + height: 40px; + border-radius: 50%; + background-color: var(--primary-color); + color: white; + text-align: center; + line-height: 40px; + font-size: 18px; + } + + .contributor-info { + flex: 1; + } + + .contributor-name { + font-weight: 600; + } + + .contributor-commits { + font-size: 0.9em; + color: var(--secondary-color); + } + + .page-footer { + margin-top: 40px; + padding-top: 20px; + border-top: 1px solid var(--border-color); + color: var(--secondary-color); + font-size: 0.9em; + } + + /* Mobile responsive */ + @media (max-width: 768px) { + body { + flex-direction: column; + } + + .nav-sidebar { + width: 100%; + height: auto; + position: relative; + border-right: none; + border-bottom: 1px solid var(--border-color); + padding: 15px; + } + + .main-content { + padding: 20px; + } + + .contributor-item { + flex: 1 1 100%; + } + }