Merge pull request #68 from space150/enhancements

Enhancements: remove CSS reset

.gitignore

@@ -4,6 +4,9 @@ stylesheets/*
 # Temporary Sass files
 .sass-cache/
 
+# Node Modules
+node_modules
+
 # Compiled source for deployment
 dist/
 tests/**/*input.css

.scss-lint.yml

@@ -1,6 +1,5 @@
 ---
 exclude:
-  - "scss/vendor/_reset.scss"
   - "scss/vendor/_normalize.scss"
   - "tests/*"
 

CHANGELOG.md

@@ -1,3 +1,9 @@
+### 4.1.0 (June 24, 2021)
+
+* Add sass npm scripts for compilation.
+* Remove CSS Reset option.
+
+
 ### 4.0.1 (Nov 4, 2019)
 
 * Update to Normalize.css 8.0.1.

LICENSE.md

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2013-2018 space150
+Copyright (c) 2013-2021 space150
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -22,7 +22,6 @@ spaceBase is the front-end starter files for any new web project. It sets up you
 ### Customizable Features
 
 * Compatible with any Sass compiler
-* Start with Normalize (default) or CSS Reset
 * Scalable, mobile-first grid - choose how robust you want it
 * Base font size for mobile vs desktop
 * Global variables for breakpoints, colors, fonts and more
@@ -70,7 +69,6 @@ You can remove (if downloaded from Git):
 * [Sass MQ](https://github.com/sass-mq/sass-mq)
 * [Bootstrap](http://getbootstrap.com)
 * [Normalize.css](http://necolas.github.io/normalize.css)
-* [Eric Meyer’s CSS Reset](http://meyerweb.com/eric/tools/css/reset)
 
 ## License
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "spacebase",
-  "version": "4.0.1",
+  "version": "4.1.0",
   "description": "spaceBase is a Sass-based responsive CSS framework.",
   "homepage": "http://spacebase.space150.com",
   "main": "stylesheets/application.css",
@@ -24,5 +24,12 @@
     "*.html",
     "scss/*",
     "stylesheets/*.css"
-  ]
+  ],
+  "dependencies": {
+    "sass": "^1.35.1"
+  },
+  "scripts": {
+    "build": "sass --style compressed scss/:stylesheets/",
+    "watch": "sass --watch scss/:stylesheets/"
+  }
 }

scss/README.md

@@ -6,12 +6,12 @@ The `scss/` directory contains three folders: Base, UI and Vendor.
 
 - **Base** contains the "building block" abstractions, namely the grid framework, mixins and helpers. These are core to spaceBase and should not be edited, but you can add your own mixins to `mixins.scss`.
 - **UI** contains all project-specific styles shared across the application. These files are meant to be completely tailored to your project. To start, it includes typography, form elements, generic print styles, buttons and other common UI components. Add more partials and organize them however the project demands.
-- **Vendor** contains Normalize and CSS reset. You can add other vendor files here.
+- **Vendor** contains Normalize. You can add other vendor files here.
 
 
 ## Compilation
 
-All partials are imported into the `application.scss`. This is also where you can choose to import either Normalize (default) or CSS Reset. When you add new partials to your project, add them to this import list. Set up your Sass compilation to generate this in the `stylesheets/` directory. Because of the amount of comments, please use minified CSS in production.
+All partials are imported into the `application.scss`. When you add new partials to your project, add them to this import list. Set up your Sass compilation to generate this in the `stylesheets/` directory. Because of the amount of comments, please use minified CSS in production.
 
 ### Styleguide
 
@@ -24,7 +24,7 @@ Customizable variables are stored in the `_vars.scss` partial. This includes thi
 
 ### Vertical Rhythm and the `$base-sizing-unit`
 
-As a means for consistency and good vertical rhythm, many measurements are based off the `$base-spacing-unit`, which is equal to the base `$line-height-ratio`. This way if the `$base-font-size` or `$base-line-height` is adjusted down the road, white space proportions are preserved. For example, unless you opt for using CSS Reset, most block-level elements (headings, lists, paragraphs, etc.) will have a bottom margin equal to `$base-spacing-unit`.
+As a means for consistency and good vertical rhythm, many measurements are based off the `$base-spacing-unit`, which is equal to the base `$line-height-ratio`. This way if the `$base-font-size` or `$base-line-height` is adjusted down the road, white space proportions are preserved. For example, most block-level elements (headings, lists, paragraphs, etc.) will have a bottom margin equal to `$base-spacing-unit`.
 
 
 ## The Grid

scss/_vars.scss

@@ -3,14 +3,10 @@
 //------------------------------------//
 
 /*
-  spaceBase version: 4.0.1
+  spaceBase version: 4.1.0
   http://spacebase.space150.com
 */
 
-// To select Normalize or Reset, see application.scss
-$normalize: false !default;
-$reset:     false !default;
-
 // Include push styles?
 $push: true;
 

scss/application.scss

@@ -1,9 +1,6 @@
 @import "base/functions";
 @import "vars";
-
-// Choose either Normalize or Reset:
-@import "vendor/normalize"; $normalize: true;
-// @import "vendor/reset"; $reset: true;
+@import "vendor/normalize";
 
 @import "base/mixins";
 @import "base/grids";

scss/base/_shared.scss

@@ -28,31 +28,28 @@ img {
 img[width],
 img[height] { max-width: none; }
 
+// Where `margin-bottom` is concerned, this value will be the same as the
+// base line-height. This allows us to keep a consistent vertical rhythm.
+// As per: csswizardry.com/2012/06/single-direction-margin-declarations
+h1,h2,h3,h4,h5,h6,hgroup,hr,
+ul,ol,dl,
+blockquote,p,address,
+table,
+fieldset,figure,figcaption,
+pre {
+  margin-top: 0;
+  margin-bottom: $base-spacing-unit;
+  ul,ol { margin-bottom: 0; }
+}
+
+// Where `margin-left` is concerned, we want to try and indent certain elements
+// by a consistent amount
+ul,ol,dd {
+  margin-left: $base-spacing-unit;
+  padding: 0;
+}
 
-@if $reset != true {
-  // Where `margin-bottom` is concerned, this value will be the same as the
-  // base line-height. This allows us to keep a consistent vertical rhythm.
-  // As per: csswizardry.com/2012/06/single-direction-margin-declarations
-  h1,h2,h3,h4,h5,h6,hgroup,hr,
-  ul,ol,dl,
-  blockquote,p,address,
-  table,
-  fieldset,figure,figcaption,
-  pre {
-    margin-top: 0;
-    margin-bottom: $base-spacing-unit;
-    ul,ol { margin-bottom: 0; }
-  }
-
-  // Where `margin-left` is concerned, we want to try and indent certain elements
-  // by a consistent amount
-  ul,ol,dd {
-    margin-left: $base-spacing-unit;
-    padding: 0;
-  }
-
-  table {
-    border-collapse: collapse;
-    border-spacing: 0;
-  }
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
 }

scss/ui/_fonts.scss

@@ -12,4 +12,5 @@
 //        url('../fonts/2BF776_1_0.woff') format('woff');
 //   font-weight: normal;
 //   font-style: normal;
+//   font-display: swap;
 // }