From 8a7847d2a3f48baafd286ac7404cdcef7b0ae3c7 Mon Sep 17 00:00:00 2001 From: Gregory Ballantine Date: Fri, 31 May 2024 08:23:56 -0400 Subject: [PATCH] [Issue #3] - Added grunt.js to run tasks; converted CSS file to SASS; created dummy CoffeeScript file --- .gitignore | 3 + Gruntfile.js | 65 +++++++++++++++ assets/scripts/kebos.coffee | 2 + assets/styles/kourend.sass | 128 ++++++++++++++++++++++++++++ package.json | 35 ++++++++ public/css/kourend.css | 156 ----------------------------------- templates/layout/header.tmpl | 1 + 7 files changed, 234 insertions(+), 156 deletions(-) create mode 100644 Gruntfile.js create mode 100644 assets/scripts/kebos.coffee create mode 100644 assets/styles/kourend.sass create mode 100644 package.json delete mode 100644 public/css/kourend.css diff --git a/.gitignore b/.gitignore index 68829e2..6978027 100644 --- a/.gitignore +++ b/.gitignore @@ -4,3 +4,6 @@ blt # Local data files data/ +# Compiled assets +public/css/ +public/js/ diff --git a/Gruntfile.js b/Gruntfile.js new file mode 100644 index 0000000..5982e2b --- /dev/null +++ b/Gruntfile.js @@ -0,0 +1,65 @@ +module.exports = function(grunt) { + + // Project configuration. + grunt.initConfig({ + pkg: grunt.file.readJSON('package.json'), + + sass: { + dist: { + options: { + style: 'compressed' + }, + files: [{ + expand: true, + cwd: 'assets/styles', + src: ['**/*.sass'], + dest: 'public/css', + ext: '.css' + }] + } + }, + + coffee: { + options: { + sourceMap: true, + style: 'compressed' + }, + files: { + expand: true, + flatten: true, + cwd: 'assets/coffee', + src: ['*.coffee'], + dest: 'public/js', + ext: '.js' + } + }, + + watch: { + css: { + files: ['assets/styles/**/*.sass'], + tasks: ['sass'], + options: { + atBegin: true, + spawn: false + } + }, + js: { + files: ['assets/scripts/**/*.js'], + tasks: ['coffee'], + options: { + atBegin: true, + spawn: false + } + } + } + }); + + // Load plugins. + grunt.loadNpmTasks('grunt-contrib-watch'); + grunt.loadNpmTasks('grunt-contrib-sass'); + grunt.loadNpmTasks('grunt-contrib-coffee'); + + // CLI tasks. + grunt.registerTask('default', ['sass', 'coffee']); + +}; diff --git a/assets/scripts/kebos.coffee b/assets/scripts/kebos.coffee new file mode 100644 index 0000000..53b9de2 --- /dev/null +++ b/assets/scripts/kebos.coffee @@ -0,0 +1,2 @@ +$ -> + console.log('DOM is ready.') diff --git a/assets/styles/kourend.sass b/assets/styles/kourend.sass new file mode 100644 index 0000000..71507a0 --- /dev/null +++ b/assets/styles/kourend.sass @@ -0,0 +1,128 @@ +html, +body + width: 100% + height: 100% + margin: 0 + padding: 0 + +body + height: auto + min-height: 100% + box-sizing: border-box + padding-top: 80px + padding-bottom: 100px + background: #eee + +a + color: teal + transition: color 180ms ease-in-out + &:hover + color: darkcyan + +button.button-primary + background: teal + transition: background 180ms ease-in-out + &:hover + background: darkcyan + +textarea + max-width: 100% + min-width: 100% + height: 100px + + +form select[multiple] + min-height: 100px + +table + border: 1px solid #ddd + border-radius: 8px + border-spacing: 0 + overflow: hidden + +table th, +table td, +table th:first-child, +table td:first-child + border: none + padding: 7px 12px + +table thead tr + border-radius: 8px 8px 0 0 + &:last-child + border-radius: 0 0 8px 8px + +table thead tr, +table tr:nth-child(even) + background: #eee + +/* Material card styles */ +.card-1 + box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24) + transition: all 0.3s cubic-bezier(.25,.8,.25,1) + &:hover + box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22) + +.card-2 + box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23) + +.card-3 + box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23) + +.card-4 + box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22) + +.card-5 + box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22) + +.container{ + max-width: 1200px + +#main-nav{ + position: fixed + top: 0 + left: 0 + width: 100% + height: 64px + background: teal + color: white + z-index: 20 + + ul + list-style: none + display: inline-block + + li + display: inline-block + margin-left: 15px + + h4 + display: inline-block + margin-left: 25px + line-height: 64px + + a + color: white + font-size: 2.25rem + line-height: 64px + transition: all 200ms ease-in-out + &:hover + color: #eee + font-size: 2.5rem + +#main-content + padding: 15px 25px + background: white + border-radius: 8px + z-index: 10 + +#main-footer + position: fixed + bottom: 0 + left: 0 + width: 100% + height: 64px + + p + margin-bottom: 5px + text-align: center diff --git a/package.json b/package.json new file mode 100644 index 0000000..e8400a5 --- /dev/null +++ b/package.json @@ -0,0 +1,35 @@ +{ + "name": "blt", + "version": "0.1.0", + "description": "Self-hosted PC hardware benchmark logging tool", + "main": "index.js", + "scripts": { + "grunt": "grunt" + }, + "repository": { + "type": "git", + "url": "gitea@git.metaunix.net:BitGoblin/blt.git" + }, + "keywords": [ + "hardware", + "benchmark", + "testing", + "PC" + ], + "author": "Gregory Ballanine ", + "uploaders": [ + { + "name": "Gregory Ballantine", + "email": "gballantine@bitgoblin.tech" + } + ], + "license": "BSD-2-Clause", + "devDependencies": { + "grunt": "^1.5.3", + "grunt-cli": "^1.4.3", + "grunt-contrib-sass": "^2.0.0", + "grunt-contrib-coffee": "^2.1.0", + "grunt-contrib-watch": "^1.1.0", + "sass": "^1.55.0" + } +} diff --git a/public/css/kourend.css b/public/css/kourend.css deleted file mode 100644 index 404620b..0000000 --- a/public/css/kourend.css +++ /dev/null @@ -1,156 +0,0 @@ -html, -body{ - width: 100%; - height: 100%; - margin: 0; - padding: 0; -} - -body{ - height: auto; - min-height: 100%; - box-sizing: border-box; - padding-top: 80px; - padding-bottom: 100px; - background: #eee; -} - -a{ - color: teal; - transition: color 180ms ease-in-out; -} -a:hover{ - color: darkcyan; -} - -button.button-primary{ - background: teal; - transition: background 180ms ease-in-out; -} -button.button-primary:hover{ - background: darkcyan; -} - -textarea{ - max-width: 100%; - min-width: 100%; - height: 100px; -} - -form select[multiple]{ - min-height: 100px; -} - -table{ - border: 1px solid #ddd; - border-radius: 8px; - border-spacing: 0; - overflow: hidden; -} - -table th, -table td, -table th:first-child, -table td:first-child{ - border: none; - padding: 7px 12px; -} - -table thead tr{ - border-radius: 8px 8px 0 0; -} -table tbody tr:last-child{ - border-radius: 0 0 8px 8px; -} - -table thead tr, -table tr:nth-child(even){ - background: #eee; -} - -/* Material card styles */ -.card-1 { - box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); - transition: all 0.3s cubic-bezier(.25,.8,.25,1); -} - -.card-1:hover { - box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22); -} - -.card-2 { - box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); -} - -.card-3 { - box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23); -} - -.card-4 { - box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22); -} - -.card-5 { - box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22); -} - -.container{ - max-width: 1200px; -} - -#main-nav{ - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 64px; - background: teal; - color: white; - z-index: 20; -} - -#main-nav ul{ - list-style: none; - display: inline-block; -} -#main-nav h4{ - display: inline-block; - margin-left: 25px; - line-height: 64px; -} -#main-nav ul li{ - display: inline-block; - margin-left: 15px; -} - -#main-nav a{ - color: white; - font-size: 2.25rem; - line-height: 64px; - transition: all 200ms ease-in-out; -} -#main-nav a:hover{ - color: #eee; - font-size: 2.5rem; -} - -#main-content{ - padding: 15px 25px; - background: white; - border-radius: 8px; - z-index: 10; -} - -#main-footer{ - position: fixed; - bottom: 0; - left: 0; - width: 100%; - height: 64px; - -} - -#main-footer p{ - margin-bottom: 5px; - text-align: center; -} diff --git a/templates/layout/header.tmpl b/templates/layout/header.tmpl index 079c279..bc4e5a3 100644 --- a/templates/layout/header.tmpl +++ b/templates/layout/header.tmpl @@ -9,6 +9,7 @@ +