@adobe/spectrum-css
Version:
The Spectrum CSS top-level backwards compatible package
100 lines (98 loc) • 3.91 kB
CSS
.spectrum-Card {
border-color: rgb(44, 44, 44);
background-color: rgb(8, 8, 8);
}
.spectrum-Card:hover {
border-color: rgb(73, 73, 73);
}
.spectrum-Card.is-selected,
.spectrum-Card.focus-ring {
border-color: rgb(20, 115, 230);
box-shadow: 0 0 0 1px rgb(20, 115, 230);
}
.spectrum-Card.is-drop-target {
border-color: rgb(20, 115, 230);
box-shadow: 0 0 0 1px rgb(20, 115, 230);
background-color: rgba(38,128,235,0.2);
}
.spectrum-Card .spectrum-Card-title {
color: rgb(200, 200, 200);
}
.spectrum-Card .spectrum-Card-subtitle {
color: rgb(162, 162, 162);
}
.spectrum-Card-description {
color: rgb(162, 162, 162);
}
.spectrum-Card-coverPhoto {
background-color: rgb(44, 44, 44);
border-bottom-color: rgb(44, 44, 44);
}
.spectrum-Card-footer {
border-color: rgb(44, 44, 44);
}
.spectrum-Card--quiet,
.spectrum-Card--gallery {
border-color: transparent;
background-color: transparent;
}
.spectrum-Card--quiet .spectrum-Card-preview, .spectrum-Card--gallery .spectrum-Card-preview {
background-color: rgb(44, 44, 44);
}
.spectrum-Card--quiet:hover, .spectrum-Card--gallery:hover {
border-color: transparent;
}
.spectrum-Card--quiet:hover .spectrum-Card-preview, .spectrum-Card--gallery:hover .spectrum-Card-preview {
background-color: rgb(57, 57, 57);
}
.spectrum-Card--quiet.is-selected,
.spectrum-Card--quiet.focus-ring,
.spectrum-Card--gallery.is-selected,
.spectrum-Card--gallery.focus-ring {
border-color: transparent;
box-shadow: none;
}
.spectrum-Card--quiet.is-selected .spectrum-Card-preview, .spectrum-Card--quiet.focus-ring .spectrum-Card-preview, .spectrum-Card--gallery.is-selected .spectrum-Card-preview, .spectrum-Card--gallery.focus-ring .spectrum-Card-preview {
background-color: rgb(44, 44, 44);
}
.spectrum-Card--quiet.is-selected .spectrum-Card-preview:before, .spectrum-Card--quiet.focus-ring .spectrum-Card-preview:before, .spectrum-Card--gallery.is-selected .spectrum-Card-preview:before, .spectrum-Card--gallery.focus-ring .spectrum-Card-preview:before {
border-color: rgb(38, 128, 235);
box-shadow: 0 0 0 1px rgb(38, 128, 235);
}
.spectrum-Card--quiet.is-drop-target, .spectrum-Card--gallery.is-drop-target {
border-color: transparent;
background-color: transparent;
box-shadow: none;
}
.spectrum-Card--quiet.is-drop-target .spectrum-Card-preview, .spectrum-Card--gallery.is-drop-target .spectrum-Card-preview {
background-color: rgba(38,128,235,0.2);
}
.spectrum-Card--quiet.is-drop-target .spectrum-Card-preview:before, .spectrum-Card--gallery.is-drop-target .spectrum-Card-preview:before {
border-color: rgb(38, 128, 235);
box-shadow: 0 0 0 1px rgb(38, 128, 235);
}
.spectrum-Card--quiet.is-drop-target .spectrum-Asset-folderBackground,
.spectrum-Card--quiet.is-drop-target .spectrum-Asset-fileBackground,
.spectrum-Card--gallery.is-drop-target .spectrum-Asset-folderBackground,
.spectrum-Card--gallery.is-drop-target .spectrum-Asset-fileBackground {
fill: rgba(38,128,235,0.2);
}
.spectrum-Card--quiet.is-drop-target .spectrum-Asset-folderOutline,
.spectrum-Card--quiet.is-drop-target .spectrum-Asset-fileOutline,
.spectrum-Card--gallery.is-drop-target .spectrum-Asset-folderOutline,
.spectrum-Card--gallery.is-drop-target .spectrum-Asset-fileOutline {
fill: rgb(38, 128, 235);
}
.spectrum-Card--quiet .spectrum-Card-title, .spectrum-Card--gallery .spectrum-Card-title {
color: rgb(200, 200, 200);
}
.spectrum-Card--quiet .spectrum-Card-subtitle, .spectrum-Card--gallery .spectrum-Card-subtitle {
color: rgb(162, 162, 162);
}
.spectrum-Card--horizontal:hover .spectrum-Card-preview {
border-color: rgb(73, 73, 73);
}
.spectrum-Card--horizontal .spectrum-Card-preview {
background-color: rgb(44, 44, 44);
border-color: rgb(44, 44, 44);
}