Skip to content

feat(dropshadows): adds dropshadows to commons #2419

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 4 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -403,3 +403,7 @@ Occasionally, you may want to run a prerelease for an individual package and ski
- You **must** run a build **before** continuing with the prerelease. An npm task for cleaning, building, and beta publishing is available, and it can be run via the following command: `yarn release:beta-from-package`. This command will perform a full `clean` (via the `clean` task), a full `build` (via the `build` task), and will attempt to publish the package (via `lerna publish --conventional-prerelease --preid beta --pre-dist-tag beta --no-private`).
- Depending on the severity of your change(s), and before publishing to npm, Lerna should show a preview of the affected package version number that looks something like: `@spectrum-css/switch: 1.0.23 => 2.0.0-beta.0`. Additionally, at this time, Lerna will ask if you would like to continue with publishing the changes or cancel.
- Selecting `y` to publish will publish the affected package(s) to npm.

## Spectrum 2

More information coming soon!
51 changes: 51 additions & 0 deletions components/commons/dropshadows.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
/*!
Copyright 2023 Adobe. All rights reserved.
This file is licensed to you under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License. You may obtain a copy
of the License at http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
OF ANY KIND, either express or implied. See the License for the specific language
governing permissions and limitations under the License.
*/

%spectrum-DropShadow-key {
--spectrum-drop-shadow-color-key: var(--spectrum-drop-shadow-color);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would it be valuable to split out the variable definitions from the css property definitions? Just trying to think of examples where someone might want to variables and properties to source from different levels (properties at root for example).

--spectrum-drop-shadow-horizontal-key: var(--spectrum-color-handle-drop-shadow-x);
--spectrum-drop-shadow-vertical-key: var(--spectrum-color-handle-drop-shadow-y);
--spectrum-drop-shadow-blur-key: var(--spectrum-drop-shadow-blur);

box-shadow:
var(--spectrum-drop-shadow-horizontal-key)
var(--spectrum-drop-shadow-vertical-key)
var(--spectrum-drop-shadow-blur-key)
var(--spectrum-drop-shadow-color-key)
}

%spectrum-DropShadow-ambient {
--spectrum-drop-shadow-color-ambient: var(--spectrum-drop-shadow-color);
--spectrum-drop-shadow-horizontal-ambient: var(--spectrum-color-handle-drop-shadow-x);
--spectrum-drop-shadow-vertical-ambient: var(--spectrum-color-handle-drop-shadow-y);
--spectrum-drop-shadow-blur-ambient: var(--spectrum-drop-shadow-blur);

box-shadow:
var(--spectrum-drop-shadow-horizontal-ambient)
var(--spectrum-drop-shadow-vertical-ambient)
var(--spectrum-drop-shadow-blur-ambient)
var(--spectrum-drop-shadow-color-ambient)
}

%spectrum-DropShadow-transition {
--spectrum-drop-shadow-color-transition: var(--spectrum-drop-shadow-color);
--spectrum-drop-shadow-horizontal-transition: var(--spectrum-color-handle-drop-shadow-x);
--spectrum-drop-shadow-vertical-transition: var(--spectrum-color-handle-drop-shadow-y);
--spectrum-drop-shadow-blur-transition: var(--spectrum-drop-shadow-blur);

box-shadow:
var(--spectrum-drop-shadow-horizontal-transition)
var(--spectrum-drop-shadow-vertical-transition)
var(--spectrum-drop-shadow-blur-transition)
var(--spectrum-drop-shadow-color-transition)
}

4 changes: 3 additions & 1 deletion tokens/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,10 @@
},
"main": "dist/index.css",
"devDependencies": {
"@adobe/spectrum-tokens": "12.23.3",
"@adobe/spectrum-tokens": "13.0.0-beta.8",
"@nxkit/style-dictionary": "^4.0.0",
"concat-cli": "^4.0.0",
"npm-run-all": "^4.1.5",
Comment on lines +20 to +21
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think these might be added from an old version. We don't use npm-run-all or concat-cli anymore for token building.

"postcss": "^8.4.21",
"postcss-cli": "^10.1.0",
"postcss-combine-duplicated-selectors": "^10.0.3",
Expand Down
55 changes: 47 additions & 8 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -66,10 +66,10 @@
resolved "https://registry.yarnpkg.com/@adobe/spectrum-css-workflow-icons/-/spectrum-css-workflow-icons-1.5.4.tgz#0e09ff519c36139176c3ba3ce617a995c9032f67"
integrity sha512-sZ19YOLGw5xTZzCEkVXPjf53lXVzo063KmDTJjpSjy/XLVsF+RaX0b436SfSM4hsIUZ7n27+UsbOvzFaFjcYXw==

"@adobe/spectrum-tokens@12.23.3":
version "12.23.3"
resolved "https://registry.yarnpkg.com/@adobe/spectrum-tokens/-/spectrum-tokens-12.23.3.tgz#ae3810c347bc5a5215a2242f6a90541fe8c37bfc"
integrity sha512-MlrrypHWYl0NWwYpe1YhCGCi62lOz/4fgc7xZwlr6+5PXbsP8zTLyld9IIhfIdJck6gpc8Z/fSWiYfd65BHu6Q==
"@adobe/spectrum-tokens@13.0.0-beta.8":
version "13.0.0-beta.8"
resolved "https://registry.yarnpkg.com/@adobe/spectrum-tokens/-/spectrum-tokens-13.0.0-beta.8.tgz#65a730d775634ce255945618de0dc907de83a985"
integrity sha512-XM9mN5nx7TDtGamZ6ciglA8fPJ6vVK24lBKE8Nf2wrsjc7BP8hOjmAFLxh3ROHJ59tCW4s7dGOZyKERcwXillQ==

"@ampproject/remapping@^2.2.0":
version "2.2.1"
Expand Down Expand Up @@ -5856,6 +5856,11 @@ camelcase@^1.0.2:
resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-1.2.1.tgz#9bb5304d2e0b56698b2c758b08a3eaa9daa58a39"
integrity sha512-wzLkDa4K/mzI1OSITC+DUyjgIl/ETNHE9QvYgy6J6Jvqyyz4C0Xfd+lQhb19sX2jMpZV4IssUn0VDVmglV+s4g==

camelcase@^2.0.1:
version "2.1.1"
resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-2.1.1.tgz#7c1d16d679a1bbe59ca02cacecfb011e201f5a1f"
integrity sha512-DLIsRzJVBQu72meAKPkWQOLcujdXT32hwdfnkI1frSiSRMK1MofjKHf+MEx0SB6fjEFXL8fBDv1dKymBlOp4Qw==

camelcase@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-3.0.0.tgz#32fc4b9fcdaf845fcdf7e73bb97cac2261f0ab0a"
Expand Down Expand Up @@ -5939,7 +5944,7 @@ chalk@5.3.0, chalk@^5.0.0, chalk@^5.0.1, chalk@^5.3.0:
resolved "https://registry.yarnpkg.com/chalk/-/chalk-5.3.0.tgz#67c20a7ebef70e7f3970a01f90fa210cb6860385"
integrity sha512-dLitG79d+GV1Nb/VYcCDFivJeK1hiukt9QjRNVOsUtTy1rR1YJsmpGGTZ3qJos+uw7WmWF4wUwBd9jxjocFC2w==

chalk@^1.1.3:
chalk@^1.1.1, chalk@^1.1.3:
version "1.1.3"
resolved "https://registry.yarnpkg.com/chalk/-/chalk-1.1.3.tgz#a8115c55e4a702fe4d150abd3872822a7e09fc98"
integrity sha512-U3lRVLMSlsCfjqYPbLyVv11M9CPW4I728d6TCKMAOJueEeB9/8o+eSsMnxPJD+Q+K909sdESg7C+tIkoH6on1A==
Expand Down Expand Up @@ -6247,7 +6252,7 @@ cliui@^2.1.0:
right-align "^0.1.1"
wordwrap "0.0.2"

cliui@^3.2.0:
cliui@^3.0.3, cliui@^3.2.0:
version "3.2.0"
resolved "https://registry.yarnpkg.com/cliui/-/cliui-3.2.0.tgz#120601537a916d29940f934da3b48d585a39213d"
integrity sha512-0yayqDxWQbqk3ojkYqUKqaAQ6AfNKeKWRNA8kR0WXzAsdHpP4BIaOmMAG87JGuO6qcobyW4GjxHd9PmhEd+T9w==
Expand Down Expand Up @@ -6443,7 +6448,7 @@ commander@^11.0.0:
resolved "https://registry.yarnpkg.com/commander/-/commander-11.1.0.tgz#62fdce76006a68e5c1ab3314dc92e800eb83d906"
integrity sha512-yPVavfyCcRhmorC7rWlkHn15b4wDVgVmBA7kV4QVBsF7kv/9TKJAbAXVTxvTnwP8HHKjRCJDClKbciiYS7p0DQ==

commander@^2.2.0, commander@^2.20.0:
commander@^2.2.0, commander@^2.20.0, commander@^2.9.0:
version "2.20.3"
resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33"
integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==
Expand Down Expand Up @@ -6521,6 +6526,15 @@ compression@^1.7.4:
safe-buffer "5.1.2"
vary "~1.1.2"

concat-cli@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/concat-cli/-/concat-cli-4.0.0.tgz#a73a0fb0d18b25804ebe703bcc35922324dbf74d"
integrity sha512-riOBaEKTe5nHUN4kvrJkzX4xLAjoXKF4sPnIm7x7MExH1qqAsp6Y8vyHEGDTTytKDtHBe1axXt86eQJDfqja2w==
dependencies:
chalk "^1.1.1"
concat "^1.0.0"
yargs "^3.30.0"

concat-map@0.0.1:
version "0.0.1"
resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
Expand Down Expand Up @@ -6553,6 +6567,13 @@ concat-with-sourcemaps@^1.0.0:
dependencies:
source-map "^0.6.1"

concat@^1.0.0:
version "1.0.3"
resolved "https://registry.yarnpkg.com/concat/-/concat-1.0.3.tgz#40f3353089d65467695cb1886b45edd637d8cca8"
integrity sha512-f/ZaH1aLe64qHgTILdldbvyfGiGF4uzeo9IuXUloIOLQzFmIPloy9QbZadNsuVv0j5qbKQvQb/H/UYf2UsKTpw==
dependencies:
commander "^2.9.0"

concordance@^5.0.1:
version "5.0.4"
resolved "https://registry.yarnpkg.com/concordance/-/concordance-5.0.4.tgz#9896073261adced72f88d60e4d56f8efc4bbbbd2"
Expand Down Expand Up @@ -17925,6 +17946,11 @@ window-size@0.1.0:
resolved "https://registry.yarnpkg.com/window-size/-/window-size-0.1.0.tgz#5438cd2ea93b202efa3a19fe8887aee7c94f9c9d"
integrity sha512-1pTPQDKTdd61ozlKGNCjhNRd+KPmgLSGa3mZTHoOliaGcESD8G1PXhh7c1fgiPjVbNVfgy2Faw4BI8/m0cC8Mg==

window-size@^0.1.4:
version "0.1.4"
resolved "https://registry.yarnpkg.com/window-size/-/window-size-0.1.4.tgz#f8e1aa1ee5a53ec5bf151ffa09742a6ad7697876"
integrity sha512-2thx4pB0cV3h+Bw7QmMXcEbdmOzv9t0HFplJH/Lz6yu60hXYy5RT8rUu+wlIreVxWsGN20mo+MHeCSfUpQBwPw==

with@^5.0.0:
version "5.1.1"
resolved "https://registry.yarnpkg.com/with/-/with-5.1.1.tgz#fa4daa92daf32c4ea94ed453c81f04686b575dfe"
Expand Down Expand Up @@ -18101,7 +18127,7 @@ xtend@^4.0.0, xtend@~4.0.0, xtend@~4.0.1:
resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54"
integrity sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==

y18n@^3.2.1:
y18n@^3.2.0, y18n@^3.2.1:
version "3.2.2"
resolved "https://registry.yarnpkg.com/y18n/-/y18n-3.2.2.tgz#85c901bd6470ce71fc4bb723ad209b70f7f28696"
integrity sha512-uGZHXkHnhF0XeeAPgnKfPv1bgKAYyVvmNL1xlKsPYZPaIHxGti2hHqvOCQv71XMsLxu1QjergkqogUnms5D3YQ==
Expand Down Expand Up @@ -18198,6 +18224,19 @@ yargs@^17.0.0, yargs@^17.3.1, yargs@^17.6.2, yargs@^17.7.2:
y18n "^5.0.5"
yargs-parser "^21.1.1"

yargs@^3.30.0:
version "3.32.0"
resolved "https://registry.yarnpkg.com/yargs/-/yargs-3.32.0.tgz#03088e9ebf9e756b69751611d2a5ef591482c995"
integrity sha512-ONJZiimStfZzhKamYvR/xvmgW3uEkAUFSP91y2caTEPhzF6uP2JfPiVZcq66b/YR0C3uitxSV7+T1x8p5bkmMg==
dependencies:
camelcase "^2.0.1"
cliui "^3.0.3"
decamelize "^1.1.1"
os-locale "^1.4.0"
string-width "^1.0.1"
window-size "^0.1.4"
y18n "^3.2.0"

yargs@^7.1.0:
version "7.1.2"
resolved "https://registry.yarnpkg.com/yargs/-/yargs-7.1.2.tgz#63a0a5d42143879fdbb30370741374e0641d55db"
Expand Down