diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index cf1ac1e..823d0ac 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -17,6 +17,33 @@ jobs: - name: Checkout code uses: actions/checkout@v4 + - name: Set up Node.js + uses: actions/setup-node@v4 + with: + node-version: '20' + cache: 'npm' + + - name: Install Node dependencies + run: npm ci + + - name: Build CSS + run: npm run build:css + + - name: Verify CSS is up to date + run: | + # Check if the built CSS matches what's committed + if ! git diff --quiet css/main.min.css; then + echo "❌ Error: css/main.min.css is out of date!" + echo "The committed minified CSS doesn't match the SCSS source." + echo "" + echo "Please run 'npm run build:css' and commit the updated CSS file." + echo "" + echo "Differences found:" + git diff css/main.min.css + exit 1 + fi + echo "✅ CSS is up to date with SCSS source" + - name: Set up Ruby uses: ruby/setup-ruby@v1 with: diff --git a/.gitignore b/.gitignore index 048ca89..ff61052 100644 --- a/.gitignore +++ b/.gitignore @@ -1,5 +1,5 @@ # ========================= -# Cmder.net Home page +# Cmder.app Home page # ========================= # Reserved hidden directory @@ -16,6 +16,13 @@ vendor/ .bundle/ Gemfile.lock +# Node.js +node_modules/ +package-lock.json + +# Generated CSS source maps (keep the minified CSS for GitHub Pages) +css/*.map + # ========================= # Operating System Files # ========================= diff --git a/README.md b/README.md index ef04f36..e8f77dd 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,31 @@ # cmderdev.github.io -The cmder.net page. +The cmder.app page. [![CI](https://github.com/cmderdev/cmderdev.github.io/actions/workflows/ci.yml/badge.svg)](https://github.com/cmderdev/cmderdev.github.io/actions/workflows/ci.yml) + +## Development + +### Building CSS + +This project uses SCSS for styling. The source files are in `scss/` and the compiled CSS is generated in `css/`. + +To build the CSS: +```bash +npm install +npm run build:css +``` + +To watch for changes and rebuild automatically: +```bash +npm run watch:css +``` + +### Building the Site + +The site uses Jekyll for static site generation: +```bash +bundle install +bundle exec jekyll build +``` + +The built site will be in the `_site/` directory. diff --git a/css/main.min.css b/css/main.min.css new file mode 100644 index 0000000..bed01ca --- /dev/null +++ b/css/main.min.css @@ -0,0 +1 @@ +html,body,button,input,select,textarea{color:#212529}::selection{background:#b3d4fc;text-shadow:none}img{vertical-align:middle}body{background-color:#f5f5f5;font-size:.9em;font-family:"Lato",Candara,Calibri,Segoe,"Segoe UI",Optima,Arial,sans-serif;line-height:1.4}body>div.container,body>div.container-fluid{margin:2em auto;padding:0 0 2em 0;background-color:#fff;box-shadow:0 0 8px 3px #eee}main>section{margin:0 auto;widows:100%}@media(max-width: 768px){body>div.container,body>div.container-fluid{margin-top:0}}a{color:#1e90ff}h2{padding:.5em 1em;color:#444;text-align:center;font-weight:300;font-style:italic;font-size:1.2em}h2:before,h2:after{display:block;margin:.5em auto;width:50%;height:1px;background-color:#eee;content:""}h3{margin:2.3em 0 0 0;padding:8px;background-color:#eee;color:#222;text-indent:.2em;letter-spacing:.2em;font-weight:normal;font-size:1.3em}h4{margin:1em 0;color:#444;text-indent:8px;letter-spacing:.1em;font-size:1.1em;font-weight:700;text-rendering:optimizeLegibility}.btn{display:block;padding:12px 0;width:100%;border:1px solid #eee;border-radius:4px;background-color:#888;box-shadow:inset 0 0 3px rgba(0,0,0,.02) !important;color:#fff;text-shadow:0 0 1px rgba(0,0,0,.2);font-size:1.1em;outline:none;text-decoration:none;transition:background-color .3s}.btn:active:focus{outline:none;box-shadow:none}.btn.btn-secondary{border:1px solid #eee;background-color:#c4c4c4;color:#eee}.btn.btn-secondary:hover{border:1px solid #eee;background-color:#ccc;color:#eee}.btn.btn-secondary:active{border:1px solid #eee;background-color:#bbb;color:#eee}.btn.btn-primary{border:1px solid #eee;background-color:#3498db;color:#eee}.btn.btn-primary:hover{border:1px solid #eee;background-color:#5dade2;color:#eee}.btn.btn-primary:active{border:1px solid #eee !important;background-color:#1e90ff !important;color:#eee !important}header{position:relative;overflow:hidden;color:#fff;letter-spacing:.1em;font-weight:normal;font-size:1.6em;font-family:"Lato",Candara,Calibri,Segoe,"Segoe UI",Optima,Arial,sans-serif}#title_image{display:block;margin:0 auto;width:100%;height:auto}@media(max-width: 1000px){#title_image{margin-left:-10%;width:120%}}main{padding:0em 6%}#logo,#pitch{position:absolute;width:100%;text-align:center}#pitch{top:100px;color:#222;text-shadow:1px 1px 0 rgba(88,88,88,.5);font-style:italic;font-size:.6em}#logo{top:50px}#logo img{height:40px}.information img{width:100%}.information p{margin:0;padding:0 .5em;padding-bottom:3em;line-height:1.4em}.download{padding-top:1.2em;max-width:35em;text-align:center}.download>.github{margin-bottom:1.5em}#installation{text-align:left}.download small{display:inline-block;margin:.5em 0 0}footer{text-align:center;font-size:small;padding-bottom:2em}code{padding:1px 3px;border-radius:2px;color:#222;background-color:#eee;font-size:.9em;font-family:Consolas,monaco,monospace}ul{padding-left:8px;list-style:none}ul ol{margin:.5em 0;padding:0 0 0 30px;list-style:none}@media(prefers-color-scheme: dark){html,body,button,input,select,textarea{color:#e0e0e0}body{background-color:#1a1a1a}body>div.container,body>div.container-fluid{background-color:#2a2a2a;box-shadow:0 0 8px 3px #000}a{color:#5dade2}h2{color:#d0d0d0}h2:before,h2:after{background-color:#444}h3{background-color:#333;color:#e0e0e0}h4{color:#d0d0d0}#pitch{color:#e0e0e0;text-shadow:1px 1px 0 rgba(0,0,0,.8)}.btn{border:1px solid #444;background-color:#555;color:#e0e0e0}.btn.btn-secondary{border:1px solid #444;background-color:#4a4a4a;color:#e0e0e0}.btn.btn-secondary:hover{border:1px solid #555;background-color:#555;color:#e0e0e0}.btn.btn-secondary:active{border:1px solid #666;background-color:#606060;color:#e0e0e0}.btn.btn-primary{border:1px solid #2980b9;background-color:#2980b9;color:#e0e0e0}.btn.btn-primary:hover{border:1px solid #3498db;background-color:#3498db;color:#e0e0e0}.btn.btn-primary:active{border:1px solid #1e90ff !important;background-color:#1e90ff !important;color:#e0e0e0 !important}code{color:#e0e0e0;background-color:#3a3a3a}footer{color:#b0b0b0}}/*# sourceMappingURL=main.min.css.map */ diff --git a/index.html b/index.html index 1dbee5a..cf30211 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@ - + diff --git a/package.json b/package.json new file mode 100644 index 0000000..8dc49bb --- /dev/null +++ b/package.json @@ -0,0 +1,17 @@ +{ + "name": "cmderdev.github.io", + "version": "1.0.0", + "description": "The cmder.app page.", + "main": "index.js", + "scripts": { + "build:css": "sass scss/main.scss css/main.min.css --style=compressed", + "watch:css": "sass scss/main.scss css/main.min.css --watch --style=compressed", + "test": "echo \"Error: no test specified\" && exit 1" + }, + "keywords": [], + "author": "", + "license": "ISC", + "devDependencies": { + "sass": "^1.94.0" + } +} diff --git a/css/main.css b/scss/main.scss similarity index 100% rename from css/main.css rename to scss/main.scss