npm - @react-spectrum/card - Versions diffs - 3.0.0-alpha.1 → 3.0.0-alpha.2 - Mend

@react-spectrum/card 3.0.0-alpha.1 → 3.0.0-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (14) hide show

package/dist/main.css.map DELETED Viewed

@@ -1 +0,0 @@

- {"mappings":"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","sources":["./node_modules/@adobe/spectrum-css-temp/components/card/index.css","./node_modules/@adobe/spectrum-css-temp/components/card/skin.css"],"sourcesContent":["/*\nCopyright 2019 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\n@import '../commons/index.css';\n\n/**\nLAYERS: There are 5 layers to quiet cards\nlayer -1:\n card back color, seen mostly in quiet cards in a grid\n\nlayer default:\n all content provided by the user\n\nlayer 1:\n avatar\n\nlayer 2:\n color covering\n\nlayer 3:\n checkbox\n*/\n/**\nLAYERS: There are 4 layers to standard/horizontal cards\nno -1 layer because standard cards have a background already\nlayer default:\n all content provided by the user\n\nlayer 1:\n avatar\n\nlayer 2:\n color covering\n\nlayer 3:\n checkbox\n*/\n\n/**\nLAYOUTS\n standard-vertical standard-horizontal quiet-vertical\nvertical-masonry x no x\nhorizontal-masonry no no x\ntiles x x x\nstandalone x x x\n\nStandard Vertical\n.spectrum-Card--waterfall\n.spectrum-Card--tile\n.spectrum-Card--noLayout\n\nStandard Horizontal\n.spectrum-Card--tile\n.spectrum-Card--noLayout\n\nQuiet Vertical\n.spectrum-Card--waterfall\n.spectrum-Card--gallery\n.spectrum-Card--tile\n.spectrum-Card--noLayout\n*/\n\n/**\nELEMENTS\n.spectrum-Card\n.spectrum-Card:before element in standard cards for border/focus\n.spectrum-Card:after element in standard cards for selection overlay\n.spectrum-Card-grid element defining the css grid that everything is laid out on\n.spectrum-Card-grid:before element in the grid used to enforce aspect ratio in quiet cards\n.spectrum-Card-grid:after element in the grid used to decorate with focus ring (required on just the image part in quiet cards)\n.spectrum-Card-grid .spectrum-Card-decoration extra element in the grid used to decorative features like the blue overlay just over the image in quiet cards\n.spectrum-Card-grid .spectrum-Card-sizeHelper extra element in the grid used to enforce aspect ratio in horizontal cards (can't use the before for this, see FF)\n.spectrum-Card-checkboxWrapper\n.spectrum-Card-checkbox\n\nuser-provided\n.spectrum-Card-image\n.spectrum-Card-illustration\n.spectrum-Card-avatar\n.spectrum-Card-heading\n.spectrum-Card-detail\n.spectrum-Card-actions\n.spectrum-Card-content\n.spectrum-Card-divider\n.spectrum-Card-footer\n */\n\n\n/** Shared **/\n.spectrum-Card {\n box-sizing: border-box;\n min-inline-size: var(--spectrum-card-body-header-height);;\n block-size: 100%;\n border-radius: var(--spectrum-card-border-radius);\n\n user-select: none;\n text-decoration: none;\n\n &:focus {\n outline: none;\n }\n\n .spectrum-Card-heading {\n margin: 0;\n }\n .spectrum-Card-checkboxWrapper {\n position: absolute;\n inset-inline-start: var(--spectrum-card-checkbox-margin);\n inset-block-start: var(--spectrum-card-checkbox-margin);\n display: grid;\n inline-size: var(--spectrum-quickactions-height);\n block-size: var(--spectrum-quickactions-height);\n border-radius: var(--spectrum-card-quiet-border-radius);\n visibility: hidden;\n }\n .spectrum-Card-checkbox {\n /* make hitbox of checkbox same as the floating background it sits on, top and bottom are computing 0 right now though\n using calc(50% - var(--spectrum-checkbox-height) - calc(var(--spectrum-checkbox-box-size) / 2))\n */\n padding: 4px\n calc(50% - calc(var(--spectrum-checkbox-box-size) / 2))\n 4px\n calc(50% - calc(var(--spectrum-checkbox-box-size) / 2));\n }\n\n &.is-focused,\n &.is-selected,\n &.focus-ring, /* only for visible focus */\n &:hover {\n .spectrum-Card-checkboxWrapper {\n /* Ideally, this would simply apply is-open to the QuickActions component */\n visibility: visible;\n opacity: 1;\n pointer-events: all;\n }\n }\n}\n\n.spectrum-Card-grid {\n position: relative;\n &:before {\n\n }\n &:after,\n .spectrum-Card-decoration{\n pointer-events: none;\n }\n}\n\n.spectrum-Card-image {\n grid-area: preview;\n & img {\n -webkit-user-drag: none;\n user-drag: none;\n }\n}\n.spectrum-Card-illustration {\n grid-area: preview;\n & svg {\n -webkit-user-drag: none;\n user-drag: none;\n }\n}\n.spectrum-Card-avatar {\n grid-area: avatar;\n z-index: 1;\n}\n.spectrum-Card-heading {\n grid-area: title;\n word-break: break-word;\n}\n.spectrum-Card-detail {\n grid-area: detail;\n word-break: break-word;\n}\n.spectrum-Card-actions {\n grid-area: actionmenu;\n align-self: start;\n}\n.spectrum-Card-content {\n grid-area: content;\n word-break: break-word;\n overflow: hidden;\n}\n.spectrum-Card-divider {\n grid-area: divider;\n}\n.spectrum-Card-footer {\n grid-area: footer;\n}\n.spectrum-Card-decoration {\n display: none;\n}\n\n/** Standard Vertical **/\n/** Waterfall **/\n.spectrum-Card--waterfall.spectrum-Card--default {\n .spectrum-Card-checkboxWrapper {\n z-index: 3;\n }\n &:after {\n z-index: 2;\n pointer-events: none;\n }\n position: relative;\n border-width: var(--spectrum-card-border-size);\n border-style: solid;\n border-radius: var(--spectrum-card-border-radius);\n\n &:before {\n content: ' ';\n inline-size: 100%;\n block-size: 100%;\n position: absolute;\n inset-inline-start: 0;\n inset-block-start: 0;\n border-radius: var(--spectrum-card-border-radius);\n }\n\n &:after {\n content: ' ';\n inline-size: 100%;\n block-size: 100%;\n position: absolute;\n inset-inline-start: 0;\n inset-block-start: 0;\n border-radius: var(--spectrum-card-border-radius);\n }\n\n .spectrum-Card-grid {\n display: grid;\n grid-template-columns: var(--spectrum-card-body-padding-left) minmax(0, auto) 1fr minmax(0, auto) var(--spectrum-card-body-padding-right);\n grid-template-rows: minmax(var(--spectrum-card-coverphoto-height), auto) var(--spectrum-global-dimension-size-300) minmax(var(--spectrum-actionbutton-height), auto) 1fr auto auto var(--spectrum-card-body-padding-bottom);\n /* absolutely position avatar relative to the preview */\n grid-template-areas:\n \"preview preview preview preview preview\"\n \". . . . .\"\n \". title detail actionmenu .\"\n \". content content content .\"\n \". divider divider divider .\"\n \". footer footer footer .\"\n \". . . . .\";\n\n &:before {\n content: ' ';\n grid-area: preview;\n inline-size: 100%;\n block-size: 100%;\n border-start-start-radius: var(--spectrum-card-border-radius);\n border-start-end-radius: var(--spectrum-card-border-radius);\n }\n }\n\n &.spectrum-Card--noPreview .spectrum-Card-grid {\n display: grid;\n grid-template-columns: var(--spectrum-card-body-padding-left) minmax(0, auto) 1fr minmax(0, auto) var(--spectrum-card-body-padding-right);\n grid-template-rows: var(--spectrum-global-dimension-size-300) auto 1fr auto auto var(--spectrum-card-body-padding-bottom);\n /* absolutely position avatar relative to the preview */\n grid-template-areas:\n \". . . . .\"\n \". title detail actionmenu .\"\n \". content content content .\"\n \". divider divider divider .\"\n \". footer footer footer .\"\n \". . . . .\";\n\n .spectrum-Card-avatar {\n display: none;\n }\n }\n\n .spectrum-Card-image,\n .spectrum-Card-illustration {\n inline-size: 100%;\n block-size: 100%;\n\n align-self: center;\n justify-self: center;\n\n border-block-end-width: var(--spectrum-card-border-size);\n border-block-end-style: solid;\n border-start-start-radius: var(--spectrum-card-border-radius);\n border-start-end-radius: var(--spectrum-card-border-radius);\n }\n .spectrum-Card-image {\n }\n .spectrum-Card-illustration {\n display: grid; /* not sure why flex doesn't work here */\n align-items: center;\n justify-items: center;\n }\n .spectrum-Card-avatar {\n grid-area: preview;\n position: absolute;\n inset-block-end: -10px;\n inset-inline-start: var(--spectrum-card-body-padding-left);\n }\n .spectrum-Card-heading {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-detail {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n .spectrum-Card-actions {\n }\n .spectrum-Card-content {\n margin-block-end: 5px;\n }\n .spectrum-Card-divider {\n margin-block-start: 5px;\n margin-block-end: 5px;\n }\n .spectrum-Card-footer {\n margin-block-start: 5px;\n display: flex;\n justify-content: flex-end;\n }\n}\n\n/** Tile **/\n.spectrum-Card--grid.spectrum-Card--default {\n .spectrum-Card-checkboxWrapper {\n z-index: 3;\n }\n &:after {\n z-index: 2;\n pointer-events: none;\n }\n position: relative;\n border-width: var(--spectrum-card-border-size);\n border-style: solid;\n border-radius: var(--spectrum-card-border-radius);\n\n &:before {\n content: ' ';\n inline-size: 100%;\n block-size: 100%;\n position: absolute;\n inset-inline-start: 0;\n inset-block-start: 0;\n border-radius: var(--spectrum-card-border-radius);\n }\n\n &:after {\n content: ' ';\n inline-size: 100%;\n block-size: 100%;\n position: absolute;\n inset-inline-start: 0;\n inset-block-start: 0;\n border-radius: var(--spectrum-card-border-radius);\n }\n\n &:not(.spectrum-Card--noPreview) .spectrum-Card-grid {\n display: grid;\n block-size: 100%;\n grid-template-columns: var(--spectrum-card-body-padding-left) minmax(0, auto) 1fr minmax(0, auto) var(--spectrum-card-body-padding-right);\n grid-template-rows: minmax(var(--spectrum-card-coverphoto-height), 1fr) var(--spectrum-global-dimension-size-200) minmax(var(--spectrum-actionbutton-height), auto) auto auto auto var(--spectrum-card-body-padding-bottom);\n /* absolutely position avatar relative to the preview */\n grid-template-areas:\n \"preview preview preview preview preview\"\n \". . . . .\"\n \". title detail actionmenu .\"\n \". content content content .\"\n \". divider divider divider .\"\n \". footer footer footer .\"\n \". . . . .\";\n\n &:before {\n content: ' ';\n grid-area: preview;\n inline-size: 100%;\n block-size: 100%;\n border-start-start-radius: var(--spectrum-card-border-radius);\n border-start-end-radius: var(--spectrum-card-border-radius);\n }\n }\n\n &.spectrum-Card--noPreview .spectrum-Card-grid {\n display: grid;\n block-size: 100%;\n grid-template-columns: var(--spectrum-card-body-padding-left) minmax(0, auto) 1fr minmax(0, auto) var(--spectrum-card-body-padding-right);\n grid-template-rows: var(--spectrum-global-dimension-size-300) auto 1fr auto auto var(--spectrum-card-body-padding-bottom);\n /* absolutely position avatar relative to the preview */\n grid-template-areas:\n \". . . . .\"\n \". title detail actionmenu .\"\n \". content content content .\"\n \". divider divider divider .\"\n \". footer footer footer .\"\n \". . . . .\";\n\n .spectrum-Card-avatar {\n display: none;\n }\n }\n .spectrum-Card-image,\n .spectrum-Card-illustration {\n inline-size: 100%;\n block-size: 100%;\n /*min-inline-size: var(--spectrum-card-min-width); causes to obscure border */\n\n align-self: center;\n justify-self: center;\n\n border-block-end-width: var(--spectrum-card-border-size);\n border-block-end-style: solid;\n border-start-start-radius: var(--spectrum-card-border-radius);\n border-start-end-radius: var(--spectrum-card-border-radius);\n }\n .spectrum-Card-image {\n }\n .spectrum-Card-illustration {\n display: grid; /* not sure why flex doesn't work here */\n align-items: center;\n justify-items: center;\n }\n .spectrum-Card-avatar {\n grid-area: preview;\n position: absolute;\n inset-block-end: -10px;\n inset-inline-start: var(--spectrum-card-body-padding-left);\n }\n .spectrum-Card-heading {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-detail {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n .spectrum-Card-actions {\n }\n .spectrum-Card-content {\n margin-block-end: 5px;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n .spectrum-Card-divider {\n margin-block-start: 5px;\n margin-block-end: 5px;\n }\n .spectrum-Card-footer {\n margin-block-start: 5px;\n display: flex;\n justify-content: flex-end;\n }\n}\n\n/** Standalone **/\n.spectrum-Card--noLayout.spectrum-Card--default {\n .spectrum-Card-checkboxWrapper {\n z-index: 3;\n }\n &:after {\n z-index: 2;\n pointer-events: none;\n }\n position: relative;\n border-width: var(--spectrum-card-border-size);\n border-style: solid;\n border-radius: var(--spectrum-card-border-radius);\n\n &:before {\n content: ' ';\n inline-size: 100%;\n block-size: 100%;\n position: absolute;\n inset-inline-start: 0;\n inset-block-start: 0;\n border-radius: var(--spectrum-card-border-radius);\n }\n\n &:after {\n content: ' ';\n inline-size: 100%;\n block-size: 100%;\n position: absolute;\n inset-inline-start: 0;\n inset-block-start: 0;\n border-radius: var(--spectrum-card-border-radius);\n }\n\n &:not(.spectrum-Card--noPreview) .spectrum-Card-grid {\n display: grid;\n grid-template-columns: var(--spectrum-card-body-padding-left) minmax(0, auto) 1fr minmax(0, auto) var(--spectrum-card-body-padding-right);\n grid-template-rows: minmax(var(--spectrum-card-coverphoto-height), auto) var(--spectrum-global-dimension-size-300) minmax(var(--spectrum-actionbutton-height), auto) 1fr auto auto var(--spectrum-card-body-padding-bottom);\n /* absolutely position avatar relative to the preview */\n grid-template-areas:\n \"preview preview preview preview preview\"\n \". . . . .\"\n \". title detail actionmenu .\"\n \". content content content .\"\n \". divider divider divider .\"\n \". footer footer footer .\"\n \". . . . .\";\n\n &:before {\n content: ' ';\n grid-area: preview;\n inline-size: 100%;\n block-size: 100%;\n border-start-start-radius: var(--spectrum-card-border-radius);\n border-start-end-radius: var(--spectrum-card-border-radius);\n }\n }\n\n &.spectrum-Card--noPreview .spectrum-Card-grid {\n display: grid;\n grid-template-columns: var(--spectrum-card-body-padding-left) minmax(0, auto) 1fr minmax(0, auto) var(--spectrum-card-body-padding-right);\n grid-template-rows: var(--spectrum-global-dimension-size-300) auto 1fr auto auto var(--spectrum-card-body-padding-bottom);\n /* absolutely position avatar relative to the preview */\n grid-template-areas:\n \". . . . .\"\n \". title detail actionmenu .\"\n \". content content content .\"\n \". divider divider divider .\"\n \". footer footer footer .\"\n \". . . . .\";\n\n /* TODO: is this accurate? if we don't want to enforce it, then we can\n give min-height to spectrum-Card-image/illustration\n and it would no longer be a card state, we could simplify */\n .spectrum-Card-avatar {\n display: none;\n }\n }\n .spectrum-Card-image,\n .spectrum-Card-illustration {\n inline-size: 100%;\n block-size: 100%;\n /*min-inline-size: var(--spectrum-card-min-width); causes to obscure border */\n\n align-self: center;\n justify-self: center;\n\n border-block-end-width: var(--spectrum-card-border-size);\n border-block-end-style: solid;\n border-start-start-radius: var(--spectrum-card-border-radius);\n border-start-end-radius: var(--spectrum-card-border-radius);\n }\n .spectrum-Card-image {\n }\n .spectrum-Card-illustration {\n display: grid; /* not sure why flex doesn't work here */\n align-items: center;\n justify-items: center;\n inline-size: 100%;\n block-size: var(--spectrum-card-coverphoto-height); /* this may be an incorrect assumption */\n }\n .spectrum-Card-avatar {\n grid-area: preview;\n position: absolute;\n inset-block-end: -10px;\n inset-inline-start: var(--spectrum-card-body-padding-left);\n }\n .spectrum-Card-heading {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-detail {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n .spectrum-Card-actions {\n }\n .spectrum-Card-content {\n margin-block-end: 5px;\n }\n .spectrum-Card-divider {\n margin-block-start: 5px;\n margin-block-end: 5px;\n }\n .spectrum-Card-footer {\n margin-block-start: 5px;\n display: flex;\n justify-content: flex-end;\n }\n}\n/** END Standard Vertical **/\n\n\n/** Quiet Vertical **/\n/** Waterfall **/\n.spectrum-Card--waterfall.spectrum-Card--isQuiet {\n .spectrum-Card-checkboxWrapper {\n z-index: 3;\n }\n .spectrum-Card-grid:before {\n z-index: -1;\n }\n .spectrum-Card-grid:after {\n z-index: 2;\n }\n min-inline-size: var(--spectrum-card-quiet-min-size);\n\n .spectrum-Card-grid {\n block-size: 100%;\n display: grid;\n grid-template-columns: minmax(0, auto) minmax(30px, 1fr) minmax(0, auto);\n grid-template-rows: minmax(var(--spectrum-card-coverphoto-height), auto) var(--spectrum-card-quiet-body-header-margin-top) minmax(var(--spectrum-actionbutton-height), auto) 1fr var(--spectrum-card-body-padding-bottom);\n grid-template-areas:\n \"preview preview preview\"\n \". . .\"\n \"title detail actionmenu\"\n \"content content content\"\n \". . . \";\n\n &:before {\n content: ' ';\n grid-area: preview;\n\n border-radius: var(--spectrum-card-quiet-border-radius);\n }\n\n &:after {\n content: ' ';\n grid-area: preview;\n position: absolute;\n inset-inline-start: 0;\n inset-inline-end: 0;\n inset-block-start: 0;\n inset-block-end: 0;\n margin: calc(var(--spectrum-alias-focus-ring-gap) * -2);\n\n border-radius: calc(var(--spectrum-card-quiet-border-radius) + var(--spectrum-alias-focus-ring-gap));\n }\n .spectrum-Card-decoration {\n display: block;\n grid-area: preview;\n inline-size: 100%;\n block-size: 100%;\n\n border-radius: var(--spectrum-card-quiet-border-radius);\n }\n }\n .spectrum-Card-image,\n .spectrum-Card-illustration {\n block-size: 100%;\n inline-size: 100%;\n min-inline-size: 100%; /* I do not know why setting a min-width causes the image to shrink */\n\n align-self: center;\n justify-self: center;\n border-radius: var(--spectrum-card-quiet-border-radius);\n }\n .spectrum-Card-illustration {\n display: grid; /* not sure why flex doesn't work here */\n align-items: center;\n justify-items: center;\n }\n .spectrum-Card-avatar {\n display: none;\n }\n .spectrum-Card-heading {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-detail {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-actions {\n }\n .spectrum-Card-content {\n margin-block-end: 5px;\n }\n .spectrum-Card-divider {\n display: none;\n }\n .spectrum-Card-footer {\n display: none;\n }\n}\n\n/** Gallery **/\n/** Non-collection version doesn't work in FF, but should work in a collection which determines the size **/\n.spectrum-Card--gallery.spectrum-Card--isQuiet {\n .spectrum-Card-checkboxWrapper {\n z-index: 3;\n }\n .spectrum-Card-grid:before {\n z-index: -1;\n }\n .spectrum-Card-grid:after {\n z-index: 2;\n }\n min-inline-size: var(--spectrum-card-quiet-min-size);\n\n .spectrum-Card-grid {\n block-size: 100%;\n display: grid;\n grid-template-columns: minmax(0, auto) minmax(30px, 1fr) minmax(0, auto);\n grid-template-rows: 1fr var(--spectrum-card-quiet-body-header-margin-top) minmax(var(--spectrum-actionbutton-height), auto) minmax(auto, var(--spectrum-global-dimension-size-600)) var(--spectrum-card-body-padding-bottom);\n grid-template-areas:\n \"preview preview preview\"\n \". . .\"\n \"title detail actionmenu\"\n \"content content content\"\n \". . . \";\n\n &:before {\n content: ' ';\n grid-area: preview;\n\n border-radius: var(--spectrum-card-quiet-border-radius);\n }\n\n &:after {\n content: ' ';\n grid-area: preview;\n position: absolute;\n inset-inline-start: 0;\n inset-inline-end: 0;\n inset-block-start: 0;\n inset-block-end: 0;\n margin: calc(var(--spectrum-alias-focus-ring-gap) * -2);\n\n border-radius: calc(var(--spectrum-card-quiet-border-radius) + var(--spectrum-alias-focus-ring-gap));\n }\n .spectrum-Card-decoration {\n display: block;\n grid-area: preview;\n inline-size: 100%;\n block-size: 100%;\n\n border-radius: var(--spectrum-card-quiet-border-radius);\n }\n }\n .spectrum-Card-image,\n .spectrum-Card-illustration {\n block-size: 100%;\n inline-size: 100%;\n min-inline-size: 100%; /* I do not know why setting a min-width causes the image to shrink */\n\n align-self: center;\n justify-self: center;\n border-radius: var(--spectrum-card-quiet-border-radius);\n > img {\n width: unset;\n margin: auto;\n }\n }\n\n .spectrum-Card-illustration {\n display: grid; /* not sure why flex doesn't work here */\n align-items: center;\n justify-items: center;\n }\n .spectrum-Card-avatar {\n display: none;\n }\n .spectrum-Card-heading {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-detail {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-actions {\n }\n .spectrum-Card-content {\n margin-block-end: 5px;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n .spectrum-Card-divider {\n display: none;\n }\n .spectrum-Card-footer {\n display: none;\n }\n}\n\n/** Tile **/\n.spectrum-Card--grid.spectrum-Card--isQuiet {\n .spectrum-Card-checkboxWrapper {\n z-index: 3;\n }\n .spectrum-Card-grid:before {\n z-index: -1;\n }\n .spectrum-Card-grid:after {\n z-index: 2;\n }\n min-inline-size: var(--spectrum-card-quiet-min-size);\n\n .spectrum-Card-grid {\n block-size: 100%;\n display: grid;\n grid-template-columns: minmax(0, auto) minmax(30px, 1fr) minmax(0, auto);\n grid-template-rows: auto var(--spectrum-card-quiet-body-header-margin-top) minmax(var(--spectrum-actionbutton-height), auto) var(--spectrum-alias-single-line-height) 1fr;\n grid-template-areas:\n \"preview preview preview\"\n \". . .\"\n \"title detail actionmenu\"\n \"content content content\"\n \". . . \";\n\n &:before {\n content: ' ';\n grid-area: preview;\n\n /* aspect ratio 1:1 because padding-top is calculated from width */\n inline-size: 0;\n block-size: 0;\n padding-top: 100%;\n padding-left: 100%;\n\n border-radius: var(--spectrum-card-quiet-border-radius);\n }\n\n &:after {\n content: ' ';\n grid-area: preview;\n position: absolute;\n inset-inline-start: 0;\n inset-inline-end: 0;\n inset-block-start: 0;\n inset-block-end: 0;\n margin: calc(var(--spectrum-alias-focus-ring-gap) * -2);\n\n border-radius: calc(var(--spectrum-card-quiet-border-radius) + var(--spectrum-alias-focus-ring-gap));\n }\n .spectrum-Card-decoration {\n display: block;\n grid-area: preview;\n inline-size: 100%;\n block-size: 100%;\n\n border-radius: var(--spectrum-card-quiet-border-radius);\n }\n }\n &:not(.spectrum-Card--closeToSquare) .spectrum-Card-image,\n &:not(.spectrum-Card--closeToSquare) .spectrum-Card-illustration {\n box-sizing: border-box; /* so that 100% counts padding as well */\n block-size: 100%;\n inline-size: 100%;\n min-inline-size: 100%; /* I do not know why setting a min-width causes the image to shrink */\n\n align-self: center;\n justify-self: center;\n }\n &.spectrum-Card--closeToSquare .spectrum-Card-image,\n &.spectrum-Card--closeToSquare .spectrum-Card-illustration {\n box-sizing: border-box; /* so that 100% counts padding as well */\n padding: var(--spectrum-global-dimension-size-300);\n block-size: 100%;\n inline-size: 100%;\n min-inline-size: 100%; /* I do not know why setting a min-width causes the image to shrink */\n\n align-self: center;\n justify-self: center;\n }\n .spectrum-Card-image {\n clip-path: inset(0% 0% 0% 0% round var(--spectrum-card-quiet-border-radius));\n /* remove from flow so it doesn't affect grid area size, this way the aspect ratio is maintained\n todo: figure out why or how it's already in the correct centered spot */\n position: absolute;\n }\n .spectrum-Card-illustration {\n display: grid; /* not sure why flex doesn't work here */\n align-items: center;\n justify-items: center;\n }\n .spectrum-Card-avatar {\n display: none;\n }\n .spectrum-Card-heading {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-detail {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-actions {\n }\n .spectrum-Card-content {\n margin-block-end: 5px;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n .spectrum-Card-divider {\n display: none;\n }\n .spectrum-Card-footer {\n display: none;\n }\n}\n\n/** Standalone **/\n.spectrum-Card--noLayout.spectrum-Card--isQuiet {\n .spectrum-Card-checkboxWrapper {\n z-index: 3;\n }\n .spectrum-Card-grid:before {\n z-index: -1;\n }\n .spectrum-Card-grid:after {\n z-index: 2;\n }\n min-inline-size: var(--spectrum-card-quiet-min-size);\n\n .spectrum-Card-grid {\n block-size: 100%;\n display: grid;\n grid-template-columns: minmax(0, auto) minmax(30px, 1fr) minmax(0, auto);\n grid-template-rows: auto var(--spectrum-card-quiet-body-header-margin-top) minmax(var(--spectrum-actionbutton-height), auto) auto var(--spectrum-card-body-padding-bottom);\n grid-template-areas:\n \"preview preview preview\"\n \". . .\"\n \"title detail actionmenu\"\n \"content content content\"\n \". . . \";\n\n &:before {\n content: ' ';\n grid-area: preview;\n\n border-radius: var(--spectrum-card-quiet-border-radius);\n }\n\n &:after {\n content: ' ';\n grid-area: preview;\n position: absolute;\n inset-inline-start: 0;\n inset-inline-end: 0;\n inset-block-start: 0;\n inset-block-end: 0;\n margin: calc(var(--spectrum-alias-focus-ring-gap) * -2);\n padding: calc(var(--spectrum-alias-focus-ring-gap) * 2);\n background-clip: content-box;\n\n border-radius: calc(var(--spectrum-card-quiet-border-radius) + var(--spectrum-alias-focus-ring-gap));\n }\n .spectrum-Card-decoration {\n display: block;\n grid-area: preview;\n inline-size: 100%;\n block-size: 100%;\n\n border-radius: var(--spectrum-card-quiet-border-radius);\n }\n }\n .spectrum-Card-image,\n .spectrum-Card-illustration {\n display: flex;\n\n align-self: center;\n justify-self: center;\n\n border-radius: var(--spectrum-card-quiet-border-radius);\n }\n .spectrum-Card-image {\n }\n .spectrum-Card-illustration {\n display: grid; /* not sure why flex doesn't work here */\n align-items: center;\n justify-items: center;\n inline-size: 100%;\n block-size: var(--spectrum-card-coverphoto-height);\n }\n .spectrum-Card-avatar {\n display: none;\n }\n .spectrum-Card-heading {\n align-self: baseline;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-detail {\n align-self: baseline;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-actions {\n }\n .spectrum-Card-content {\n margin-block-end: 5px;\n }\n .spectrum-Card-divider {\n display: none;\n }\n .spectrum-Card-footer {\n display: none;\n }\n}\n/** END Quiet Vertical **/\n\n/** Standard Horizontal **/\n/**\nBroken as a CSS only solution in Safari until aspect-ratio is supported https://caniuse.com/?search=aspect-ratio\nFor now working around it with a useLayoutEffect in CardBase.\n**/\n/** Tile **/\n.spectrum-Card--grid.spectrum-Card--horizontal {\n .spectrum-Card-grid:after {\n z-index: 2;\n }\n border-width: var(--spectrum-card-border-size);\n border-style: solid;\n border-radius: var(--spectrum-card-border-radius);\n .spectrum-Card-checkboxWrapper {\n display: none;\n }\n &.is-focused,\n &.is-selected,\n &:focus,\n &:hover {\n .spectrum-Card-checkboxWrapper {\n display: none;\n }\n }\n\n .spectrum-Card-grid {\n display: grid;\n block-size: 100%;\n grid-template-columns: auto var(--spectrum-global-dimension-size-200) 1fr auto var(--spectrum-global-dimension-size-200);\n grid-template-rows: auto 1fr var(--spectrum-global-dimension-size-200);\n grid-template-areas:\n \"preview . title actionmenu .\"\n \"preview . content content .\"\n \"preview . . . .\";\n\n &:before {\n content: ' ';\n position: absolute;\n\n inline-size: 100%;\n block-size: 100%;\n border-radius: var(--spectrum-card-border-radius);\n }\n }\n .spectrum-Card-image,\n .spectrum-Card-illustration {\n grid-area: preview;\n block-size: 100%;\n /*aspect-ratio: 1/1;*/ /* can't use in safari or FF :( */\n\n align-self: center;\n justify-self: center;\n\n border-start-start-radius: var(--spectrum-card-border-radius);\n border-end-start-radius: var(--spectrum-card-border-radius);\n border-inline-end-width: var(--spectrum-card-border-size);\n border-inline-end-style: solid;\n }\n\n .spectrum-Card-image {\n }\n\n .spectrum-Card-illustration {\n display: grid;\n align-items: center;\n justify-items: center;\n }\n\n .spectrum-Card-avatar {\n display: none;\n }\n .spectrum-Card-heading {\n align-self: center;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-detail {\n display: none;\n }\n .spectrum-Card-actions {\n }\n /* how to handle long description?? */\n .spectrum-Card-content {\n width: 100%;\n overflow: hidden;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n /* not working because this line is removed in css preprocessing */\n -webkit-box-orient: vertical;\n visibility: visible;\n }\n .spectrum-Card-divider {\n display: none;\n }\n .spectrum-Card-footer {\n display: none;\n }\n}\n\n/** Standalone **/\n.spectrum-Card--noLayout.spectrum-Card--horizontal {\n .spectrum-Card-grid:after {\n z-index: 2;\n }\n border-width: var(--spectrum-card-border-size);\n border-style: solid;\n border-radius: var(--spectrum-card-border-radius);\n .spectrum-Card-checkboxWrapper {\n display: none;\n }\n &.is-focused,\n &.is-selected,\n &:focus,\n &:hover {\n .spectrum-Card-checkboxWrapper {\n display: none;\n }\n }\n\n .spectrum-Card-grid {\n position: relative;\n display: grid;\n block-size: 100%;\n max-block-size: 100%;\n grid-template-columns: auto var(--spectrum-global-dimension-size-200) 1fr auto var(--spectrum-global-dimension-size-200);\n grid-template-rows: auto 1fr var(--spectrum-global-dimension-size-200);\n grid-template-areas:\n \"preview . title actionmenu .\"\n \"preview . content content .\"\n \"preview . . . .\";\n\n &:before {\n content: ' ';\n inline-size: 100%;\n block-size: 100%;\n position: absolute;\n border-radius: var(--spectrum-card-border-radius);\n }\n\n &:after {\n content: ' ';\n inline-size: 100%;\n block-size: 100%;\n position: absolute;\n border-radius: var(--spectrum-card-border-radius);\n }\n }\n .spectrum-Card-image,\n .spectrum-Card-illustration {\n grid-area: preview;\n block-size: 100%;\n /*aspect-ratio: 1/1;*/ /* can't use in safari or FF :( */\n\n align-self: center;\n justify-self: center;\n\n border-start-start-radius: var(--spectrum-card-border-radius);\n border-end-start-radius: var(--spectrum-card-border-radius);\n border-inline-end-width: var(--spectrum-card-border-size);\n border-inline-end-style: solid;\n }\n\n .spectrum-Card-image {\n }\n\n .spectrum-Card-illustration {\n display: grid;\n align-items: center;\n justify-items: center;\n }\n\n .spectrum-Card-avatar {\n display: none;\n }\n .spectrum-Card-heading {\n align-self: center;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-inline-end: var(--spectrum-card-title-padding-right);\n }\n .spectrum-Card-detail {\n display: none;\n }\n .spectrum-Card-actions {\n }\n /* how to handle long description?? */\n .spectrum-Card-content {\n width: 100%;\n overflow: hidden;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n /* not working because this line is removed in css preprocessing */\n -webkit-box-orient: vertical;\n visibility: visible;\n }\n .spectrum-Card-divider {\n display: none;\n }\n .spectrum-Card-footer {\n display: none;\n }\n}\n/** END Standard Horizontal **/\n\n/* CardView styles */\n.spectrum-CardView {\n outline: none;\n\n .spectrum-CardView-centeredWrapper {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n }\n .spectrum-CardView-row {\n outline: none;\n height: 100%\n }\n}\n","/*\nCopyright 2019 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\n.spectrum-Card {\n\n &.is-drop-target {\n border-color: var(--spectrum-card-border-color-key-focus);\n box-shadow: 0 0 0 1px var(--spectrum-card-border-color-key-focus);\n background-color: var(--spectrum-alias-highlight-selected);\n }\n\n .spectrum-Card-checkboxWrapper {\n background-color: var(--spectrum-quickactions-background-color);\n }\n\n .spectrum-Card-detail {\n color: var(--spectrum-card-description-text-color);\n }\n}\n\n.spectrum-Card-illustration {\n}\n.spectrum-Card-image {\n}\n.spectrum-Card-avatar {\n}\n.spectrum-Card-heading {\n color: var(--spectrum-global-color-gray-900);\n}\n.spectrum-Card-detail {\n color: var(--spectrum-global-color-gray-700);\n}\n.spectrum-Card-actions {\n}\n.spectrum-Card-content {\n color: var(--spectrum-global-color-gray-700);\n}\n.spectrum-Card-divider {\n}\n.spectrum-Card-footer {\n}\n\n.spectrum-Card--default {\n border-color: var(--spectrum-card-border-color);\n background-color: var(--spectrum-card-background-color);\n\n &:hover {\n border-color: var(--spectrum-card-border-color-hover);\n &:before {\n box-shadow: 0 0 0 1px var(--spectrum-card-border-color-hover);\n }\n }\n\n &.is-selected {\n border-color: var(--spectrum-card-border-color-key-focus);\n &:before {\n /* Image needs to go right to the edge, so no border. Adding border on focus causes\n * a jump in the text and image. So focus ring is only box-shadow\n */\n box-shadow: 0 0 0 1px var(--spectrum-card-border-color-key-focus);\n }\n }\n\n &:hover.is-selected {\n border-color: var(--spectrum-card-border-color-key-focus);\n &:before {\n /* Image needs to go right to the edge, so no border. Adding border on focus causes\n * a jump in the text and image. So focus ring is only box-shadow\n */\n box-shadow: 0 0 0 1px var(--spectrum-card-border-color-key-focus);\n }\n }\n\n &:focus-ring {\n border-color: var(--spectrum-card-border-color-key-focus);\n &:before {\n box-shadow: 0 0 0 2px var(--spectrum-card-border-color-key-focus);\n }\n }\n\n &:focus-ring:hover.is-selected {\n border-color: var(--spectrum-card-border-color-key-focus);\n &:before {\n box-shadow: 0 0 0 2px var(--spectrum-card-border-color-key-focus);\n }\n }\n\n &.is-selected {\n border-color: var(--spectrum-card-border-color-key-focus);\n &:after {\n background-color: var(--spectrum-global-color-blue-400);\n opacity: 0.15;\n }\n &:hover {\n border-color: var(--spectrum-card-border-color-key-focus);\n &:after {\n background-color: var(--spectrum-global-color-blue-400);\n opacity: 0.25;\n }\n }\n }\n &:before {\n transition: background-color var(--spectrum-global-animation-duration-100);\n }\n &:after {\n transition: background-color var(--spectrum-global-animation-duration-100),\n opacity var(--spectrum-global-animation-duration-100);\n opacity: 0;\n }\n .spectrum-Card-grid {\n &:before {\n transition: background-color var(--spectrum-global-animation-duration-100);\n background-color: var(--spectrum-card-quiet-preview-background-color);\n }\n }\n\n .spectrum-Card-image,\n .spectrum-Card-illustration {\n border-block-end-color: var(--spectrum-card-coverphoto-border-color);\n }\n .spectrum-Card-image {\n }\n .spectrum-Card-avatar {\n }\n .spectrum-Card-heading {\n }\n .spectrum-Card-detail {\n }\n .spectrum-Card-actions {\n }\n .spectrum-Card-content {\n color: var(--spectrum-card-description-text-color);\n }\n .spectrum-Card-divider {\n }\n .spectrum-Card-footer {\n }\n}\n\n.spectrum-Card--isQuiet {\n border-color: transparent;\n background-color: transparent;\n &:hover {\n .spectrum-Card-grid {\n &:before {\n background-color: var(--spectrum-card-quiet-preview-background-color-hover);\n /* TODO do we still want this border on the image itself? */\n box-shadow: 0 0 0 1px var(--spectrum-card-border-color-hover);\n }\n }\n }\n\n &.is-selected {\n .spectrum-Card-grid {\n &:after {\n /* Image needs to go right to the edge, so no border. Adding border on focus causes\n * a jump in the text and image. So focus ring is only box-shadow\n */\n box-shadow: 0 0 0 1px var(--spectrum-card-border-color-key-focus);\n }\n }\n }\n\n &:hover.is-selected {\n .spectrum-Card-grid {\n &:after {\n /* Image needs to go right to the edge, so no border. Adding border on focus causes\n * a jump in the text and image. So focus ring is only box-shadow\n */\n box-shadow: 0 0 0 1px var(--spectrum-card-border-color-key-focus);\n }\n }\n }\n\n &:focus-ring {\n .spectrum-Card-grid {\n &:after {\n box-shadow: 0 0 0 2px var(--spectrum-card-border-color-key-focus);\n }\n }\n }\n\n &:focus-ring:hover.is-selected {\n .spectrum-Card-grid {\n &:after {\n box-shadow: 0 0 0 2px var(--spectrum-card-border-color-key-focus);\n }\n }\n }\n\n &.is-selected {\n .spectrum-Card-grid {\n .spectrum-Card-decoration {\n opacity: 0.15;\n }\n }\n &:hover {\n .spectrum-Card-grid {\n .spectrum-Card-decoration {\n opacity: 0.25;\n }\n }\n }\n }\n\n .spectrum-Card-grid {\n &:before {\n transition: background-color var(--spectrum-global-animation-duration-100);\n background-color: var(--spectrum-card-quiet-preview-background-color);\n }\n }\n .spectrum-Card-image,\n .spectrum-Card-illustration {\n }\n .spectrum-Card-image {\n }\n .spectrum-Card-avatar {\n }\n .spectrum-Card-heading {\n }\n .spectrum-Card-detail {\n }\n .spectrum-Card-actions {\n }\n .spectrum-Card-content {\n }\n .spectrum-Card-divider {\n }\n .spectrum-Card-footer {\n }\n .spectrum-Card-decoration {\n transition: background-color var(--spectrum-global-animation-duration-100),\n opacity var(--spectrum-global-animation-duration-100);\n background-color: var(--spectrum-global-color-blue-400);\n opacity: 0;\n }\n}\n\n.spectrum-Card--horizontal {\n border-color: var(--spectrum-card-border-color);\n background-color: var(--spectrum-card-background-color);\n &:hover {\n border-color: var(--spectrum-card-border-color-hover);\n .spectrum-Card-grid {\n &:before {\n box-shadow: 0 0 0 1px var(--spectrum-card-border-color-hover);\n }\n }\n }\n\n &.is-selected {\n border-color: var(--spectrum-card-border-color-key-focus);\n .spectrum-Card-grid {\n &:before {\n /* Image needs to go right to the edge, so no border. Adding border on focus causes\n * a jump in the text and image. So focus ring is only box-shadow\n */\n box-shadow: 0 0 0 1px var(--spectrum-card-border-color-key-focus);\n }\n }\n }\n\n &:hover.is-selected {\n border-color: var(--spectrum-card-border-color-key-focus);\n .spectrum-Card-grid {\n &:before {\n /* Image needs to go right to the edge, so no border. Adding border on focus causes\n * a jump in the text and image. So focus ring is only box-shadow\n */\n box-shadow: 0 0 0 1px var(--spectrum-card-border-color-key-focus);\n }\n }\n }\n\n &:focus-ring {\n border-color: var(--spectrum-card-border-color-key-focus);\n .spectrum-Card-grid {\n &:before {\n box-shadow: 0 0 0 2px var(--spectrum-card-border-color-key-focus);\n }\n }\n }\n\n &:focus-ring:hover.is-selected {\n border-color: var(--spectrum-card-border-color-key-focus);\n .spectrum-Card-grid {\n &:before {\n box-shadow: 0 0 0 2px var(--spectrum-card-border-color-key-focus);\n }\n }\n }\n\n &.is-selected {\n border-color: var(--spectrum-card-border-color-key-focus);\n .spectrum-Card-grid {\n &:after {\n background-color: var(--spectrum-global-color-blue-400);\n opacity: 0.15;\n }\n }\n &:hover {\n border-color: var(--spectrum-card-border-color-key-focus);\n .spectrum-Card-grid {\n &:after {\n background-color: var(--spectrum-global-color-blue-400);\n opacity: 0.25;\n }\n }\n }\n }\n\n .spectrum-Card-grid {\n &:after {\n transition: background-color var(--spectrum-global-animation-duration-100),\n opacity var(--spectrum-global-animation-duration-100);\n opacity: 0;\n }\n }\n .spectrum-Card-image,\n .spectrum-Card-illustration {\n border-inline-end-color: var(--spectrum-card-coverphoto-border-color);\n }\n .spectrum-Card-image {\n }\n .spectrum-Card-illustration {\n }\n .spectrum-Card-avatar {\n }\n .spectrum-Card-heading {\n }\n .spectrum-Card-detail {\n }\n .spectrum-Card-actions {\n }\n .spectrum-Card-content {\n }\n .spectrum-Card-divider {\n }\n .spectrum-Card-footer {\n }\n}\n"],"names":[],"version":3,"file":"main.css.map"}