alihan/awesome-reviewers
1
0
Fork 0
mirror of https://github.com/baz-scm/awesome-reviewers.git synced 2025-08-20 18:58:52 +03:00
Code Issues Packages Projects Releases Wiki Activity

Nicer UI

Browse Source
This commit is contained in:
Nimrod
2025-06-23 13:35:49 +03:00
parent 116df29987
commit a50dc8ba30
7 changed files with 207 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

176
_layouts/default.html
View File

@@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% if page.title %}{{ page.title }} - {% endif %}{{ site.title }}</title>
<meta name="description" content="{{ page.description | default: site.description }}">
<link rel="icon" type="image/x-icon" href="/favicon.png">
<style>
:root {
@@ -22,9 +23,9 @@
}
[data-theme="dark"] {
--bg-primary: #0f172a;
--bg-primary: #1c2026;
--bg-secondary: #1e293b;
--bg-card: #334155;
--bg-card: #292f38;
--text-primary: #f1f5f9;
--text-secondary: #cbd5e1;
--text-muted: #94a3b8;
@@ -58,68 +59,116 @@
.header {
background: var(--bg-card);
border-bottom: 1px solid var(--border);
padding: 1rem 0;
padding: 0.5rem 0;
position: sticky;
top: 0;
z-index: 100;
backdrop-filter: blur(10px);
}
.header-content {
display: flex;
justify-content: space-between;
display: grid;
grid-template-columns: 1fr auto 1fr;
align-items: center;
padding: 0.25rem 0;
}
.logo {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 1.25rem;
justify-content: center;
gap: 1rem;
font-size: 1.5rem;
font-weight: 700;
color: var(--text-primary);
text-decoration: none;
margin: 0 auto;
}
.logo-icon {
width: 32px;
height: 32px;
background: var(--accent);
border-radius: 6px;
width: 80px;
height: 60px;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
color: white;
font-weight: bold;
overflow: hidden;
}
.logo-light, .logo-dark {
width: 100%;
height: 100%;
object-fit: contain;
}
.header-actions {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 1rem;
}
.theme-toggle {
background: var(--bg-secondary);
.theme-switch-container {
display: flex;
justify-content: flex-start;
}
.theme-switch {
display: flex;
background: var(--bg-card);
border: 1px solid var(--border);
color: var(--text-primary);
padding: 0.5rem 1rem;
border-radius: 8px;
border-radius: 6px;
overflow: hidden;
}
.theme-option {
background: transparent;
border: none;
padding: 0.5rem 0.875rem;
cursor: pointer;
transition: all 0.2s ease;
font-size: 0.875rem;
color: var(--text-secondary);
min-width: 100px;
display: flex;
align-items: center;
gap: 0.5rem;
}
.theme-toggle:hover {
.theme-option:hover {
background: var(--border);
}
.theme-option.active {
background: var(--accent);
color: white;
}
[data-theme="dark"] .theme-option.active {
background: var(--accent);
}
.theme-icon {
fill: currentColor;
}
[data-theme="dark"] .theme-option.dark {
background: var(--accent);
color: white;
}
:root:not([data-theme="dark"]) .theme-option.light {
background: var(--accent);
color: white;
}
.deploy-btn {
background: var(--accent);
color: white;
border: none;
padding: 0.5rem 1rem;
border-radius: 8px;
padding: 0.375rem 0.75rem;
border-radius: 6px;
cursor: pointer;
font-size: 0.875rem;
font-weight: 500;
@@ -133,7 +182,7 @@
.hero {
text-align: center;
padding: 4rem 0;
background: var(--bg-secondary);
background: var(--bg-primary);
}
.hero h1 {
@@ -154,8 +203,7 @@
}
.filters {
background: var(--bg-card);
border-bottom: 1px solid var(--border);
background: var(--bg-primary);
padding: 1rem 0;
position: sticky;
top: 73px;
@@ -339,22 +387,40 @@
font-size: 2rem;
}
}
/* Custom styling for theme switch icons */
.theme-option .theme-icon {
width: 16px;
height: 16px;
}
</style>
</head>
<body>
<header class="header">
<div class="container">
<div class="header-content">
<a href="/" class="logo">
<div class="logo-icon">Av</div>
Awesome Reviewers
</a>
<div class="header-actions">
<button class="theme-toggle" onclick="toggleTheme()">
<span id="theme-text">🌙 Dark</span>
</button>
<button class="deploy-btn">Deploy</button>
<div class="theme-switch-container">
<div class="theme-switch">
<button class="theme-option light" onclick="setTheme('light')">
<svg width="16" height="16" viewBox="0 0 16 16" class="theme-icon">
<path fill-rule="evenodd" d="M8 12a4 4 0 100-8 4 4 0 000 8zM8 0a.5.5 0 01.5.5v2a.5.5 0 01-1 0v-2A.5.5 0 018 0zm0 13a.5.5 0 01.5.5v2a.5.5 0 01-1 0v-2A.5.5 0 018 13zm8-5a.5.5 0 01-.5.5h-2a.5.5 0 010-1h2a.5.5 0 01.5.5zM3 8a.5.5 0 01-.5.5h-2a.5.5 0 010-1h2A.5.5 0 013 8zm10.657-5.657a.5.5 0 010 .707l-1.414 1.415a.5.5 0 11-.707-.708l1.414-1.414a.5.5 0 01.707 0zm-9.193 9.193a.5.5 0 010 .707L3.05 13.657a.5.5 0 01-.707-.707l1.414-1.414a.5.5 0 01.707 0zm9.193 0a.5.5 0 01-.707 0L11.536 13.95a.5.5 0 01.707.707l1.414-1.414a.5.5 0 010-.707zM4.464 4.465a.5.5 0 01-.707 0L2.343 3.05a.5.5 0 11.707-.707l1.414 1.414a.5.5 0 010 .708z"/>
</svg>
<span>Light</span>
</button>
<button class="theme-option dark" onclick="setTheme('dark')">
<svg width="16" height="16" viewBox="0 0 16 16" class="theme-icon">
<path d="M6 .278a.768.768 0 01.08.858 7.208 7.208 0 00-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 01.81.316.733.733 0 01-.031.893A8.349 8.349 0 018.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 016 .278z"/>
</svg>
<span>Dark</span>
</button>
</div>
</div>
<a href="https://baz.co" class="logo" target="_blank" rel="noopener noreferrer">
<div class="logo-icon">
<img src="/assets/baz-light.svg" alt="Logo" class="logo-light" width="80" height="80">
<img src="/assets/baz-dark.svg" alt="Logo" class="logo-dark" width="80" height="80" style="display: none;">
</div>
</a>
</div>
</div>
</header>
@@ -363,35 +429,53 @@
<footer class="footer">
<div class="container">
<p>&copy; 2025 Awesome Reviewers. Ready-to-use system prompts for better code reviews.</p>
<p>&copy; 2025 Baz Technologies. Ready-to-use system prompts for better code reviews.</p>
</div>
</footer>
<script>
// Theme toggle functionality
function toggleTheme() {
// Theme switching functionality
function setTheme(theme) {
const html = document.documentElement;
const themeText = document.getElementById('theme-text');
const logoLight = document.querySelector('.logo-light');
const logoDark = document.querySelector('.logo-dark');
const lightButton = document.querySelector('.theme-option.light');
const darkButton = document.querySelector('.theme-option.dark');
if (html.getAttribute('data-theme') === 'dark') {
html.removeAttribute('data-theme');
themeText.textContent = '🌙 Dark';
localStorage.setItem('theme', 'light');
} else {
// Remove active class from both buttons
lightButton.classList.remove('active');
darkButton.classList.remove('active');
if (theme === 'dark') {
html.setAttribute('data-theme', 'dark');
themeText.textContent = '☀️ Light';
localStorage.setItem('theme', 'dark');
logoLight.style.display = 'none';
logoDark.style.display = 'block';
darkButton.classList.add('active');
} else {
html.removeAttribute('data-theme');
localStorage.setItem('theme', 'light');
logoLight.style.display = 'block';
logoDark.style.display = 'none';
lightButton.classList.add('active');
}
}
// Load saved theme
document.addEventListener('DOMContentLoaded', function() {
const savedTheme = localStorage.getItem('theme');
const themeText = document.getElementById('theme-text');
const savedTheme = localStorage.getItem('theme') || 'light';
const logoLight = document.querySelector('.logo-light');
const logoDark = document.querySelector('.logo-dark');
const lightButton = document.querySelector('.theme-option.light');
const darkButton = document.querySelector('.theme-option.dark');
if (savedTheme === 'dark') {
document.documentElement.setAttribute('data-theme', 'dark');
themeText.textContent = '☀️ Light';
logoLight.style.display = 'none';
logoDark.style.display = 'block';
darkButton.classList.add('active');
} else {
lightButton.classList.add('active');
}
});

80
_layouts/reviewer.html
View File

@@ -4,18 +4,16 @@ layout: default
<style>
.reviewer-detail {
max-width: 800px;
margin: 2rem auto;
padding: 0 1rem;
margin: 0;
padding: 0 200px;
min-height: 100vh;
}
.reviewer-detail-header {
background: var(--bg-card);
border: 1px solid var(--border);
border-radius: 12px;
border-bottom: 1px solid var(--border);
padding: 2rem;
margin-bottom: 2rem;
box-shadow: var(--shadow);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.back-link {
@@ -88,10 +86,8 @@ layout: default
.reviewer-content {
background: var(--bg-card);
border: 1px solid var(--border);
border-radius: 12px;
border-bottom: 1px solid var(--border);
padding: 2rem;
box-shadow: var(--shadow);
}
.content-header {
@@ -109,9 +105,13 @@ layout: default
color: var(--text-primary);
}
.copy-button {
background: var(--accent);
color: white;
.button-group {
display: flex;
gap: 0.75rem;
align-items: center;
}
.copy-button, .deploy-button {
border: none;
padding: 0.5rem 1rem;
border-radius: 6px;
@@ -124,12 +124,23 @@ layout: default
transition: background-color 0.2s ease;
}
.copy-button {
background: var(--accent);
color: white;
}
.copy-button:hover {
background: var(--accent-hover);
}
.copy-button.copied {
background: #10b981;
.deploy-button {
background: var(--bg-secondary);
color: var(--text-primary);
border: 1px solid var(--border);
}
.deploy-button:hover {
background: var(--border);
}
.reviewer-prompt {
@@ -150,7 +161,8 @@ layout: default
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
margin-top: 2rem;
padding: 2rem;
background: var(--bg-primary);
}
.stat-card {
@@ -174,6 +186,10 @@ layout: default
}
@media (max-width: 768px) {
.reviewer-detail {
padding: 0 5px;
}
.reviewer-detail-header {
padding: 1.5rem;
}
@@ -193,9 +209,17 @@ layout: default
align-items: stretch;
}
.button-group {
flex-direction: column;
}
.reviewer-content {
padding: 1.5rem;
}
.stats-grid {
padding: 1.5rem;
}
}
</style>
@@ -242,13 +266,23 @@ layout: default
<div class="reviewer-content">
<div class="content-header">
<h2 class="content-title">System Prompt</h2>
<button class="copy-button" onclick="copyPrompt()">
<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
<path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z"/>
<path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"/>
</svg>
<span id="copy-text">Copy Prompt</span>
</button>
<div class="button-group">
<button class="copy-button" onclick="copyPrompt()">
<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
<path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z"/>
<path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"/>
</svg>
<span id="copy-text">Copy Prompt</span>
</button>
<button class="deploy-button">
<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
<path d="M9.293 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4.707A1 1 0 0 0 13.707 4L10 .293A1 1 0 0 0 9.293 0zM9.5 3.5v-2l3 5h-2l-1-2H5v2l-3-5h2l1 2h5.5v-2l-3-5z"/>
</svg>
Deploy
</button>
</div>
</div>
<div class="reviewer-prompt" id="prompt-content">{{ content | strip }}</div>

6
assets/baz-dark.svg Normal file
View File

@@ -0,0 +1,6 @@
<svg width="1000" height="480" viewBox="0 0 1000 480" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M771.742 206.067V257.295C804.228 257.295 853.72 249.661 880.506 237.825V240.997L770.82 342.518L770.82 390.5H939.556V332.629C915.48 332.629 859.169 336.208 829.84 357.576V354.441L939.57 252.829L939.57 206.067H771.742Z" fill="#F8F3FF"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M370.136 390.626H429.198L421.081 346.324H424.317C428.757 362.273 447.191 394.17 485.404 394.17C532.486 394.17 570.654 351.327 570.654 298.478C570.654 245.628 532.486 202.785 485.404 202.785C463.871 202.785 444.203 211.746 429.198 226.527L427.556 228.186C428.097 227.626 428.644 227.072 429.198 226.527V139.505H370.136V390.626ZM511.228 298.478C511.228 325.059 494.822 346.324 469.666 346.324C444.874 346.324 429.198 325.059 429.198 298.478C429.198 271.896 444.874 250.631 469.666 250.631C494.822 250.631 511.228 271.896 511.228 298.478Z" fill="#F8F3FF"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M645.489 248.201C674.655 248.201 698.353 266.48 698.353 285.619V293.062L698.638 293.442C686.242 280.035 667.635 271.51 646.832 271.51C609.511 271.51 579.257 298.946 579.257 332.791C579.257 366.635 609.511 394.071 646.832 394.071C667.492 394.071 685.987 385.663 698.382 372.414C702.586 367.92 706.088 362.87 708.736 357.402L708.996 356.857H712.322L698.353 390.527H757.415V285.619C757.415 227.14 709.29 202.685 653.145 202.685C615.593 202.685 592.989 214.735 585.333 218.988V266.48L585.427 266.42C593.155 261.411 613.536 248.201 645.489 248.201ZM698.353 331.693C698.353 345.515 686.322 356.857 667.728 356.857C649.499 356.857 637.104 345.515 637.104 331.693C637.104 317.516 649.499 306.175 667.728 306.175C686.322 306.175 698.353 317.516 698.353 331.693Z" fill="#F8F3FF"/>
<path d="M121.508 106.564C131.041 92.5619 177.458 60.2075 228.233 59.7976C284.27 59.3445 301.832 91.9266 309.554 106.252L309.741 106.598V108.79C309.198 108.784 308.652 108.781 308.103 108.781C279.749 108.781 256.712 118.362 256.712 135.129V140.159H309.741V232.594C309.741 336.972 224.56 420.75 121.564 420.75L112.971 420.754C119.604 415.724 126.662 410.432 133.785 403.041C157.835 378.082 158.568 346.664 149.909 330.696C147.897 349.264 137.773 370.249 120.62 388.05C101.913 407.464 79.9729 419.503 60.3438 420.754C86.2987 362.516 100.909 299.989 121.508 106.564Z" fill="#F8F3FF"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

6
assets/baz-light.svg Normal file
View File

@@ -0,0 +1,6 @@
<svg width="1000" height="480" viewBox="0 0 1000 480" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M771.742 206.067V257.295C804.228 257.295 853.72 249.661 880.506 237.825V240.997L770.82 342.518L770.82 390.5H939.556V332.629C915.48 332.629 859.169 336.208 829.84 357.576V354.441L939.57 252.829L939.57 206.067H771.742Z" fill="#0F1D2A"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M370.136 390.626H429.198L421.081 346.324H424.317C428.757 362.273 447.191 394.17 485.404 394.17C532.486 394.17 570.654 351.327 570.654 298.478C570.654 245.628 532.486 202.785 485.404 202.785C463.871 202.785 444.203 211.746 429.198 226.527L427.556 228.186C428.097 227.626 428.644 227.072 429.198 226.527V139.505H370.136V390.626ZM511.228 298.478C511.228 325.059 494.822 346.324 469.666 346.324C444.874 346.324 429.198 325.059 429.198 298.478C429.198 271.896 444.874 250.631 469.666 250.631C494.822 250.631 511.228 271.896 511.228 298.478Z" fill="#0F1D2A"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M645.489 248.201C674.655 248.201 698.353 266.48 698.353 285.619V293.062L698.638 293.442C686.242 280.035 667.635 271.51 646.832 271.51C609.511 271.51 579.257 298.946 579.257 332.791C579.257 366.635 609.511 394.071 646.832 394.071C667.492 394.071 685.987 385.663 698.382 372.414C702.586 367.92 706.088 362.87 708.736 357.402L708.996 356.857H712.322L698.353 390.527H757.415V285.619C757.415 227.14 709.29 202.685 653.145 202.685C615.593 202.685 592.989 214.735 585.333 218.988V266.48L585.427 266.42C593.155 261.411 613.536 248.201 645.489 248.201ZM698.353 331.693C698.353 345.515 686.322 356.857 667.728 356.857C649.499 356.857 637.104 345.515 637.104 331.693C637.104 317.516 649.499 306.175 667.728 306.175C686.322 306.175 698.353 317.516 698.353 331.693Z" fill="#0F1D2A"/>
<path d="M121.508 106.564C131.041 92.5619 177.458 60.2075 228.233 59.7976C284.27 59.3445 301.832 91.9266 309.554 106.252L309.741 106.598V108.79C309.198 108.784 308.652 108.781 308.103 108.781C279.749 108.781 256.712 118.362 256.712 135.129V140.159H309.741V232.594C309.741 336.972 224.56 420.75 121.564 420.75L112.971 420.754C119.604 415.724 126.662 410.432 133.785 403.041C157.835 378.082 158.568 346.664 149.909 330.696C147.897 349.264 137.773 370.249 120.62 388.05C101.913 407.464 79.9729 419.503 60.3438 420.754C86.2987 362.516 100.909 299.989 121.508 106.564Z" fill="#0F1D2A"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

8
assets/logo.svg Normal file
View File

@@ -0,0 +1,8 @@
<svg width="21" height="22" viewBox="0 0 21 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="8.51562" y="8.5166" width="4.56267" height="4.56238" rx="1.30825" fill="#6C47FF"/>
<rect x="16.4375" y="17.3379" width="4.56267" height="4.56238" rx="1.30825" fill="#6C47FF"/>
<rect x="4.25781" y="4.25781" width="4.56267" height="4.56238" rx="1.30825" fill="#6C47FF"/>
<rect y="4.57764e-05" width="4.56267" height="4.56238" rx="1.30825" fill="#6C47FF"/>
<rect x="4.25781" y="12.7744" width="4.56267" height="4.56238" rx="1.30825" fill="#6C47FF"/>
<rect y="17.0344" width="4.56267" height="4.56238" rx="1.30825" fill="#6C47FF"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 640 B

0
favicon.ico
View File

BIN
favicon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 408 B