From 2797b52f386e2b723886ac54002b67adc9d92a12 Mon Sep 17 00:00:00 2001 From: Edwin Collazos Date: Wed, 8 Jul 2026 16:29:10 -0400 Subject: [PATCH 1/5] Removes d2l-label-text usage and typography.scss import --- d2l-button.scss | 3 --- 1 file changed, 3 deletions(-) diff --git a/d2l-button.scss b/d2l-button.scss index dc216b2..da90c60 100644 --- a/d2l-button.scss +++ b/d2l-button.scss @@ -1,5 +1,4 @@ @import 'node_modules/@brightspace-ui/core/components/colors/colors.scss'; -@import 'node_modules/@brightspace-ui/core/components/typography/typography.scss'; @mixin _d2l-button-clear-focus() { box-shadow: 0 0 0 4px rgba(0, 0, 0, 0); @@ -94,7 +93,6 @@ font-family: inherit; padding: 0.5rem 0.6rem; position: relative; - @include d2l-label-text(); &::-moz-focus-inner { border: 0; } @@ -135,7 +133,6 @@ @include _d2l-button-clear-focus(); font-family: inherit; padding: 0.5rem 1.5rem; - @include d2l-label-text(); &::-moz-focus-inner { border: 0; } From abad61bba63212d8d958adcbccc904869dd233bc Mon Sep 17 00:00:00 2001 From: Edwin Collazos Date: Thu, 9 Jul 2026 10:11:47 -0400 Subject: [PATCH 2/5] Removes the d2l-button.scss file --- d2l-button.scss | 165 ------------------------------------------------ 1 file changed, 165 deletions(-) delete mode 100644 d2l-button.scss diff --git a/d2l-button.scss b/d2l-button.scss deleted file mode 100644 index da90c60..0000000 --- a/d2l-button.scss +++ /dev/null @@ -1,165 +0,0 @@ -@import 'node_modules/@brightspace-ui/core/components/colors/colors.scss'; - -@mixin _d2l-button-clear-focus() { - box-shadow: 0 0 0 4px rgba(0, 0, 0, 0); -} - -@mixin _d2l-button-focus() { - box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #006fbf; -} - -@mixin _d2l-button-shared() { - border-radius: 0.3rem; - border-style: solid; - border-width: 1px; - box-sizing: border-box; - cursor: pointer; - display: inline-block; - margin: 0; - min-height: -webkit-calc(2rem + 2px); - min-height: calc(2rem + 2px); - outline: none; - text-align: center; - transition: box-shadow 0.2s; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - vertical-align: middle; - white-space: nowrap; - width: auto; -} - -@mixin d2l-button-icon() { - @include _d2l-button-shared(); - background-color: transparent; - border-color: transparent; - @include _d2l-button-clear-focus(); - font-family: inherit; - min-width: calc(2rem + 2px); - padding: 0; - position: relative; - &::-moz-focus-inner { - border: 0; - } - &[h-align="text"] { - left: calc(((2rem + 2px - 0.9rem) / 2) * -1); - } - [dir="rtl"] &[h-align="text"] { - left: 0; - right: calc(((2rem + 2px - 0.9rem) / 2) * -1); - } - &[disabled]:hover, &[disabled]:focus, &[active][disabled] { - background-color: transparent; - } - &:hover, &:focus, &[active], &.d2l-button-icon-hover, &.d2l-button-icon-focus { - background-color: $d2l-color-gypsum; - } - &:focus, &.d2l-button-icon-focus { - @include _d2l-button-focus(); - } - & d2l-icon { - height: 0.9rem; - width: 0.9rem; - } - &[disabled] { - cursor: default; - opacity: 0.5; - } - &[translucent] { - background-color: rgba(0,0,0,0.5); - transition: background-color 0.5s; - } - &[translucent] d2l-icon { - color: white; - } - &[active][translucent], - &[translucent].d2l-button-icon-hover, - &[translucent].d2l-button-icon-focus, - &[translucent]:hover, - &[translucent]:focus { - border: none; - background-color: $d2l-color-celestine; - box-shadow: none; - } -} - -@mixin d2l-button-subtle() { - @include _d2l-button-shared(); - background-color: transparent; - border-color: transparent; - color: $d2l-color-celestine; - @include _d2l-button-clear-focus(); - font-family: inherit; - padding: 0.5rem 0.6rem; - position: relative; - &::-moz-focus-inner { - border: 0; - } - &[h-align="text"] { - left: -0.6rem; - } - [dir="rtl"] &[h-align="text"] { - left: 0; - right: -0.6rem; - } - &[disabled]:hover, &[disabled]:focus, &[active][disabled] { - background-color: transparent; - } - &:hover, &:focus, &[active], &.d2l-button-subtle-hover, &.d2l-button-subtle-focus { - background-color: $d2l-color-gypsum; - } - &:focus, &.d2l-button-subtle-focus { - @include _d2l-button-focus(); - } - & d2l-icon { - color: $d2l-color-celestine; - height: 0.9rem; - margin-right: 0.3rem; - width: 0.9rem; - } - [dir="rtl"] & d2l-icon { - margin-left: 0.3rem; - margin-right: 0; - } - &[disabled] { - cursor: default; - opacity: 0.5; - } -} - -@mixin d2l-button() { - @include _d2l-button-shared(); - @include _d2l-button-clear-focus(); - font-family: inherit; - padding: 0.5rem 1.5rem; - &::-moz-focus-inner { - border: 0; - } - &, &[disabled]:hover, &[disabled]:focus, &[active][disabled] { - background-color: $d2l-color-regolith; - border-color: $d2l-color-mica; - color: $d2l-color-ferrite; - } - &:hover, &:focus, &[active], &.d2l-button-hover, &.d2l-button-focus { - background-color: $d2l-color-gypsum; - } - &:focus, &.d2l-button-focus { - @include _d2l-button-focus(); - } - &[disabled] { - opacity: 0.5; - cursor: default; - } - &[primary], &[primary][disabled]:hover, &[primary][disabled]:focus, &[primary][active][disabled] { - background-color: $d2l-color-celestine; - border-color: $d2l-color-celestine-minus-1; - color: #ffffff; - } - &[primary]:hover, &[primary].d2l-button-hover, &[primary]:focus, &[primary].d2l-button-focus, &[primary][active] { - background-color: $d2l-color-celestine-minus-1; - } - &[primary]:focus, &[primary].d2l-button-focus { - @include _d2l-button-focus(); - } -} From bb3332edd45600b413030429fccfbed9e77f5d4f Mon Sep 17 00:00:00 2001 From: Edwin Collazos Date: Thu, 9 Jul 2026 10:13:28 -0400 Subject: [PATCH 3/5] Removes the button.css.scss test file --- test/button.css.scss | 13 ------------- 1 file changed, 13 deletions(-) delete mode 100644 test/button.css.scss diff --git a/test/button.css.scss b/test/button.css.scss deleted file mode 100644 index 0a97420..0000000 --- a/test/button.css.scss +++ /dev/null @@ -1,13 +0,0 @@ -@import '../d2l-button.scss'; - -.sass-mixin-button { - @include d2l-button(); -} - -.sass-mixin-button-subtle { - @include d2l-button-subtle(); -} - -.sass-mixin-button-icon { - @include d2l-button-icon(); -} From e062b6e8f46716171ef21a9e27c86d589c48e86f Mon Sep 17 00:00:00 2001 From: Edwin Collazos Date: Thu, 9 Jul 2026 10:14:35 -0400 Subject: [PATCH 4/5] Removes sass scripts and sass dependency and exposure of d2l-button.scss --- package.json | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index 9a2fc5c..7cd8999 100644 --- a/package.json +++ b/package.json @@ -6,19 +6,17 @@ }, "name": "@brightspace-ui/button", "scripts": { - "build:sass": "sass ./test/button.css.scss ./test/button.css --no-source-map", "lint": "npm run lint:js", "lint:js": "eslint . --ext .js,.html demo/**/*.html", "start": "web-dev-server --node-resolve --watch", - "test": "npm run lint && npm run build:sass" + "test": "npm run lint" }, "author": "D2L Corporation", "license": "Apache-2.0", "devDependencies": { "@web/dev-server": "^0.4", "eslint": "^9", - "eslint-config-brightspace": "^4", - "sass": "^1" + "eslint-config-brightspace": "^4" }, "version": "6.4.0", "main": "d2l-button.js", @@ -28,7 +26,6 @@ "d2l-button-shared-styles.js", "d2l-button-subtle.js", "d2l-button.js", - "d2l-button.scss", "d2l-floating-buttons.js" ], "publishConfig": { From 2077b7b4772660664c3a145c349899a04dff0275 Mon Sep 17 00:00:00 2001 From: Edwin Collazos Date: Thu, 9 Jul 2026 10:16:33 -0400 Subject: [PATCH 5/5] Removes unnecessary .gitignore file --- test/.gitignore | 1 - 1 file changed, 1 deletion(-) delete mode 100644 test/.gitignore diff --git a/test/.gitignore b/test/.gitignore deleted file mode 100644 index b3a5267..0000000 --- a/test/.gitignore +++ /dev/null @@ -1 +0,0 @@ -*.css