mirror of
https://github.com/strapi/strapi.git
synced 2025-11-03 11:25:17 +00:00
Add select only when multiple is not set (#11375)
This commit is contained in:
Marvin Frachet
GitHub
parent
c581e4406a
commit
2cb6df703f
@ -26,5 +26,13 @@ export const useSelectionState = (key, initialValue) => {
|
||||
}
|
||||
};
|
||||
|
||||
return [selections, { selectOne, selectAll }];
|
||||
const selectOnly = nextSelection => {
|
||||
if (selections.indexOf(nextSelection) > -1) {
|
||||
setSelections([]);
|
||||
} else {
|
||||
setSelections([nextSelection]);
|
||||
}
|
||||
};
|
||||
|
||||
return [selections, { selectOne, selectAll, selectOnly }];
|
||||
};
|
||||
|
||||
@ -1,3 +1,3 @@
|
||||
const getFileExtension = ext => (ext ? ext.substr(1) : null);
|
||||
const getFileExtension = ext => (ext && ext[0] === '.' ? ext.substr(1) : ext);
|
||||
|
||||
export default getFileExtension;
|
||||
|
||||
@ -0,0 +1,90 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { prefixFileUrlWithBackendUrl, getFileExtension } from '@strapi/helper-plugin';
|
||||
import { ImageAssetCard } from './ImageAssetCard';
|
||||
import { VideoAssetCard } from './VideoAssetCard';
|
||||
import { DocAssetCard } from './DocAssetCard';
|
||||
import { AssetType } from '../../constants';
|
||||
|
||||
export const AssetCard = ({ asset, isSelected, onSelect, onEdit, size }) => {
|
||||
if (asset.mime.includes(AssetType.Video)) {
|
||||
return (
|
||||
<VideoAssetCard
|
||||
id={asset.id}
|
||||
key={asset.id}
|
||||
name={asset.name}
|
||||
extension={getFileExtension(asset.ext)}
|
||||
url={prefixFileUrlWithBackendUrl(asset.url)}
|
||||
mime={asset.mime}
|
||||
onEdit={() => onEdit(asset)}
|
||||
onSelect={() => onSelect(asset)}
|
||||
selected={isSelected}
|
||||
size={size}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
if (asset.mime.includes(AssetType.Image)) {
|
||||
return (
|
||||
<ImageAssetCard
|
||||
id={asset.id}
|
||||
key={asset.id}
|
||||
name={asset.name}
|
||||
alt={asset.alternativeText || asset.name}
|
||||
extension={getFileExtension(asset.ext)}
|
||||
height={asset.height}
|
||||
width={asset.width}
|
||||
thumbnail={prefixFileUrlWithBackendUrl(asset?.formats?.thumbnail?.url || asset.url)}
|
||||
onEdit={() => onEdit(asset)}
|
||||
onSelect={() => onSelect(asset)}
|
||||
selected={isSelected}
|
||||
size={size}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<DocAssetCard
|
||||
id={asset.id}
|
||||
key={asset.id}
|
||||
name={asset.name}
|
||||
extension={getFileExtension(asset.ext)}
|
||||
onEdit={() => onEdit(asset)}
|
||||
onSelect={() => onSelect(asset)}
|
||||
selected={isSelected}
|
||||
size={size}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
AssetCard.defaultProps = {
|
||||
isSelected: false,
|
||||
onSelect: undefined,
|
||||
onEdit: undefined,
|
||||
size: 'M',
|
||||
};
|
||||
|
||||
AssetCard.propTypes = {
|
||||
asset: PropTypes.shape({
|
||||
id: PropTypes.number,
|
||||
height: PropTypes.number,
|
||||
width: PropTypes.number,
|
||||
size: PropTypes.number,
|
||||
createdAt: PropTypes.string,
|
||||
ext: PropTypes.string,
|
||||
mime: PropTypes.string,
|
||||
name: PropTypes.string,
|
||||
url: PropTypes.string,
|
||||
alternativeText: PropTypes.string,
|
||||
caption: PropTypes.string,
|
||||
formats: PropTypes.shape({
|
||||
thumbnail: PropTypes.shape({
|
||||
url: PropTypes.string,
|
||||
}),
|
||||
}),
|
||||
}).isRequired,
|
||||
onSelect: PropTypes.func,
|
||||
onEdit: PropTypes.func,
|
||||
isSelected: PropTypes.bool,
|
||||
size: PropTypes.oneOf(['S', 'M']),
|
||||
};
|
||||
@ -57,11 +57,12 @@ export const VideoPreview = ({ url, mime, onLoadDuration, size }) => {
|
||||
|
||||
VideoPreview.defaultProps = {
|
||||
size: 'M',
|
||||
onLoadDuration: () => {},
|
||||
};
|
||||
|
||||
VideoPreview.propTypes = {
|
||||
url: PropTypes.string.isRequired,
|
||||
mime: PropTypes.string.isRequired,
|
||||
onLoadDuration: PropTypes.func.isRequired,
|
||||
onLoadDuration: PropTypes.func,
|
||||
size: PropTypes.oneOf(['S', 'M']),
|
||||
};
|
||||
|
||||
@ -3,11 +3,7 @@ import PropTypes from 'prop-types';
|
||||
import styled from 'styled-components';
|
||||
import { Box } from '@strapi/parts/Box';
|
||||
import { KeyboardNavigable } from '@strapi/parts/KeyboardNavigable';
|
||||
import { prefixFileUrlWithBackendUrl, getFileExtension } from '@strapi/helper-plugin';
|
||||
import { ImageAssetCard } from '../AssetCard/ImageAssetCard';
|
||||
import { VideoAssetCard } from '../AssetCard/VideoAssetCard';
|
||||
import { DocAssetCard } from '../AssetCard/DocAssetCard';
|
||||
import { AssetType } from '../../constants';
|
||||
import { AssetCard } from '../AssetCard/AssetCard';
|
||||
|
||||
const GridColSize = {
|
||||
S: 180,
|
||||
@ -27,51 +23,13 @@ export const AssetList = ({ assets, onEditAsset, onSelectAsset, selectedAssets,
|
||||
{assets.map(asset => {
|
||||
const isSelected = selectedAssets.indexOf(asset) > -1;
|
||||
|
||||
if (asset.mime.includes(AssetType.Video)) {
|
||||
return (
|
||||
<VideoAssetCard
|
||||
id={asset.id}
|
||||
key={asset.id}
|
||||
name={asset.name}
|
||||
extension={getFileExtension(asset.ext)}
|
||||
url={prefixFileUrlWithBackendUrl(asset.url)}
|
||||
mime={asset.mime}
|
||||
onEdit={() => onEditAsset(asset)}
|
||||
onSelect={() => onSelectAsset(asset)}
|
||||
selected={isSelected}
|
||||
size={size}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
if (asset.mime.includes(AssetType.Image)) {
|
||||
return (
|
||||
<ImageAssetCard
|
||||
id={asset.id}
|
||||
key={asset.id}
|
||||
name={asset.name}
|
||||
alt={asset.alternativeText || asset.name}
|
||||
extension={getFileExtension(asset.ext)}
|
||||
height={asset.height}
|
||||
width={asset.width}
|
||||
thumbnail={prefixFileUrlWithBackendUrl(asset?.formats?.thumbnail?.url || asset.url)}
|
||||
onEdit={() => onEditAsset(asset)}
|
||||
onSelect={() => onSelectAsset(asset)}
|
||||
selected={isSelected}
|
||||
size={size}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<DocAssetCard
|
||||
id={asset.id}
|
||||
<AssetCard
|
||||
key={asset.id}
|
||||
name={asset.name}
|
||||
extension={getFileExtension(asset.ext)}
|
||||
asset={asset}
|
||||
isSelected={isSelected}
|
||||
onEdit={() => onEditAsset(asset)}
|
||||
onSelect={() => onSelectAsset(asset)}
|
||||
selected={isSelected}
|
||||
size={size}
|
||||
/>
|
||||
);
|
||||
|
||||
@ -51,10 +51,14 @@ export const BrowseStep = ({
|
||||
);
|
||||
};
|
||||
|
||||
BrowseStep.defaultProps = {
|
||||
onSelectAllAsset: undefined,
|
||||
};
|
||||
|
||||
BrowseStep.propTypes = {
|
||||
assets: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
|
||||
onEditAsset: PropTypes.func.isRequired,
|
||||
onSelectAsset: PropTypes.func.isRequired,
|
||||
onSelectAllAsset: PropTypes.func.isRequired,
|
||||
onSelectAllAsset: PropTypes.func,
|
||||
selectedAssets: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
|
||||
};
|
||||
|
||||
@ -22,17 +22,22 @@ import { BrowseStep } from './BrowseStep';
|
||||
import { useMediaLibraryPermissions } from '../../../hooks/useMediaLibraryPermissions';
|
||||
import { useAssets } from '../../../hooks/useAssets';
|
||||
|
||||
// TODO: this will move when "multiple" will be used for real
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
export const AssetDialog = ({ onClose, multiple }) => {
|
||||
export const AssetDialog = ({ onClose, onValidate, multiple }) => {
|
||||
const { formatMessage } = useIntl();
|
||||
const [selectedAssets, { selectOne, selectAll }] = useSelectionState('id', []);
|
||||
|
||||
const [selectedAssets, { selectOne, selectAll, selectOnly }] = useSelectionState('id', []);
|
||||
const { canRead, canCreate, isLoading: isLoadingPermissions } = useMediaLibraryPermissions();
|
||||
const { data, isLoading, error } = useAssets({
|
||||
skipWhen: !canRead,
|
||||
});
|
||||
|
||||
const handleSelectAsset = asset => {
|
||||
if (multiple) {
|
||||
selectOne(asset);
|
||||
} else {
|
||||
selectOnly(asset);
|
||||
}
|
||||
};
|
||||
|
||||
const loading = isLoadingPermissions || isLoading;
|
||||
const assets = data?.results;
|
||||
|
||||
@ -116,16 +121,16 @@ export const AssetDialog = ({ onClose, multiple }) => {
|
||||
<ModalBody>
|
||||
<BrowseStep
|
||||
assets={assets}
|
||||
onSelectAsset={selectOne}
|
||||
onSelectAsset={handleSelectAsset}
|
||||
selectedAssets={selectedAssets}
|
||||
onSelectAllAsset={() => selectAll(assets)}
|
||||
onSelectAllAsset={multiple ? () => selectAll(assets) : undefined}
|
||||
onEditAsset={() => {}}
|
||||
/>
|
||||
</ModalBody>
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
<ModalBody>
|
||||
<SelectedStep selectedAssets={selectedAssets} onSelectAsset={selectOne} />
|
||||
<SelectedStep selectedAssets={selectedAssets} onSelectAsset={handleSelectAsset} />
|
||||
</ModalBody>
|
||||
</TabPanel>
|
||||
</TabPanels>
|
||||
@ -140,7 +145,7 @@ export const AssetDialog = ({ onClose, multiple }) => {
|
||||
}
|
||||
endActions={
|
||||
<>
|
||||
<Button onClick={() => {}}>
|
||||
<Button onClick={() => onValidate(selectedAssets)}>
|
||||
{formatMessage({ id: 'form.button.finish', defaultMessage: 'Finish' })}
|
||||
</Button>
|
||||
</>
|
||||
@ -157,4 +162,5 @@ AssetDialog.defaultProps = {
|
||||
AssetDialog.propTypes = {
|
||||
multiple: PropTypes.bool,
|
||||
onClose: PropTypes.func.isRequired,
|
||||
onValidate: PropTypes.func.isRequired,
|
||||
};
|
||||
|
||||
@ -0,0 +1,49 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { prefixFileUrlWithBackendUrl } from '@strapi/helper-plugin';
|
||||
import IconDocumentation from '@strapi/icons/IconDocumentation';
|
||||
import { Icon } from '@strapi/parts/Icon';
|
||||
import { Box } from '@strapi/parts/Box';
|
||||
import { AssetType } from '../../constants';
|
||||
import { VideoPreview } from '../AssetCard/VideoPreview';
|
||||
|
||||
export const CarouselAsset = ({ asset }) => {
|
||||
if (asset.mime.includes(AssetType.Video)) {
|
||||
return <VideoPreview url={prefixFileUrlWithBackendUrl(asset.url)} mime={asset.mime} />;
|
||||
}
|
||||
|
||||
if (asset.mime.includes(AssetType.Image)) {
|
||||
return (
|
||||
<Box
|
||||
as="img"
|
||||
maxHeight="100%"
|
||||
maxWidth="100%"
|
||||
src={prefixFileUrlWithBackendUrl(asset?.formats?.thumbnail?.url || asset.url)}
|
||||
alt={asset.alternativeText || asset.name}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return <Icon as={IconDocumentation} />;
|
||||
};
|
||||
|
||||
CarouselAsset.propTypes = {
|
||||
asset: PropTypes.shape({
|
||||
id: PropTypes.number,
|
||||
height: PropTypes.number,
|
||||
width: PropTypes.number,
|
||||
size: PropTypes.number,
|
||||
createdAt: PropTypes.string,
|
||||
ext: PropTypes.string,
|
||||
mime: PropTypes.string,
|
||||
name: PropTypes.string,
|
||||
url: PropTypes.string,
|
||||
alternativeText: PropTypes.string,
|
||||
caption: PropTypes.string,
|
||||
formats: PropTypes.shape({
|
||||
thumbnail: PropTypes.shape({
|
||||
url: PropTypes.string,
|
||||
}),
|
||||
}),
|
||||
}).isRequired,
|
||||
};
|
||||
@ -5,18 +5,25 @@ import { Carousel, CarouselSlide } from '@strapi/parts/Carousel';
|
||||
import getTrad from '../../utils/getTrad';
|
||||
import { EmptyStateAsset } from './EmptyStateAsset';
|
||||
import { AssetDialog } from './AssetDialog';
|
||||
import { CarouselAsset } from './CarouselAsset';
|
||||
|
||||
export const MediaLibraryInput = ({ intlLabel, description, disabled, error, multiple }) => {
|
||||
const [selectedIndex, setSelectedIndex] = useState(0);
|
||||
const [selectedAssets, setSelectedAssets] = useState([]);
|
||||
const [isAssetDialogOpen, setIsAssetDialogOpen] = useState(false);
|
||||
const { formatMessage } = useIntl();
|
||||
|
||||
const handleNext = () => {
|
||||
setSelectedIndex(current => (current < 2 ? current + 1 : 0));
|
||||
setSelectedIndex(current => (current < selectedAssets.length - 1 ? current + 1 : 0));
|
||||
};
|
||||
|
||||
const handlePrevious = () => {
|
||||
setSelectedIndex(current => (current > 0 ? current - 1 : 2));
|
||||
setSelectedIndex(current => (current > 0 ? current - 1 : selectedAssets.length - 1));
|
||||
};
|
||||
|
||||
const handleValidation = nextSelectedAssets => {
|
||||
setSelectedAssets(nextSelectedAssets);
|
||||
setIsAssetDialogOpen(false);
|
||||
};
|
||||
|
||||
const hint = description
|
||||
@ -47,17 +54,38 @@ export const MediaLibraryInput = ({ intlLabel, description, disabled, error, mul
|
||||
hint={hint}
|
||||
error={errorMessage}
|
||||
>
|
||||
<CarouselSlide
|
||||
label={formatMessage(
|
||||
{ id: getTrad('mediaLibraryInput.slideCount'), defaultMessage: '{n} of {m} slides' },
|
||||
{ n: 1, m: 1 }
|
||||
)}
|
||||
>
|
||||
<EmptyStateAsset disabled={disabled} onClick={() => setIsAssetDialogOpen(true)} />
|
||||
</CarouselSlide>
|
||||
{selectedAssets.length === 0 ? (
|
||||
<CarouselSlide
|
||||
label={formatMessage(
|
||||
{ id: getTrad('mediaLibraryInput.slideCount'), defaultMessage: '{n} of {m} slides' },
|
||||
{ n: 1, m: 1 }
|
||||
)}
|
||||
>
|
||||
<EmptyStateAsset disabled={disabled} onClick={() => setIsAssetDialogOpen(true)} />
|
||||
</CarouselSlide>
|
||||
) : (
|
||||
selectedAssets.map((asset, index) => (
|
||||
<CarouselSlide
|
||||
key={asset.id}
|
||||
label={formatMessage(
|
||||
{
|
||||
id: getTrad('mediaLibraryInput.slideCount'),
|
||||
defaultMessage: '{n} of {m} slides',
|
||||
},
|
||||
{ n: index + 1, m: selectedAssets.length }
|
||||
)}
|
||||
>
|
||||
<CarouselAsset asset={asset} />
|
||||
</CarouselSlide>
|
||||
))
|
||||
)}
|
||||
</Carousel>
|
||||
{isAssetDialogOpen && (
|
||||
<AssetDialog onClose={() => setIsAssetDialogOpen(false)} multiple={multiple} />
|
||||
<AssetDialog
|
||||
onClose={() => setIsAssetDialogOpen(false)}
|
||||
onValidate={handleValidation}
|
||||
multiple={multiple}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
|
||||
@ -8,9 +8,7 @@ import { Flex } from '@strapi/parts/Flex';
|
||||
import { Stack } from '@strapi/parts/Stack';
|
||||
import { Grid, GridItem } from '@strapi/parts/Grid';
|
||||
import { KeyboardNavigable } from '@strapi/parts/KeyboardNavigable';
|
||||
import { DocAssetCard } from '../../AssetCard/DocAssetCard';
|
||||
import { ImageAssetCard } from '../../AssetCard/ImageAssetCard';
|
||||
import { VideoAssetCard } from '../../AssetCard/VideoAssetCard';
|
||||
import { AssetCard } from '../../AssetCard/AssetCard';
|
||||
import { UploadingAssetCard } from '../../AssetCard/UploadingAssetCard';
|
||||
import { getTrad } from '../../../utils';
|
||||
import { AssetType, AssetSource } from '../../../constants';
|
||||
@ -117,41 +115,9 @@ export const PendingAssetStep = ({
|
||||
);
|
||||
}
|
||||
|
||||
if (asset.type === AssetType.Image) {
|
||||
return (
|
||||
<GridItem col={4} key={assetKey}>
|
||||
<ImageAssetCard
|
||||
id={assetKey}
|
||||
name={asset.name}
|
||||
extension={asset.ext}
|
||||
height={asset.height}
|
||||
width={asset.width}
|
||||
thumbnail={asset.url}
|
||||
size="S"
|
||||
alt={asset.name}
|
||||
/>
|
||||
</GridItem>
|
||||
);
|
||||
}
|
||||
|
||||
if (asset.type === AssetType.Video) {
|
||||
return (
|
||||
<GridItem col={4} key={assetKey}>
|
||||
<VideoAssetCard
|
||||
id={assetKey}
|
||||
name={asset.name}
|
||||
extension={asset.ext}
|
||||
url={asset.url}
|
||||
mime={asset.mime}
|
||||
size="S"
|
||||
/>
|
||||
</GridItem>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<GridItem col={4} key={assetKey}>
|
||||
<DocAssetCard name={asset.name} extension={asset.ext} size="S" />
|
||||
<AssetCard asset={asset} size="S" key={assetKey} />
|
||||
</GridItem>
|
||||
);
|
||||
})}
|
||||
|
||||
@ -46,12 +46,6 @@ describe('PendingAssetStep', () => {
|
||||
ext: 'mp4',
|
||||
mime: 'video/mp4',
|
||||
},
|
||||
{
|
||||
source: 'url',
|
||||
type: 'unknown',
|
||||
url: 'https://www.w3schools.com/html/mov_bbb.mp4',
|
||||
ext: 'mp4',
|
||||
},
|
||||
];
|
||||
|
||||
const { container } = renderTL(
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
.c50 {
|
||||
.c55 {
|
||||
border: 0;
|
||||
-webkit-clip: rect(0 0 0 0);
|
||||
clip: rect(0 0 0 0);
|
||||
@ -46,7 +46,7 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.c47 {
|
||||
.c52 {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
@ -162,11 +162,11 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
border-bottom: 1px solid #eaeaef;
|
||||
}
|
||||
|
||||
.c46 {
|
||||
.c51 {
|
||||
border-top: 1px solid #eaeaef;
|
||||
}
|
||||
|
||||
.c48 > * + * {
|
||||
.c53 > * + * {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
@ -331,7 +331,7 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
background: #4945ff;
|
||||
}
|
||||
|
||||
.c49 {
|
||||
.c54 {
|
||||
-webkit-align-items: center;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
@ -343,7 +343,7 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.c49 .sc-fFYUIl {
|
||||
.c54 .sc-fFYUIl {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
@ -354,52 +354,52 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.c49 .c16 {
|
||||
.c54 .c16 {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.c49[aria-disabled='true'] {
|
||||
.c54[aria-disabled='true'] {
|
||||
border: 1px solid #dcdce4;
|
||||
background: #eaeaef;
|
||||
}
|
||||
|
||||
.c49[aria-disabled='true'] .c16 {
|
||||
.c54[aria-disabled='true'] .c16 {
|
||||
color: #666687;
|
||||
}
|
||||
|
||||
.c49[aria-disabled='true'] svg > g,
|
||||
.c49[aria-disabled='true'] svg path {
|
||||
.c54[aria-disabled='true'] svg > g,
|
||||
.c54[aria-disabled='true'] svg path {
|
||||
fill: #666687;
|
||||
}
|
||||
|
||||
.c49[aria-disabled='true']:active {
|
||||
.c54[aria-disabled='true']:active {
|
||||
border: 1px solid #dcdce4;
|
||||
background: #eaeaef;
|
||||
}
|
||||
|
||||
.c49[aria-disabled='true']:active .c16 {
|
||||
.c54[aria-disabled='true']:active .c16 {
|
||||
color: #666687;
|
||||
}
|
||||
|
||||
.c49[aria-disabled='true']:active svg > g,
|
||||
.c49[aria-disabled='true']:active svg path {
|
||||
.c54[aria-disabled='true']:active svg > g,
|
||||
.c54[aria-disabled='true']:active svg path {
|
||||
fill: #666687;
|
||||
}
|
||||
|
||||
.c49:hover {
|
||||
.c54:hover {
|
||||
background-color: #f6f6f9;
|
||||
}
|
||||
|
||||
.c49:active {
|
||||
.c54:active {
|
||||
background-color: #eaeaef;
|
||||
}
|
||||
|
||||
.c49 .c16 {
|
||||
.c54 .c16 {
|
||||
color: #32324d;
|
||||
}
|
||||
|
||||
.c49 svg > g,
|
||||
.c49 svg path {
|
||||
.c54 svg > g,
|
||||
.c54 svg path {
|
||||
fill: #32324d;
|
||||
}
|
||||
|
||||
@ -469,33 +469,143 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
grid-column: span 4;
|
||||
}
|
||||
|
||||
.c26 {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
padding: 8px;
|
||||
border-radius: 4px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #dcdce4;
|
||||
position: relative;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c26 svg {
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.c26 svg > g,
|
||||
.c26 svg path {
|
||||
fill: #ffffff;
|
||||
}
|
||||
|
||||
.c26[aria-disabled='true'] {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.c26:after {
|
||||
-webkit-transition-property: all;
|
||||
transition-property: all;
|
||||
-webkit-transition-duration: 0.2s;
|
||||
transition-duration: 0.2s;
|
||||
border-radius: 8px;
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
bottom: -4px;
|
||||
left: -4px;
|
||||
right: -4px;
|
||||
border: 2px solid transparent;
|
||||
}
|
||||
|
||||
.c26:focus-visible {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c26:focus-visible:after {
|
||||
border-radius: 8px;
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
bottom: -5px;
|
||||
left: -5px;
|
||||
right: -5px;
|
||||
border: 2px solid #4945ff;
|
||||
}
|
||||
|
||||
.c27 {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
height: 2rem;
|
||||
width: 2rem;
|
||||
}
|
||||
|
||||
.c27 svg > g,
|
||||
.c27 svg path {
|
||||
fill: #8e8ea9;
|
||||
}
|
||||
|
||||
.c27:hover svg > g,
|
||||
.c27:hover svg path {
|
||||
fill: #666687;
|
||||
}
|
||||
|
||||
.c27:active svg > g,
|
||||
.c27:active svg path {
|
||||
fill: #a5a5ba;
|
||||
}
|
||||
|
||||
.c27[aria-disabled='true'] {
|
||||
background-color: #eaeaef;
|
||||
}
|
||||
|
||||
.c27[aria-disabled='true'] svg path {
|
||||
fill: #666687;
|
||||
}
|
||||
|
||||
.c20 {
|
||||
background: #ffffff;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0px 1px 4px rgba(33,33,52,0.1);
|
||||
}
|
||||
|
||||
.c25 {
|
||||
.c30 {
|
||||
padding-top: 8px;
|
||||
padding-right: 12px;
|
||||
padding-bottom: 8px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.c32 {
|
||||
.c37 {
|
||||
background: #f6f6f9;
|
||||
color: #666687;
|
||||
padding: 4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.c42 {
|
||||
.c47 {
|
||||
background: #32324d;
|
||||
color: #ffffff;
|
||||
padding: 4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.c23 {
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
left: 12px;
|
||||
}
|
||||
|
||||
.c25 {
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
right: 12px;
|
||||
}
|
||||
|
||||
.c21 {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
@ -514,7 +624,7 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.c26 {
|
||||
.c31 {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
@ -528,7 +638,7 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.c38 {
|
||||
.c43 {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
@ -542,14 +652,14 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.c24 {
|
||||
.c29 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
max-height: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.c23 {
|
||||
.c28 {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
@ -563,62 +673,129 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
background: repeating-conic-gradient(#f6f6f9 0% 25%,transparent 0% 50%) 50% / 20px 20px;
|
||||
}
|
||||
|
||||
.c28 {
|
||||
.c33 {
|
||||
font-weight: 500;
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.33;
|
||||
color: #32324d;
|
||||
}
|
||||
|
||||
.c29 {
|
||||
.c34 {
|
||||
font-weight: 400;
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.33;
|
||||
color: #666687;
|
||||
}
|
||||
|
||||
.c35 {
|
||||
.c40 {
|
||||
font-weight: 400;
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.43;
|
||||
color: #32324d;
|
||||
}
|
||||
|
||||
.c44 {
|
||||
.c49 {
|
||||
font-weight: 400;
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.33;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.c36 {
|
||||
.c41 {
|
||||
font-weight: 600;
|
||||
line-height: 1.14;
|
||||
}
|
||||
|
||||
.c37 {
|
||||
.c42 {
|
||||
font-weight: 600;
|
||||
font-size: 0.6875rem;
|
||||
line-height: 1.45;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.c33 {
|
||||
.c38 {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.c31 {
|
||||
.c36 {
|
||||
margin-left: auto;
|
||||
-webkit-flex-shrink: 0;
|
||||
-ms-flex-negative: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.c34 {
|
||||
.c39 {
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
.c27 {
|
||||
.c24 {
|
||||
margin: 0;
|
||||
height: 18px;
|
||||
min-width: 18px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #c0c0cf;
|
||||
-webkit-appearance: none;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.c24:checked {
|
||||
background-color: #4945ff;
|
||||
border: 1px solid #4945ff;
|
||||
}
|
||||
|
||||
.c24:checked:after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: relative;
|
||||
background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGgKICAgIGQ9Ik04LjU1MzIzIDAuMzk2OTczQzguNjMxMzUgMC4zMTYzNTUgOC43NjA1MSAwLjMxNTgxMSA4LjgzOTMxIDAuMzk1NzY4TDkuODYyNTYgMS40MzQwN0M5LjkzODkzIDEuNTExNTcgOS45MzkzNSAxLjYzNTkgOS44NjM0OSAxLjcxMzlMNC4wNjQwMSA3LjY3NzI0QzMuOTg1OSA3Ljc1NzU1IDMuODU3MDcgNy43NTgwNSAzLjc3ODM0IDcuNjc4MzRMMC4xMzg2NiAzLjk5MzMzQzAuMDYxNzc5OCAzLjkxNTQ5IDAuMDYxNzEwMiAzLjc5MDMyIDAuMTM4NTA0IDMuNzEyNEwxLjE2MjEzIDIuNjczNzJDMS4yNDAzOCAyLjU5NDMyIDEuMzY4NDMgMi41OTQyMiAxLjQ0NjggMi42NzM0OEwzLjkyMTc0IDUuMTc2NDdMOC41NTMyMyAwLjM5Njk3M1oiCiAgICBmaWxsPSJ3aGl0ZSIKICAvPgo8L3N2Zz4=) no-repeat no-repeat center center;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
-webkit-transform: translateX(-50%) translateY(-50%);
|
||||
-ms-transform: translateX(-50%) translateY(-50%);
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
}
|
||||
|
||||
.c24:checked:disabled:after {
|
||||
background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGgKICAgIGQ9Ik04LjU1MzIzIDAuMzk2OTczQzguNjMxMzUgMC4zMTYzNTUgOC43NjA1MSAwLjMxNTgxMSA4LjgzOTMxIDAuMzk1NzY4TDkuODYyNTYgMS40MzQwN0M5LjkzODkzIDEuNTExNTcgOS45MzkzNSAxLjYzNTkgOS44NjM0OSAxLjcxMzlMNC4wNjQwMSA3LjY3NzI0QzMuOTg1OSA3Ljc1NzU1IDMuODU3MDcgNy43NTgwNSAzLjc3ODM0IDcuNjc4MzRMMC4xMzg2NiAzLjk5MzMzQzAuMDYxNzc5OCAzLjkxNTQ5IDAuMDYxNzEwMiAzLjc5MDMyIDAuMTM4NTA0IDMuNzEyNEwxLjE2MjEzIDIuNjczNzJDMS4yNDAzOCAyLjU5NDMyIDEuMzY4NDMgMi41OTQyMiAxLjQ0NjggMi42NzM0OEwzLjkyMTc0IDUuMTc2NDdMOC41NTMyMyAwLjM5Njk3M1oiCiAgICBmaWxsPSIjOEU4RUE5IgogIC8+Cjwvc3ZnPg==) no-repeat no-repeat center center;
|
||||
}
|
||||
|
||||
.c24:disabled {
|
||||
background-color: #dcdce4;
|
||||
border: 1px solid #c0c0cf;
|
||||
}
|
||||
|
||||
.c24:indeterminate {
|
||||
background-color: #4945ff;
|
||||
border: 1px solid #4945ff;
|
||||
}
|
||||
|
||||
.c24:indeterminate:after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: relative;
|
||||
color: white;
|
||||
height: 2px;
|
||||
width: 10px;
|
||||
background-color: #ffffff;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
-webkit-transform: translateX(-50%) translateY(-50%);
|
||||
-ms-transform: translateX(-50%) translateY(-50%);
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
}
|
||||
|
||||
.c24:indeterminate:disabled {
|
||||
background-color: #dcdce4;
|
||||
border: 1px solid #c0c0cf;
|
||||
}
|
||||
|
||||
.c24:indeterminate:disabled:after {
|
||||
background-color: #8e8ea9;
|
||||
}
|
||||
|
||||
.c32 {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
@ -627,35 +804,35 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
border-bottom: 1px solid #eaeaef;
|
||||
}
|
||||
|
||||
.c43 {
|
||||
.c48 {
|
||||
position: absolute;
|
||||
bottom: 4px;
|
||||
right: 4px;
|
||||
}
|
||||
|
||||
.c40 {
|
||||
.c35 {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.c39 svg {
|
||||
font-size: 3rem;
|
||||
}
|
||||
|
||||
.c30 {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.c41 canvas,
|
||||
.c41 video {
|
||||
.c46 canvas,
|
||||
.c46 video {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
max-height: 5.5rem;
|
||||
}
|
||||
|
||||
.c50 {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.c45 {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.c44 svg {
|
||||
font-size: 3rem;
|
||||
}
|
||||
|
||||
@media (max-width:68.75rem) {
|
||||
.c19 {
|
||||
grid-column: span;
|
||||
@ -760,45 +937,82 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
>
|
||||
<div
|
||||
class="c23"
|
||||
>
|
||||
<input
|
||||
aria-labelledby="card-1-title"
|
||||
class="c24"
|
||||
type="checkbox"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="c25"
|
||||
>
|
||||
<span>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-labelledby="tooltip-1"
|
||||
class="c26 c27"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<svg
|
||||
fill="none"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
clip-rule="evenodd"
|
||||
d="M23.604 3.514c.528.528.528 1.36 0 1.887l-2.622 2.607-4.99-4.99L18.6.396a1.322 1.322 0 011.887 0l3.118 3.118zM0 24v-4.99l14.2-14.2 4.99 4.99L4.99 24H0z"
|
||||
fill="#212134"
|
||||
fill-rule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="c28"
|
||||
>
|
||||
<img
|
||||
aria-hidden="true"
|
||||
class="c24"
|
||||
class="c29"
|
||||
src="http://localhost:5000/CPAM.jpg"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c25"
|
||||
class="c30"
|
||||
>
|
||||
<div
|
||||
class="c26"
|
||||
class="c31"
|
||||
>
|
||||
<div
|
||||
class="c27"
|
||||
class="c32"
|
||||
>
|
||||
<h2
|
||||
class="c28"
|
||||
class="c33"
|
||||
id="card-1-title"
|
||||
/>
|
||||
<div
|
||||
class="c29"
|
||||
class="c34"
|
||||
>
|
||||
<span
|
||||
class="c30"
|
||||
class="c35"
|
||||
>
|
||||
jpg
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c31"
|
||||
class="c36"
|
||||
>
|
||||
<div
|
||||
class="c32 c33 c34"
|
||||
class="c37 c38 c39"
|
||||
>
|
||||
<span
|
||||
class="c35 c36 c37"
|
||||
class="c40 c41 c42"
|
||||
>
|
||||
Image
|
||||
</span>
|
||||
@ -825,12 +1039,49 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
>
|
||||
<div
|
||||
class="c23"
|
||||
>
|
||||
<input
|
||||
aria-labelledby="card-2-title"
|
||||
class="c24"
|
||||
type="checkbox"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="c25"
|
||||
>
|
||||
<span>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-labelledby="tooltip-3"
|
||||
class="c26 c27"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<svg
|
||||
fill="none"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
clip-rule="evenodd"
|
||||
d="M23.604 3.514c.528.528.528 1.36 0 1.887l-2.622 2.607-4.99-4.99L18.6.396a1.322 1.322 0 011.887 0l3.118 3.118zM0 24v-4.99l14.2-14.2 4.99 4.99L4.99 24H0z"
|
||||
fill="#212134"
|
||||
fill-rule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="c28"
|
||||
>
|
||||
<div
|
||||
class="c38"
|
||||
class="c43"
|
||||
>
|
||||
<span
|
||||
class="c39"
|
||||
class="c44"
|
||||
>
|
||||
<svg
|
||||
fill="none"
|
||||
@ -849,36 +1100,36 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c25"
|
||||
class="c30"
|
||||
>
|
||||
<div
|
||||
class="c26"
|
||||
class="c31"
|
||||
>
|
||||
<div
|
||||
class="c27"
|
||||
class="c32"
|
||||
>
|
||||
<h2
|
||||
class="c28"
|
||||
class="c33"
|
||||
id="card-2-title"
|
||||
/>
|
||||
<div
|
||||
class="c29"
|
||||
class="c34"
|
||||
>
|
||||
<span
|
||||
class="c40"
|
||||
class="c45"
|
||||
>
|
||||
pdf
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c31"
|
||||
class="c36"
|
||||
>
|
||||
<div
|
||||
class="c32 c33 c34"
|
||||
class="c37 c38 c39"
|
||||
>
|
||||
<span
|
||||
class="c35 c36 c37"
|
||||
class="c40 c41 c42"
|
||||
>
|
||||
Doc
|
||||
</span>
|
||||
@ -905,12 +1156,49 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
>
|
||||
<div
|
||||
class="c23"
|
||||
>
|
||||
<input
|
||||
aria-labelledby="card-3-title"
|
||||
class="c24"
|
||||
type="checkbox"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="c25"
|
||||
>
|
||||
<span>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-labelledby="tooltip-5"
|
||||
class="c26 c27"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<svg
|
||||
fill="none"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
clip-rule="evenodd"
|
||||
d="M23.604 3.514c.528.528.528 1.36 0 1.887l-2.622 2.607-4.99-4.99L18.6.396a1.322 1.322 0 011.887 0l3.118 3.118zM0 24v-4.99l14.2-14.2 4.99 4.99L4.99 24H0z"
|
||||
fill="#212134"
|
||||
fill-rule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="c28"
|
||||
>
|
||||
<div
|
||||
class="c38"
|
||||
class="c43"
|
||||
>
|
||||
<div
|
||||
class="c41"
|
||||
class="c46"
|
||||
>
|
||||
<video
|
||||
crossorigin="anonymous"
|
||||
@ -924,46 +1212,46 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<time
|
||||
class="c42 c43"
|
||||
class="c47 c48"
|
||||
>
|
||||
<span
|
||||
class="c44"
|
||||
class="c49"
|
||||
>
|
||||
...
|
||||
</span>
|
||||
</time>
|
||||
</div>
|
||||
<div
|
||||
class="c25"
|
||||
class="c30"
|
||||
>
|
||||
<div
|
||||
class="c26"
|
||||
class="c31"
|
||||
>
|
||||
<div
|
||||
class="c27"
|
||||
class="c32"
|
||||
>
|
||||
<h2
|
||||
class="c28"
|
||||
class="c33"
|
||||
id="card-3-title"
|
||||
/>
|
||||
<div
|
||||
class="c29"
|
||||
class="c34"
|
||||
>
|
||||
<span
|
||||
class="c45"
|
||||
class="c50"
|
||||
>
|
||||
mp4
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c31"
|
||||
class="c36"
|
||||
>
|
||||
<div
|
||||
class="c32 c33 c34"
|
||||
class="c37 c38 c39"
|
||||
>
|
||||
<span
|
||||
class="c35 c36 c37"
|
||||
class="c40 c41 c42"
|
||||
>
|
||||
Video
|
||||
</span>
|
||||
@ -974,102 +1262,22 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c19"
|
||||
>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<article
|
||||
aria-labelledby="card-4-title"
|
||||
class="c20"
|
||||
tabindex="0"
|
||||
>
|
||||
<div
|
||||
class="c21 c22"
|
||||
>
|
||||
<div
|
||||
class="c23"
|
||||
>
|
||||
<div
|
||||
class="c38"
|
||||
>
|
||||
<span
|
||||
class="c39"
|
||||
>
|
||||
<svg
|
||||
fill="none"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M20 22H6.5A3.5 3.5 0 013 18.5V5a3 3 0 013-3h14a1 1 0 011 1v18a1 1 0 01-1 1zm-1-2v-3H6.5a1.5 1.5 0 100 3H19z"
|
||||
fill="#8E8EA9"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c25"
|
||||
>
|
||||
<div
|
||||
class="c26"
|
||||
>
|
||||
<div
|
||||
class="c27"
|
||||
>
|
||||
<h2
|
||||
class="c28"
|
||||
id="card-4-title"
|
||||
/>
|
||||
<div
|
||||
class="c29"
|
||||
>
|
||||
<span
|
||||
class="c40"
|
||||
>
|
||||
mp4
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c31"
|
||||
>
|
||||
<div
|
||||
class="c32 c33 c34"
|
||||
>
|
||||
<span
|
||||
class="c35 c36 c37"
|
||||
>
|
||||
Doc
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c0 c46"
|
||||
class="c0 c51"
|
||||
>
|
||||
<div
|
||||
class="c2"
|
||||
>
|
||||
<div
|
||||
class="c47 c48"
|
||||
class="c52 c53"
|
||||
>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
class="c14 c49"
|
||||
class="c14 c54"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
@ -1078,7 +1286,7 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="c47 c48"
|
||||
class="c52 c53"
|
||||
>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
@ -1096,7 +1304,7 @@ exports[`PendingAssetStep snapshots the component with valid cards 1`] = `
|
||||
</div>
|
||||
</form>
|
||||
<div
|
||||
class="c50"
|
||||
class="c55"
|
||||
>
|
||||
<p
|
||||
aria-live="polite"
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user