add project files

.gitignore

@@ -1 +1,2 @@
-src/includes/svg/
+node_modules
+assets

gulpfile.js

@@ -15,24 +15,19 @@ const browserSync = require('browser-sync');
 
 sass.compiler = require('node-sass');
 
-const server = browserSync.create();
-
 const babelConfig = require('./babel.config.js');
 const postcssPlugins = [postcssPresetEnv(), cssnano()];
 
 const srcDir = './src/';
-const buildDir = './build/';
+const buildDir = './assets/';
 const jsSrc = path.join(srcDir, 'js/**/*.js');
 const jsDest = path.join(buildDir, 'js/');
 const scssSrc = path.join(srcDir, 'scss/**/*.scss');
 const cssDest = path.join(buildDir, 'css/');
-const htmlSrc = path.join(srcDir, 'html/**/*.html');
-const mustacheSrc = path.join(srcDir, 'html/templates/**/*.mustache');
 const includeBaseDir = path.join(srcDir, 'includes/');
 const includeSrc = path.join(includeBaseDir, '**/*');
 const svgSrc = path.join(srcDir, 'svg/**/*.svg');
 const svgDest = path.join(includeBaseDir, 'svg/');
-const htmlDest = buildDir;
 const assetSrc = path.join(srcDir, 'assets/**/*');
 const assetDest = path.join(buildDir, 'assets/');
 
@@ -44,10 +39,6 @@ function cssClean() {
 	return del(cssDest, { force: true });
 }
 
-function htmlClean() {
-	return del(path.join(htmlDest, '*.html'), { force: true });
-}
-
 function assetClean() {
 	return del(assetDest, { force: true });
 }
@@ -63,8 +54,7 @@ function scssCompile() {
 	return src(scssSrc, { sourcemaps: true })
 		.pipe(sass().on('error', sass.logError))
 		.pipe(postcss(postcssPlugins))
-		.pipe(dest(cssDest, { sourcemaps: true }))
+		.pipe(dest(cssDest, { sourcemaps: true }));
-		.pipe(server.stream());
 }
 
 function svgOptimise() {
@@ -73,40 +63,12 @@ function svgOptimise() {
 		.pipe(dest(svgDest));
 }
 
-function htmlCompile() {
-	return src(htmlSrc)
-		.pipe(mustache())
-		.pipe(
-			fileInclude({
-				basepath: includeBaseDir,
-			})
-		)
-		.pipe(dest(htmlDest));
-}
-
 function assetCompile() {
 	return src(assetSrc).pipe(dest(assetDest));
 }
 
-function serve(done) {
-	server.init({
-		open: false,
-		server: {
-			baseDir: buildDir,
-		},
-		// or instead of server
-		// proxy: "example.home"
-	});
-	done();
-}
-
-function reload(done) {
-	server.reload();
-	done();
-}
-
 const jsWatch = () =>
-	watch(jsSrc, { ignoreInitial: false }, series(jsClean, jsTranspile, reload));
+	watch(jsSrc, { ignoreInitial: false }, series(jsClean, jsTranspile));
 
 const cssWatch = () =>
 	watch(scssSrc, { ignoreInitial: false }, series(cssClean, scssCompile));
@@ -114,26 +76,7 @@ const cssWatch = () =>
 const svgWatch = () =>
 	watch(svgSrc, { ignoreInitial: false }, series(svgOptimise));
 
-const htmlWatch = () =>
-	watch(
-		[htmlSrc, includeSrc, mustacheSrc],
-		{ ignoreInitial: false },
-		series(htmlClean, htmlCompile, reload)
-	);
-
 const assetWatch = () =>
-	watch(
+	watch(assetSrc, { ignoreInitial: false }, series(assetClean, assetCompile));
-		assetSrc,
-		{ ignoreInitial: false },
-		series(assetClean, assetCompile, reload)
-	);
-
-exports.default = parallel(
-	jsWatch,
-	cssWatch,
-	svgWatch,
-	htmlWatch,
-	assetWatch,
-	serve
-);
 
+exports.default = parallel(jsWatch, cssWatch, svgWatch, assetWatch);

roomwithavw-custom.php

@@ -0,0 +1,20 @@
+<?php
+/**
+ * Plugin Name:     Roomwithavw Custom
+ * Description:     Custom code for roomwithavw.co.uk
+ * Author:          Ray Elliott
+ * Author URI:      https://rayelliott.dev
+ * Text Domain:     roomwithavw-custom
+ * Domain Path:     /languages
+ * Version:         0.1.0
+ *
+ * @package         Roomwithavw_Custom
+ */
+
+function roomwithavw_custom_add_scripts() {
+	wp_register_script( 'roomwithavw-custom-script', plugins_url( 'assets/js/index.js', __FILE__ ), array(), '1.0', true );
+	wp_enqueue_script( 'roomwithavw-custom-script' );
+ 
+	wp_enqueue_style( 'roomwithavw-custom-styles', plugins_url( 'assets/css/style.css', __FILE__ ), '', '1.0' );
+}
+add_action( 'wp_enqueue_scripts', 'roomwithavw_custom_add_scripts' );

src/js/index.js

@@ -24,6 +24,8 @@
 			});
 		}
 
+		document.body.classList.add('rwavw-custom');
+
 		observedNodes.forEach(el => {
 			if (intersectionSupport) {
 				const options = {

src/scss/_variables.scss

@@ -14,6 +14,8 @@ $bp-max-xl: 1199.98px;
 
 $column-max-width: 1140px;
 
+$line-height: 1.5;
+
 $btn-border-radius: 12px;
 $btn-border-width: 0;
 $btn-border-color: currentColor;

src/scss/style.scss

@@ -1,44 +1,3 @@
-@import "variables";
+body.rwavw-custom {
-@import "mixins";
+	// ...
-
-@import "reset";
-
-@import "typography";
-@import "base";
-@import "layout";
-
-.h1 {
-	@extend h1;
-}
-
-.h2 {
-	@extend h2;
-}
-
-.h3 {
-	@extend h3;
-}
-
-.h4 {
-	@extend h4;
-}
-
-.h5 {
-	@extend h5;
-}
-
-.h6 {
-	@extend h6;
-}
-
-.button {
-	@extend button;
-}
-
-.a {
-	@extend a;
-}
-
-.button {
-	@extend button;
 }