From f01460382a33a814384986f6d1c9abaaf93fda82 Mon Sep 17 00:00:00 2001 From: spacestierman Date: Mon, 2 Aug 2021 16:30:23 -0500 Subject: [PATCH 1/6] Addressing sass deprecation warnings. --- package-lock.json | 127 ++++++++++++++++++++++++++++++++++++++ package.json | 2 +- scss/_vars.scss | 5 +- scss/base/_functions.scss | 3 +- scss/base/_widths.scss | 85 ++++++++++++------------- scss/ui/_lists.scss | 3 +- scss/ui/_typography.scss | 3 +- 7 files changed, 180 insertions(+), 48 deletions(-) create mode 100644 package-lock.json diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..d66d61c --- /dev/null +++ b/package-lock.json @@ -0,0 +1,127 @@ +{ + "name": "spacebase", + "version": "4.1.0", + "lockfileVersion": 1, + "requires": true, + "dependencies": { + "anymatch": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz", + "integrity": "sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==", + "requires": { + "normalize-path": "^3.0.0", + "picomatch": "^2.0.4" + } + }, + "binary-extensions": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", + "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==" + }, + "braces": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", + "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "requires": { + "fill-range": "^7.0.1" + } + }, + "chokidar": { + "version": "3.5.2", + "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.2.tgz", + "integrity": "sha512-ekGhOnNVPgT77r4K/U3GDhu+FQ2S8TnK/s2KbIGXi0SZWuwkZ2QNyfWdZW+TVfn84DpEP7rLeCt2UI6bJ8GwbQ==", + "requires": { + "anymatch": "~3.1.2", + "braces": "~3.0.2", + "fsevents": "~2.3.2", + "glob-parent": "~5.1.2", + "is-binary-path": "~2.1.0", + "is-glob": "~4.0.1", + "normalize-path": "~3.0.0", + "readdirp": "~3.6.0" + } + }, + "fill-range": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", + "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "requires": { + "to-regex-range": "^5.0.1" + } + }, + "fsevents": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "optional": true + }, + "glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "requires": { + "is-glob": "^4.0.1" + } + }, + "is-binary-path": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", + "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", + "requires": { + "binary-extensions": "^2.0.0" + } + }, + "is-extglob": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", + "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=" + }, + "is-glob": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz", + "integrity": "sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg==", + "requires": { + "is-extglob": "^2.1.1" + } + }, + "is-number": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", + "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==" + }, + "normalize-path": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", + "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==" + }, + "picomatch": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz", + "integrity": "sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==" + }, + "readdirp": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", + "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", + "requires": { + "picomatch": "^2.2.1" + } + }, + "sass": { + "version": "1.37.0", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.37.0.tgz", + "integrity": "sha512-B+Tu6cSAG8ffs/cqsZl/bgSH2pCmavDaPTYAoW8QA1qNHh/RqndNfVKuABKYkLjUQ5aq/BnCENVpE80cqdSM1w==", + "requires": { + "chokidar": ">=3.0.0 <4.0.0" + } + }, + "to-regex-range": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", + "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", + "requires": { + "is-number": "^7.0.0" + } + } + } +} diff --git a/package.json b/package.json index f790b97..6967925 100755 --- a/package.json +++ b/package.json @@ -29,7 +29,7 @@ "sass": "^1.35.1" }, "scripts": { - "build": "sass --style compressed scss/:stylesheets/", + "build": "sass --style expanded scss/:stylesheets/", "watch": "sass --watch scss/:stylesheets/" } } diff --git a/scss/_vars.scss b/scss/_vars.scss index 6b85793..647f9d7 100755 --- a/scss/_vars.scss +++ b/scss/_vars.scss @@ -1,3 +1,4 @@ +@use "sass:math"; //------------------------------------// // $VARIABLES //------------------------------------// @@ -21,10 +22,10 @@ $base-font-size--mobile: $base-font-size; // Set to px value if mobile requires different font size // Calculated measurements -$line-height-ratio: $base-line-height / $base-font-size; +$line-height-ratio: math.div($base-line-height, $base-font-size); $base-spacing-unit: $line-height-ratio * 1rem; -$half-spacing-unit: $base-spacing-unit / 2; +$half-spacing-unit: math.div($base-spacing-unit, 2); // Grid $gutter: $base-spacing-unit; diff --git a/scss/base/_functions.scss b/scss/base/_functions.scss index 6b9a448..54aae02 100755 --- a/scss/base/_functions.scss +++ b/scss/base/_functions.scss @@ -1,6 +1,7 @@ //------------------------------------// // $FUNCTIONS //------------------------------------// +@use "sass:math"; // px2em // Convert pixels to ems @@ -11,7 +12,7 @@ } @else if unit($px) == em { @return $px; } - @return ($px / 16px) * 1em; + @return math.div($px, 16px) * 1em; } // get-breakpoint-width diff --git a/scss/base/_widths.scss b/scss/base/_widths.scss index 83a9b08..1de2984 100755 --- a/scss/base/_widths.scss +++ b/scss/base/_widths.scss @@ -1,68 +1,69 @@ //------------------------------------// // $WIDTHS //------------------------------------// +@use "sass:math"; $grid-widths: ( 1: one-whole, - 1/2: one-half - two-quarters - three-sixths - four-eighths - five-tenths - six-twelfths, + math.div(1, 2): one-half + two-quarters + three-sixths + four-eighths + five-tenths + six-twelfths, - 1/3: one-third - two-sixths - four-twelfths, + math.div(1, 3): one-third + two-sixths + four-twelfths, - 2/3: two-thirds - four-sixths - eight-twelfths, + math.div(2, 3): two-thirds + four-sixths + eight-twelfths, - 1/4: one-quarter - two-eighths - three-twelfths, + math.div(1, 4): one-quarter + two-eighths + three-twelfths, - 3/4: three-quarters - six-eighths - nine-twelfths, + math.div(3, 4): three-quarters + six-eighths + nine-twelfths, - 1/5: one-fifth - two-tenths, + math.div(1, 5): one-fifth + two-tenths, - 2/5: two-fifths - four-tenths, + math.div(2, 5): two-fifths + four-tenths, - 3/5: three-fifths - six-tenths, + math.div(3, 5): three-fifths + six-tenths, - 4/5: four-fifths - eight-tenths, + math.div(4, 5): four-fifths + eight-tenths, - 1/6: one-sixth - two-twelfths, + math.div(1, 6): one-sixth + two-twelfths, - 5/6: five-sixths - ten-twelfths, + math.div(5, 6): five-sixths + ten-twelfths, // Eighths - 1/8: one-eighth, - 3/8: three-eighths, - 5/8: five-eighths, - 7/8: seven-eighths, + math.div(1, 8): one-eighth, + math.div(3, 8): three-eighths, + math.div(5, 8): five-eighths, + math.div(7, 8): seven-eighths, // Tenths - 1/10: one-tenth, - 3/10: three-tenths, - 7/10: seven-tenths, - 9/10: nine-tenths, + math.div(1, 10): one-tenth, + math.div(3, 10): three-tenths, + math.div(7, 10): seven-tenths, + math.div(9, 10): nine-tenths, //Twelfths - 1/12: one-twelfth, - 5/12: five-twelfths, - 7/12: seven-twelfths, - 11/12: eleven-twelfths + math.div(1, 12): one-twelfth, + math.div(5, 12): five-twelfths, + math.div(7, 12): seven-twelfths, + math.div(11, 12): eleven-twelfths ); @mixin grid-setup($namespace: "", $property: width) { diff --git a/scss/ui/_lists.scss b/scss/ui/_lists.scss index 0b2086b..793abe8 100755 --- a/scss/ui/_lists.scss +++ b/scss/ui/_lists.scss @@ -1,6 +1,7 @@ //------------------------------------// // $LISTS //------------------------------------// +@use "sass:math"; .h-list, .v-list { @@ -45,5 +46,5 @@ } .v-list > li { - margin-top: $half-spacing-unit / 2; + margin-top: math.div($half-spacing-unit, 2); } diff --git a/scss/ui/_typography.scss b/scss/ui/_typography.scss index 82e10d2..4cc862a 100755 --- a/scss/ui/_typography.scss +++ b/scss/ui/_typography.scss @@ -1,9 +1,10 @@ //------------------------------------// // $TYPOGRAPHY //------------------------------------// +@use "sass:math"; html { - font: #{($base-font-size--mobile/16px)*1em}/#{$line-height-ratio} $font-body; + font: #{math.div($base-font-size--mobile, 16px)*1em}/#{$line-height-ratio} $font-body; color: $black; background: $white; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); From 3787502291d0dce52ef0290de157292bd5d6c986 Mon Sep 17 00:00:00 2001 From: spacestierman Date: Mon, 2 Aug 2021 16:37:30 -0500 Subject: [PATCH 2/6] Reverting back to compressed build. --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 6967925..f790b97 100755 --- a/package.json +++ b/package.json @@ -29,7 +29,7 @@ "sass": "^1.35.1" }, "scripts": { - "build": "sass --style expanded scss/:stylesheets/", + "build": "sass --style compressed scss/:stylesheets/", "watch": "sass --watch scss/:stylesheets/" } } From ee8269d8588d10ab5078eccf19f069a1cbf45176 Mon Sep 17 00:00:00 2001 From: cstoobes Date: Wed, 2 Mar 2022 22:30:00 -0600 Subject: [PATCH 3/6] remove i rule as this was or outdated practice --- scss/ui/_typography.scss | 2 -- 1 file changed, 2 deletions(-) diff --git a/scss/ui/_typography.scss b/scss/ui/_typography.scss index 4cc862a..885813a 100755 --- a/scss/ui/_typography.scss +++ b/scss/ui/_typography.scss @@ -17,8 +17,6 @@ a { &:hover, &:focus { text-decoration: underline; } } -i { font-style: normal; } - h1, .h1, h2, .h2, h3, .h3, From ee72e903a141346e41eae6f3ae662380acc2fe34 Mon Sep 17 00:00:00 2001 From: cstoobes Date: Wed, 2 Mar 2022 22:31:37 -0600 Subject: [PATCH 4/6] allow images with set height and width attributes to remain fluid --- scss/base/_helpers.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/scss/base/_helpers.scss b/scss/base/_helpers.scss index 595139d..a3c784c 100755 --- a/scss/base/_helpers.scss +++ b/scss/base/_helpers.scss @@ -2,7 +2,6 @@ // $HELPERS //------------------------------------// - // Clearfix .cf { @include clearfix; } From eb1cd774a1e06bf00a3009d3409767b3129e32c3 Mon Sep 17 00:00:00 2001 From: cstoobes Date: Wed, 2 Mar 2022 22:33:17 -0600 Subject: [PATCH 5/6] update version number and copyright --- CHANGELOG.md | 7 +++++++ README.md | 2 +- scss/_vars.scss | 2 +- 3 files changed, 9 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 1cbd512..86aaeab 100755 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,10 @@ +### 4.2.0 (Mar 2, 2022) + +* Replace / divider with math.div(). +* Allow images with width/height attributes to remain fluid. +* Remove i rule. + + ### 4.1.0 (June 24, 2021) * Add sass npm scripts for compilation. diff --git a/README.md b/README.md index e3d218a..b0e2e21 100755 --- a/README.md +++ b/README.md @@ -74,4 +74,4 @@ You can remove (if downloaded from Git): spaceBase is free to use under the [MIT License](LICENSE.md). -Copyright 2013-2021 [space150](http://www.space150.com) +Copyright 2013-2022 [space150](http://www.space150.com) diff --git a/scss/_vars.scss b/scss/_vars.scss index 647f9d7..9b1539b 100755 --- a/scss/_vars.scss +++ b/scss/_vars.scss @@ -4,7 +4,7 @@ //------------------------------------// /* - spaceBase version: 4.1.0 + spaceBase version: 4.2.0 http://spacebase.space150.com */ From 04091639466ff8dc6cd625253e068c20f6842350 Mon Sep 17 00:00:00 2001 From: cstoobes Date: Wed, 2 Mar 2022 22:33:24 -0600 Subject: [PATCH 6/6] typos --- scss/base/_shared.scss | 4 ---- scss/base/_widths.scss | 2 +- 2 files changed, 1 insertion(+), 5 deletions(-) diff --git a/scss/base/_shared.scss b/scss/base/_shared.scss index 6a00d76..b75c737 100755 --- a/scss/base/_shared.scss +++ b/scss/base/_shared.scss @@ -24,10 +24,6 @@ img { -ms-interpolation-mode: bicubic; } -// Non-fluid images if you specify `width` and/or `height` attributes -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 diff --git a/scss/base/_widths.scss b/scss/base/_widths.scss index 1de2984..9a50a55 100755 --- a/scss/base/_widths.scss +++ b/scss/base/_widths.scss @@ -59,7 +59,7 @@ $grid-widths: ( math.div(7, 10): seven-tenths, math.div(9, 10): nine-tenths, - //Twelfths + // Twelfths math.div(1, 12): one-twelfth, math.div(5, 12): five-twelfths, math.div(7, 12): seven-twelfths,