Add a reset tool && Switch to dart-sass (#64)

Author: scriptex

index.scss

@@ -1,22 +1,33 @@
 // Helpers
-@import 'src/helpers/aspect-ratio';
-@import 'src/helpers/auto-grid';
-@import 'src/helpers/font-size';
-@import 'src/helpers/full-bleed';
-@import 'src/helpers/grid';
-@import 'src/helpers/loader';
-@import 'src/helpers/rainbow';
-@import 'src/helpers/scroll-shadow';
-@import 'src/helpers/select';
-@import 'src/helpers/text-truncate';
-@import 'src/helpers/triangle';
-@import 'src/helpers/unbreak';
+@import './src/helpers/aspect-ratio';
+@import './src/helpers/auto-grid';
+@import './src/helpers/bem';
+@import './src/helpers/font-size';
+@import './src/helpers/full-bleed';
+@import './src/helpers/grid';
+@import './src/helpers/loader';
+@import './src/helpers/rainbow';
+@import './src/helpers/scroll-shadow';
+@import './src/helpers/select';
+@import './src/helpers/text-truncate';
+@import './src/helpers/triangle';
+@import './src/helpers/unbreak';
 
 // Tools
-@import 'src/tools/hover';
-@import 'src/tools/mq';
-@import 'src/tools/string-replace';
-@import 'src/tools/svg-background-multiple';
-@import 'src/tools/svg-background';
-@import 'src/tools/svg-url';
-@import 'src/tools/v';
+@import './src/tools/asset';
+@import './src/tools/half-negative-numbers';
+@import './src/tools/half-numbers';
+@import './src/tools/hover';
+@import './src/tools/mq';
+@import './src/tools/negative-number';
+@import './src/tools/reset';
+@import './src/tools/shade';
+@import './src/tools/spacing-helpers';
+@import './src/tools/string-replace';
+@import './src/tools/svg-background-multiple';
+@import './src/tools/svg-background';
+@import './src/tools/svg-url';
+@import './src/tools/tint';
+@import './src/tools/to-boolean';
+@import './src/tools/v';
+@import './src/tools/z-index';

package.json

@@ -1,12 +1,7 @@
 {
 	"name": "scss-goodies",
-	"version": "1.3.0",
+	"version": "2.0.0",
 	"description": "SCSS tools and helpers for every day usage",
-	"scripts": {
-		"docs": "sassdoc src --dest docs",
-		"build": "node-sass index.scss dist/index.css",
-		"test": "tape test.js"
-	},
 	"keywords": [
 		"SCSS",
 		"SCSS helpers",
@@ -15,18 +10,47 @@
 		"SCSS goodies",
 		"SCSS utilities"
 	],
-	"author": "Atanas Atanasov <scriptex.bg@gmail.com> (https://atanas.info)",
-	"repository": "https://github.com/scriptex/scss-helpers",
+	"homepage": "https://atanas.info/projects/scss-goodies.html",
 	"bugs": {
 		"url": "https://github.com/scriptex/scss-helpers/issues",
 		"email": "scriptex.bg@gmail.com"
 	},
 	"license": "MIT",
+	"scripts": {
+		"docs": "rm -rf docs && sassdoc src --dest docs",
+		"build": "rm -rf dist && sass index.scss dist/index.css --no-source-map",
+		"test": "yarn build && tape test.js"
+	},
+	"author": {
+		"name": "Atanas Atanasov",
+		"email": "scriptex.bg@gmail.com",
+		"url": "https://atanas.info"
+	},
+	"funding": [
+		{
+			"type": "individual",
+			"url": "https://www.paypal.me/scriptex"
+		},
+		{
+			"type": "patreon",
+			"url": "https://www.patreon.com/atanas"
+		},
+		{
+			"type": "individual",
+			"url": "https://ko-fi.com/scriptex"
+		}
+	],
+	"repository": "https://github.com/scriptex/scss-helpers",
 	"main": "index.scss",
 	"style": "index.scss",
+	"dependencies": {
+		"sass": "1.43.5"
+	},
 	"devDependencies": {
-		"node-sass": "6.0.1",
 		"sassdoc": "2.7.3",
-		"tape": "5.3.1"
+		"tape": "5.3.2"
+	},
+	"peerDependencies": {
+		"sass": ">=1.43.0"
 	}
 }

src/tools/_reset.scss

@@ -0,0 +1,58 @@
+/// A modern CSS reset
+/// @access public
+/// @author Atanas Atanasov <scriptex.bg@gmail.com>
+/// @example @include reset();
+/// @example @include reset($all: true, $box-sizing: true, $image: true, $table: true, $textarea: true, $contenteditable: false);
+/// @group tools
+/// @param {boolean} $all [true] - If `true`, reset all properties for all elements effectively removing all user agent styles. This does not apply to the `display` property.
+/// @param {boolean} $box-sizing [true] - If `true`, sets the `box-sizing` property to `border-box` on all elements.
+/// @param {boolean} $image [true] - If `true`, disallows images to exceed their container's width.
+/// @param {boolean} $table [true] - If `true`, removes the spacing between table cells.
+/// @param {boolean} $textarea [true] - If `true`, reverts the `white-space` property for textarea elements on Safari.
+/// @param {boolean} $contenteditable [true] - If `true`, fixes a bug on Chromium browsers with the `contenteditable` attribute.
+@mixin reset($all: true, $box-sizing: true, $image: true, $table: true, $textarea: true, $contenteditable: true) {
+	@if $all {
+		*:where(:not(iframe, canvas, img, svg, video):not(svg *, symbol *)) {
+			all: unset;
+			display: revert;
+		}
+	}
+
+	@if $box-sizing {
+		* {
+			box-sizing: border-box;
+		}
+
+		*::before,
+		*::after {
+			box-sizing: inherit;
+		}
+	}
+
+	@if $image {
+		img {
+			max-width: 100%;
+		}
+	}
+
+	@if $table {
+		table {
+			border-collapse: collapse;
+		}
+	}
+
+	@if $textarea {
+		textarea {
+			white-space: revert;
+		}
+	}
+
+	@if $contenteditable {
+		:where([contenteditable]) {
+			-moz-user-modify: read-write;
+			-webkit-user-modify: read-write;
+			overflow-wrap: break-word;
+			-webkit-line-break: after-white-space;
+		}
+	}
+}

test.js

@@ -26,7 +26,7 @@ tape('Should build successfully', t => {
 tape('Should not leave footprints', t => {
 	const build = resolve(__dirname, 'dist', 'index.css');
 	const content = readFileSync(build, 'utf-8');
-	t.equal(content, '', 'index.css is empty');
+	t.equal(content.trim(), '', 'index.css is empty');
 	t.end();
 });