Page MenuHomeDevCentral
Files F6847932

D3590.id9292.diff
No OneTemporary
Actions

D3590.id9292.diff
View Options

diff --git a/components/gulpfile.js b/components/gulpfile.js
deleted file mode 100644
--- a/components/gulpfile.js
+++ /dev/null
@@ -1,177 +0,0 @@
-'use strict';
-
-import plugins from 'gulp-load-plugins';
-import yargs from 'yargs';
-import browser from 'browser-sync';
-import gulp from 'gulp';
-import panini from 'panini';
-import { rimraf } from 'rimraf';
-import yaml from 'js-yaml';
-import fs from 'fs';
-import webpackStream from 'webpack-stream';
-import webpack2 from 'webpack';
-import named from 'vinyl-named';
-import uncss from 'uncss';
-import autoprefixer from 'autoprefixer';
-import imagemin from 'gulp-imagemin';
-import { gifsicle, mozjpeg, optipng, svgo } from 'gulp-imagemin';
-
-import * as dartSass from 'sass';
-import gulpSass from 'gulp-sass';
-const sass = gulpSass(dartSass);
-
-// Load all Gulp plugins into one variable
-const $ = plugins();
-
-// Check for --production flag
-const PRODUCTION = !!(yargs.argv.production);
-
-// Load settings from config.yml
-const config = loadConfig();
-
-function loadConfig() {
- const unsafe = require('js-yaml-js-types').all;
- const schema = yaml.DEFAULT_SCHEMA.extend(unsafe);
- let ymlFile = fs.readFileSync('config.yml', 'utf8');
- return yaml.load(ymlFile, { schema });
-}
-
-// Build the "dist" folder by running all of the below tasks
-// Sass must be run later so UnCSS can search for used classes in the others assets.
-gulp.task('build',
- gulp.series(clean, gulp.parallel(pages, javascript, images, copy), compileSass));
-
-// Build the site, run the server, and watch for file changes
-gulp.task('default',
- gulp.series('build', server, watch));
-
-// Delete the "dist" folder
-// This happens every time a build starts
-function clean(done) {
- rimraf.rimrafSync(config.paths.dist);
- done();
-}
-
-// Copy files out of the assets folder
-// This task skips over the "img", "js", and "scss" folders, which are parsed separately
-function copy() {
- return gulp.src(config.paths.assets)
- .pipe(gulp.dest(config.paths.dist + '/assets'));
-}
-
-// Copy page templates into finished HTML files
-function pages() {
- return gulp.src('src/pages/**/*.{html,hbs,handlebars}')
- .pipe(panini({
- root: 'src/pages/',
- layouts: 'src/layouts/',
- partials: 'src/partials/',
- data: 'src/data/',
- helpers: 'src/helpers/'
- }))
- .pipe(gulp.dest(config.paths.dist));
-}
-
-// Load updated HTML templates and partials into Panini
-function resetPages(done) {
- panini.refresh();
- done();
-}
-
-// Compile Sass into CSS
-// In production, the CSS is compressed
-function compileSass() {
-
- const postCssPlugins = [
- autoprefixer(),
- PRODUCTION && uncss.postcssPlugin(config.tasks.uncss),
- ].filter(Boolean);
-
- return gulp.src('src/assets/scss/app.scss')
- .pipe($.sourcemaps.init())
- .pipe(sass({
- includePaths: config.paths.sass
- })
- .on('error', sass.logError))
- .pipe($.postcss(postCssPlugins))
- .pipe($.if(PRODUCTION, $.cleanCss({ compatibility: 'ie9' })))
- .pipe($.if(!PRODUCTION, $.sourcemaps.write()))
- .pipe(gulp.dest(config.paths.dist + '/assets/css'))
- .pipe(browser.reload({ stream: true }));
-}
-
-let webpackConfig = {
- mode: (PRODUCTION ? 'production' : 'development'),
- module: {
- rules: [
- {
- test: /\.js$/,
- use: {
- loader: 'babel-loader',
- options: {
- presets: [ "@babel/preset-env" ],
- compact: false
- }
- }
- }
- ]
- },
- devtool: !PRODUCTION && 'source-map'
-}
-
-// Combine JavaScript into one file
-// In production, the file is minified
-function javascript() {
- return gulp.src(config.paths.entries)
- .pipe(named())
- .pipe($.sourcemaps.init())
- .pipe(webpackStream(webpackConfig, webpack2))
- .pipe($.if(PRODUCTION, $.uglify()
- .on('error', e => { console.log(e); })
- ))
- .pipe($.if(!PRODUCTION, $.sourcemaps.write()))
- .pipe(gulp.dest(config.paths.dist + '/assets/js'));
-}
-
-// Copy images to the "dist" folder
-// In production, the images are compressed
-function images() {
- return gulp.src('src/assets/img/**/*')
- .pipe($.if(PRODUCTION, imagemin([
- gifsicle({interlaced: true}),
- mozjpeg({quality: 85, progressive: true}),
- optipng({optimizationLevel: 5}),
- svgo({
- plugins: [
- {removeViewBox: true},
- {cleanupIDs: false}
- ]
- })
- ])))
- .pipe(gulp.dest(config.paths.dist + '/assets/img'));
-}
-
-// Start a server with BrowserSync to preview the site in
-function server(done) {
- browser.init({
- server: config.paths.dist, port: config.dev.port
- }, done);
-}
-
-// Reload the browser with BrowserSync
-function reload(done) {
- browser.reload();
- done();
-}
-
-// Watch for changes to static assets, pages, Sass, and JavaScript
-function watch() {
- gulp.watch(config.paths.assets, copy);
- gulp.watch('src/pages/**/*.html').on('all', gulp.series(pages, browser.reload));
- gulp.watch('src/{layouts,partials}/**/*.html').on('all', gulp.series(resetPages, pages, browser.reload));
- gulp.watch('src/data/**/*.{js,json,yml}').on('all', gulp.series(resetPages, pages, browser.reload));
- gulp.watch('src/helpers/**/*.js').on('all', gulp.series(resetPages, pages, browser.reload));
- gulp.watch('src/assets/scss/**/*.scss').on('all', compileSass);
- gulp.watch('src/assets/js/**/*.js').on('all', gulp.series(javascript, browser.reload));
- gulp.watch('src/assets/img/**/*').on('all', gulp.series(images, browser.reload));
-}
diff --git a/components/package-template.json b/components/package-template.json
--- a/components/package-template.json
+++ b/components/package-template.json
@@ -5,41 +5,43 @@
"build": "gulp build --production"
},
"dependencies": {
- "foundation-sites": "~6.4.1",
- "jquery": ">=3.0.0",
- "motion-ui": "^2.0.3",
- "what-input": "^4.1.3"
+ "foundation-sites": "^6.9.0",
+ "jquery": "^3.6.0",
+ "what-input": "^5.2.12",
+ "motion-ui": "^2.0.4"
},
"devDependencies": {
- "@babel/core": "^7.1.2",
- "@babel/preset-env": "^7.1.0",
- "@babel/register": "^7.0.0",
- "autoprefixer": "^9.1.5",
- "babel-loader": "^8.0.4",
- "browser-sync": "^2.10.0",
- "gulp": "^4.0.0",
+ "@babel/core": "^7.26.0",
+ "@babel/preset-env": "^7.26.0",
+ "@babel/register": "^7.25.9",
+ "autoprefixer": "^10.4.20",
+ "babel-loader": "^9.2.1",
+ "browser-sync": "^3.0.3",
+ "gulp": "^5.0.0",
"gulp-babel": "^8.0.0",
- "gulp-clean-css": "^3.3.1",
- "gulp-cli": "^2.0.1",
- "gulp-concat": "^2.5.2",
- "gulp-extname": "^0.2.0",
- "gulp-if": "^2.0.0",
+ "gulp-clean-css": "^4.3.0",
+ "gulp-cli": "^3.0.0",
+ "gulp-concat": "^2.6.1",
+ "gulp-extname": "^0.2.2",
+ "gulp-if": "^3.0.0",
"gulp-imagemin": "^7.1.0",
- "gulp-load-plugins": "^1.1.0",
- "gulp-postcss": "^8.0.0",
- "gulp-sass": "^5.0.0",
- "gulp-sourcemaps": "^2.6.4",
- "gulp-uglify": "^3.0.1",
- "js-yaml": "^3.4.6",
- "panini": "^1.3.0",
- "rimraf": "^2.4.3",
- "sass": "^1.41.1",
- "style-sherpa": "^1.0.0",
- "uncss": "^0.16.2",
+ "gulp-load-plugins": "^2.0.8",
+ "gulp-postcss": "^10.0.0",
+ "gulp-sass": "^5.1.0",
+ "gulp-sourcemaps": "^3.0.0",
+ "gulp-uglify": "^3.0.2",
+ "js-yaml": "^4.1.0",
+ "js-yaml-js-types": "^1.0.1",
+ "panini": "^1.7.2",
+ "postcss": "^8.4.49",
+ "rimraf": "^6.0.1",
+ "sass": "^1.80.7",
+ "style-sherpa": "^1.0.2",
+ "uncss": "^0.17.3",
"vinyl-named": "^1.1.0",
- "webpack": "^5.53.0",
+ "webpack": "^5.96.1",
"webpack-stream": "^7.0.0",
- "yargs": "^17.1.1"
+ "yargs": "^17.7.2"
},
"bugs": {
"url": "https://devcentral.nasqueron.org/"
diff --git a/package.json b/package.json
deleted file mode 100644
--- a/package.json
+++ /dev/null
@@ -1,57 +0,0 @@
-{
- "main": "gulpfile.babel.js",
- "scripts": {
- "start": "gulp",
- "build": "gulp build --production"
- },
- "dependencies": {
- "foundation-sites": "~6.8.1",
- "jquery": "^3.6.0",
- "motion-ui": "^2.0.4",
- "what-input": "^5.2.12"
- },
- "devDependencies": {
- "@babel/core": "^7.26.0",
- "@babel/preset-env": "^7.26.0",
- "@babel/register": "^7.25.9",
- "autoprefixer": "^10.4.20",
- "babel-loader": "^9.2.1",
- "browser-sync": "^3.0.3",
- "gulp": "^5.0.0",
- "gulp-babel": "^8.0.0",
- "gulp-clean-css": "^4.3.0",
- "gulp-cli": "^3.0.0",
- "gulp-concat": "^2.6.1",
- "gulp-extname": "^0.2.2",
- "gulp-if": "^3.0.0",
- "gulp-imagemin": "^7.1.0",
- "gulp-load-plugins": "^2.0.8",
- "gulp-postcss": "^10.0.0",
- "gulp-sass": "^5.1.0",
- "gulp-sourcemaps": "^3.0.0",
- "gulp-uglify": "^3.0.2",
- "js-yaml": "^4.1.0",
- "js-yaml-js-types": "^1.0.1",
- "panini": "^1.7.2",
- "postcss": "^8.4.49",
- "rimraf": "^6.0.1",
- "sass": "^1.80.7",
- "style-sherpa": "^1.0.2",
- "uncss": "^0.17.3",
- "vinyl-named": "^1.1.0",
- "webpack": "^5.96.1",
- "webpack-stream": "^7.0.0",
- "yargs": "^17.7.2"
- },
- "bugs": {
- "url": "https://devcentral.nasqueron.org/"
- },
- "private": true,
- "name": "nasqueron-upsection-test",
- "version": "0.1.0",
- "description": "Allow to test if we can build a static site",
- "repository": {
- "type": "git",
- "url": "https://devcentral.nasqueron.org/source/upsection.git"
- }
-}
diff --git a/template/src/assets/scss/_settings.scss b/template/src/assets/scss/_settings.scss
--- a/template/src/assets/scss/_settings.scss
+++ b/template/src/assets/scss/_settings.scss
@@ -58,8 +58,9 @@
// 53. Title Bar
// 54. Tooltip
// 55. Top Bar
-// 56. Xy Grid
+// 57. Xy Grid
+@use "sass:color";
@import 'util/util';
// 1. Global
@@ -69,11 +70,11 @@
$global-width: rem-calc(1200);
$global-lineheight: 1.5;
$foundation-palette: (
- primary: #1779ba,
- secondary: #767676,
- success: #3adb76,
- warning: #ffae00,
- alert: #cc4b37,
+ "primary": #1779ba,
+ "secondary": #767676,
+ "success": #3adb76,
+ "warning": #ffae00,
+ "alert": #cc4b37,
);
$light-gray: #e6e6e6;
$medium-gray: #cacaca;
@@ -83,6 +84,7 @@
$body-background: $white;
$body-font-color: $black;
$body-font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif;
+$body-safe-padding: false;
$body-antialiased: true;
$global-margin: 1rem;
$global-padding: 1rem;
@@ -105,19 +107,20 @@
// 2. Breakpoints
// --------------
+$-zf-size: null;
$breakpoints: (
- small: 0,
- medium: 640px,
- large: 1024px,
- xlarge: 1200px,
- xxlarge: 1440px,
+ "small": 0,
+ "medium": 640px,
+ "large": 1024px,
+ "xlarge": 1200px,
+ "xxlarge": 1440px,
);
$breakpoints-hidpi: (
- hidpi-1: 1,
- hidpi-1-5: 1.5,
- hidpi-2: 2,
- retina: 2,
- hidpi-3: 3
+ "hidpi-1": 1,
+ "hidpi-1-5": 1.5,
+ "hidpi-2": 2,
+ "retina": 2,
+ "hidpi-3": 3
);
$print-breakpoint: large;
$breakpoint-classes: (small medium large);
@@ -461,7 +464,7 @@
$input-background-disabled: $light-gray;
$input-border: 1px solid $medium-gray;
$input-border-focus: 1px solid $dark-gray;
-$input-padding: $form-spacing / 2;
+$input-padding: $form-spacing * 0.5;
$input-shadow: inset 0 1px 2px rgba($black, 0.1);
$input-shadow-focus: 0 0 5px $medium-gray;
$input-cursor-disabled: not-allowed;
@@ -691,8 +694,7 @@
// --------------------
$prototype-shadow-breakpoints: $global-prototype-breakpoints;
-$prototype-box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),
- 0 2px 10px 0 rgba(0,0,0,.12);
+$prototype-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
// 41. Prototype Sizing
// --------------------
@@ -780,7 +782,9 @@
// ----------
$switch-background: $medium-gray;
+$switch-background-focus: scale-color($switch-background, $lightness: -10%);
$switch-background-active: $primary-color;
+$switch-background-active-focus: scale-color($switch-background-active, $lightness: -15%);
$switch-height: 2rem;
$switch-height-tiny: 1.5rem;
$switch-height-small: 1.75rem;
@@ -791,7 +795,7 @@
$switch-paddle-offset: 0.25rem;
$switch-paddle-radius: $global-radius;
$switch-paddle-transition: all 0.25s ease-out;
-$switch-opacity-disabled: .5;
+$switch-opacity-disabled: 0.5;
$switch-cursor-disabled: not-allowed;
// 50. Table
@@ -802,15 +806,15 @@
$table-border: 1px solid smart-scale($table-background, $table-color-scale);
$table-padding: rem-calc(8 10 10);
$table-hover-scale: 2%;
-$table-row-hover: darken($table-background, $table-hover-scale);
-$table-row-stripe-hover: darken($table-background, $table-color-scale + $table-hover-scale);
+$table-row-hover: color.adjust($table-background, $lightness: -$table-hover-scale);
+$table-row-stripe-hover: color.adjust($table-background, $lightness: -($table-color-scale + $table-hover-scale));
$table-is-striped: true;
$table-striped-background: smart-scale($table-background, $table-color-scale);
$table-stripe: even;
-$table-head-background: smart-scale($table-background, $table-color-scale / 2);
-$table-head-row-hover: darken($table-head-background, $table-hover-scale);
+$table-head-background: smart-scale($table-background, $table-color-scale * 0.5);
+$table-head-row-hover: color.adjust($table-head-background, $lightness: -$table-hover-scale);
$table-foot-background: smart-scale($table-background, $table-color-scale);
-$table-foot-row-hover: darken($table-foot-background, $table-hover-scale);
+$table-foot-row-hover: color.adjust($table-foot-background, $lightness: -$table-hover-scale);
$table-head-font-color: $body-font-color;
$table-foot-font-color: $body-font-color;
$show-header-for-stacked: false;
@@ -878,15 +882,15 @@
$topbar-input-width: 200px;
$topbar-unstack-breakpoint: medium;
-// 56. Xy Grid
+// 57. Xy Grid
// -----------
$xy-grid: true;
$grid-container: $global-width;
$grid-columns: 12;
$grid-margin-gutters: (
- small: 20px,
- medium: 30px
+ "small": 20px,
+ "medium": 30px
);
$grid-padding-gutters: $grid-margin-gutters;
$grid-container-padding: $grid-padding-gutters;

File Metadata

Mime Type
text/plain
Expires
Wed, Apr 16, 08:23 (3 h, 36 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2572783
Default Alt Text
D3590.id9292.diff (14 KB)

Event Timeline

Nasqueron DevCentral · If it had been much bigger the moon would have had a core of ice. · Powered by Phabricator