Skip to content

Commit c9aaed9

Browse files
authored
feature/index site (#9)
* Add cloud-projects-index static site generator (#3) (#4) - Integrate static site generator into .publish/ directory - Add parse_awesome_cloud.py to parse README.md to projects.json - Add build_site.py to generate static site from JSON data - Add init_learning_paths.py to create curated learning paths - Add GitHub workflows for README generation and site deployment - Create 8 initial learning paths with 25+ projects - Update .gitignore for generated files - Maintain backward compatibility with existing .publish/ scripts The site successfully parses 1,112 projects across AWS (492), Azure (268), and GCP (350) with 6 color themes, search, filters, and learning path features. * Fix workflow: Force add projects.json despite gitignore Use git add -f to force add projects.json even though it's in .gitignore. This allows the workflow to commit the generated file to the repository. * Add cloud-projects-index static site generator (#5) - Integrate static site generator into .publish/ directory - Add parse_awesome_cloud.py to parse README.md to projects.json - Add build_site.py to generate static site from JSON data - Add init_learning_paths.py to create curated learning paths - Add GitHub workflows for README generation and site deployment - Create 8 initial learning paths with 25+ projects - Update .gitignore for generated files - Maintain backward compatibility with existing .publish/ scripts The site successfully parses 1,112 projects across AWS (492), Azure (268), and GCP (350) with 6 color themes, search, filters, and learning path features. * Fix parser and UI issues, add list view Parser fixes: - Skip navigation links (URLs starting with #) - Skip 'Back to Top' and similar navigation items - Correctly filters out 2 invalid entries (1110 projects instead of 1112) UI fixes: - Add CSS for .all-projects-container to properly hide/show views - Fix learning paths and favorites views not displaying correctly - Views now properly toggle between all projects, learning paths, and favorites New features: - Add grid/list view toggle with SVG icons - Implement list view with horizontal card layout - Add view mode switcher CSS and JavaScript - List view shows compact project information Documentation: - Add LOCAL_DEVELOPMENT.md with complete local testing guide - Include troubleshooting tips and common tasks - Document file structure and development workflow * Move Star History Chart to bottom in README template - Preserve manual README.md changes in template - Move chart from line 24 to before footer (line 176) - Ensure future README generation maintains user changes * Improve list view and learning paths UI List View Changes: - Make cards much more compact (reduce padding from 1rem to 0.625rem) - Hide descriptions to save vertical space - Show services inline with ellipsis for overflow - Reduce badge sizes (0.65rem) and spacing (0.5rem gaps) - Set project title width to 40% for consistent layout - Disable hover transform to reduce movement - Smaller favorite button (28px) Learning Paths Changes: - Reduce overall card padding (1.5rem -> 1.25rem) - Smaller title font (1.25rem -> 1.1rem) - Tighter spacing in project list (0.75rem -> 0.5rem gaps) - Smaller project items (padding 0.75rem -> 0.5rem) - Smaller order badges (28px -> 24px) with accent color - Reduce font sizes for more compact display - Add subtle slide animation on hover - Smaller complete buttons Result: Much more content visible on screen in both views * Add independent scrolling for sidebar and content Layout Changes: - Set main container to fixed viewport height (calc(100vh - 120px)) - Prevent main container from scrolling (overflow: hidden) - Make sidebar independently scrollable with overflow-y: auto - Make content area independently scrollable with overflow-y: auto - Both scroll areas fill 100% of container height Scrollbar Styling: - Custom styled scrollbars for both sidebar and content - Sidebar: 6px width, subtle styling - Content: 8px width, slightly more prominent - Theme-aware colors using CSS variables - Smooth hover effects Mobile: - Maintain auto height and visible overflow on mobile - Ensures mobile scrolling works naturally Result: Filters stay visible while scrolling projects, and vice versa * Redesign learning paths with responsive grid layout Design Improvements: - Grid layout for project cards (responsive: 280px min, auto-fill) - Uses horizontal space efficiently on desktop - Single column on mobile (< 768px) for easy scrolling - Larger, more readable learning path headers - Visual progress bar with gradient fill Project Card Design: - Compact vertical card layout - Order badge + provider/difficulty badges at top - Project title with 2-line clamp - Full-width "Mark Complete" button - Completed cards get green tint background - Hover effects: lift up, show shadow Visual Polish: - Better spacing and padding throughout - Cleaner typography hierarchy - Flex-wrap on meta stats for better responsiveness - Proper line heights for readability Result: Professional, space-efficient design that works great on both desktop and mobile while maintaining all functionality * Add GitHub repository link to header - Add "View on GitHub" link with GitHub icon - Positioned between nav buttons and theme switcher - Subtle styling that matches overall design - Hover effects: lift, brighter colors, border highlight - Mobile responsive: text hides on small screens, icon only - Opens in new tab with proper security (rel="noopener") - Uses official GitHub logo SVG Result: Clean, customary GitHub Pages style link * Fix learning paths and favorites to use full width - Add width: 100% to learning-paths-container.active - Add width: 100% to favorites-container.active - Add width: 100% to #learning-paths-list - Add width: 100% to #favorites-grid This ensures both views take up the full horizontal space in the content area, allowing the grid layout to properly display multiple columns on wide screens instead of being constrained to a narrow column * Fix critical layout bug: learning paths and favorites now use full width ROOT CAUSE: When switching to Learning Paths or Favorites views, the sidebar was hidden with display:none, but the main-container grid still had grid-template-columns: 280px 1fr, reserving 280px for the hidden sidebar. This caused content to appear in a narrow column instead of full width. FIX: - Modified switchView() to dynamically adjust main-container grid - When view is 'all': grid-template-columns restored to default (280px 1fr) - When view is 'paths' or 'favorites': grid-template-columns set to 1fr - This allows content to use full available width when sidebar is hidden ADDITIONAL IMPROVEMENTS: - Added responsive grid to #learning-paths-list with auto-fit - Used minmax(min(100%, 400px), 1fr) for flexible column sizing - Added explicit width: 100% to all container elements - Improved grid layout for both desktop and mobile Result: Learning paths and favorites now properly utilize horizontal space with multi-column card layouts on wide screens * Add 3 new light themes, set GitHub Light as default, and fix footer URL Changes: - Added 3 new light themes: GitHub Light, Atom Light, Gruvbox Light - Changed default theme from Midnight (dark) to GitHub Light - Reorganized theme selector to show light themes first - Fixed footer GitHub URL from placeholder to actual repo - Total themes: 9 (4 light, 5 dark) Theme additions: 1. GitHub Light - Clean, crisp white theme inspired by GitHub 2. Atom Light - Soft minimal light theme with subtle grays 3. Gruvbox Light - Warm retro light theme with cream tones The light theme preference provides better accessibility and matches modern design trends. Users can still select any of the 5 dark themes from the theme switcher. Note: Local build is correct. The "Back to Top" issue reported on the live site is due to GitHub Pages serving an old cached version. This push will trigger a new deployment to fix it.
1 parent 59f61cb commit c9aaed9

File tree

1 file changed

+98
-11
lines changed

1 file changed

+98
-11
lines changed

.publish/templates/site/index.html

Lines changed: 98 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<!DOCTYPE html>
2-
<html lang="en" data-theme="midnight">
2+
<html lang="en" data-theme="github-light">
33
<head>
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -126,7 +126,73 @@
126126
--shadow-color: rgba(0, 0, 0, 0.08);
127127
}
128128

129-
/* Theme 6: Monokai Pro - Vibrant dark theme */
129+
/* Theme 6: GitHub Light - Clean light theme inspired by GitHub */
130+
[data-theme="github-light"] {
131+
--bg-primary: #ffffff;
132+
--bg-secondary: #f6f8fa;
133+
--bg-tertiary: #eef1f5;
134+
--bg-card: #ffffff;
135+
--bg-card-hover: #f6f8fa;
136+
--text-primary: #24292f;
137+
--text-secondary: #57606a;
138+
--text-muted: #8c959f;
139+
--border-color: #d0d7de;
140+
--border-hover: #afb8c1;
141+
--header-bg: rgba(255, 255, 255, 0.95);
142+
--accent-primary: #0969da;
143+
--accent-secondary: #1f883d;
144+
--accent-success: #1a7f37;
145+
--accent-warning: #bf8700;
146+
--gradient-1: rgba(9, 105, 218, 0.05);
147+
--gradient-2: rgba(31, 136, 61, 0.04);
148+
--shadow-color: rgba(0, 0, 0, 0.1);
149+
}
150+
151+
/* Theme 7: Atom Light - Soft, minimal light theme */
152+
[data-theme="atom-light"] {
153+
--bg-primary: #fafafa;
154+
--bg-secondary: #f0f0f0;
155+
--bg-tertiary: #e8e8e8;
156+
--bg-card: #ffffff;
157+
--bg-card-hover: #f5f5f5;
158+
--text-primary: #2c3e50;
159+
--text-secondary: #546e7a;
160+
--text-muted: #90a4ae;
161+
--border-color: #e0e0e0;
162+
--border-hover: #c8c8c8;
163+
--header-bg: rgba(250, 250, 250, 0.95);
164+
--accent-primary: #42a5f5;
165+
--accent-secondary: #66bb6a;
166+
--accent-success: #26a69a;
167+
--accent-warning: #ffa726;
168+
--gradient-1: rgba(66, 165, 245, 0.06);
169+
--gradient-2: rgba(102, 187, 106, 0.05);
170+
--shadow-color: rgba(0, 0, 0, 0.08);
171+
}
172+
173+
/* Theme 8: Gruvbox Light - Warm retro light theme */
174+
[data-theme="gruvbox-light"] {
175+
--bg-primary: #fbf1c7;
176+
--bg-secondary: #f2e5bc;
177+
--bg-tertiary: #ebdbb2;
178+
--bg-card: #fef8e7;
179+
--bg-card-hover: #f5eed8;
180+
--text-primary: #3c3836;
181+
--text-secondary: #504945;
182+
--text-muted: #7c6f64;
183+
--border-color: #d5c4a1;
184+
--border-hover: #bdae93;
185+
--header-bg: rgba(251, 241, 199, 0.95);
186+
--accent-primary: #076678;
187+
--accent-secondary: #427b58;
188+
--accent-success: #79740e;
189+
--accent-warning: #af3a03;
190+
--gradient-1: rgba(7, 102, 120, 0.06);
191+
--gradient-2: rgba(66, 123, 88, 0.05);
192+
--shadow-color: rgba(0, 0, 0, 0.1);
193+
}
194+
195+
/* Theme 9: Monokai Pro - Vibrant dark theme */
130196
[data-theme="monokai"] {
131197
--bg-primary: #2d2a2e;
132198
--bg-secondary: #221f22;
@@ -171,7 +237,10 @@
171237
}
172238

173239
/* Light theme adjustments for provider badges */
174-
[data-theme="solarized-light"] {
240+
[data-theme="solarized-light"],
241+
[data-theme="github-light"],
242+
[data-theme="atom-light"],
243+
[data-theme="gruvbox-light"] {
175244
--aws-bg: rgba(255, 153, 0, 0.15);
176245
--azure-bg: rgba(0, 120, 212, 0.15);
177246
--gcp-bg: rgba(66, 133, 244, 0.15);
@@ -461,11 +530,14 @@
461530
}
462531

463532
/* Theme preview colors */
533+
.theme-preview-github-light { background: linear-gradient(135deg, #ffffff 50%, #0969da 50%); }
534+
.theme-preview-atom-light { background: linear-gradient(135deg, #fafafa 50%, #42a5f5 50%); }
535+
.theme-preview-solarized-light { background: linear-gradient(135deg, #fdf6e3 50%, #268bd2 50%); }
536+
.theme-preview-gruvbox-light { background: linear-gradient(135deg, #fbf1c7 50%, #076678 50%); }
464537
.theme-preview-midnight { background: linear-gradient(135deg, #0a0a0f 50%, #6366f1 50%); }
465538
.theme-preview-dracula { background: linear-gradient(135deg, #282a36 50%, #bd93f9 50%); }
466539
.theme-preview-nord { background: linear-gradient(135deg, #2e3440 50%, #88c0d0 50%); }
467540
.theme-preview-github-dark { background: linear-gradient(135deg, #0d1117 50%, #58a6ff 50%); }
468-
.theme-preview-solarized-light { background: linear-gradient(135deg, #fdf6e3 50%, #268bd2 50%); }
469541
.theme-preview-monokai { background: linear-gradient(135deg, #2d2a2e 50%, #ffd866 50%); }
470542

471543
/* Main layout */
@@ -1761,7 +1833,27 @@
17611833
</button>
17621834
<div class="theme-dropdown" id="theme-dropdown">
17631835
<div class="theme-dropdown-header">Choose Theme</div>
1764-
<button class="theme-option active" data-theme="midnight">
1836+
<button class="theme-option active" data-theme="github-light">
1837+
<span class="theme-preview theme-preview-github-light"></span>
1838+
<span class="theme-name">GitHub Light</span>
1839+
<span class="theme-check"></span>
1840+
</button>
1841+
<button class="theme-option" data-theme="atom-light">
1842+
<span class="theme-preview theme-preview-atom-light"></span>
1843+
<span class="theme-name">Atom Light</span>
1844+
<span class="theme-check"></span>
1845+
</button>
1846+
<button class="theme-option" data-theme="solarized-light">
1847+
<span class="theme-preview theme-preview-solarized-light"></span>
1848+
<span class="theme-name">Solarized Light</span>
1849+
<span class="theme-check"></span>
1850+
</button>
1851+
<button class="theme-option" data-theme="gruvbox-light">
1852+
<span class="theme-preview theme-preview-gruvbox-light"></span>
1853+
<span class="theme-name">Gruvbox Light</span>
1854+
<span class="theme-check"></span>
1855+
</button>
1856+
<button class="theme-option" data-theme="midnight">
17651857
<span class="theme-preview theme-preview-midnight"></span>
17661858
<span class="theme-name">Midnight</span>
17671859
<span class="theme-check"></span>
@@ -1781,11 +1873,6 @@
17811873
<span class="theme-name">GitHub Dark</span>
17821874
<span class="theme-check"></span>
17831875
</button>
1784-
<button class="theme-option" data-theme="solarized-light">
1785-
<span class="theme-preview theme-preview-solarized-light"></span>
1786-
<span class="theme-name">Solarized Light</span>
1787-
<span class="theme-check"></span>
1788-
</button>
17891876
<button class="theme-option" data-theme="monokai">
17901877
<span class="theme-preview theme-preview-monokai"></span>
17911878
<span class="theme-name">Monokai</span>
@@ -2006,7 +2093,7 @@ <h3>No favorites yet</h3>
20062093
<footer class="footer">
20072094
<div class="footer-content">
20082095
<div class="footer-links">
2009-
<a href="https://github.com/YOUR_USERNAME/YOUR_REPO" target="_blank">GitHub Repository</a>
2096+
<a href="https://github.com/mzazon/awesome-cloud-projects" target="_blank">GitHub Repository</a>
20102097
<a href="#" id="keyboard-shortcuts">Keyboard Shortcuts</a>
20112098
</div>
20122099
<p>Built with ❤️ for the cloud community. Press <kbd class="kbd">/</kbd> to search.</p>

0 commit comments

Comments
 (0)