diff --git a/.github/actions/check-pr-status/package.json b/.github/actions/check-pr-status/package.json index 99fd76622a..bc31b44ee8 100644 --- a/.github/actions/check-pr-status/package.json +++ b/.github/actions/check-pr-status/package.json @@ -1,6 +1,6 @@ { "name": "check-pr-status", - "version": "4.6.1", + "version": "4.6.2", "main": "dist/index.js", "license": "MIT", "private": true, diff --git a/examples/getstarted/package.json b/examples/getstarted/package.json index 9e41199a7c..12b22f2018 100644 --- a/examples/getstarted/package.json +++ b/examples/getstarted/package.json @@ -1,7 +1,7 @@ { "name": "getstarted", "private": true, - "version": "4.6.1", + "version": "4.6.2", "description": "A Strapi application.", "scripts": { "develop": "strapi develop", @@ -12,16 +12,16 @@ "strapi": "strapi" }, "dependencies": { - "@strapi/plugin-color-picker": "4.6.1", - "@strapi/plugin-documentation": "4.6.1", - "@strapi/plugin-graphql": "4.6.1", - "@strapi/plugin-i18n": "4.6.1", - "@strapi/plugin-sentry": "4.6.1", - "@strapi/plugin-users-permissions": "4.6.1", - "@strapi/provider-email-mailgun": "4.6.1", - "@strapi/provider-upload-aws-s3": "4.6.1", - "@strapi/provider-upload-cloudinary": "4.6.1", - "@strapi/strapi": "4.6.1", + "@strapi/plugin-color-picker": "4.6.2", + "@strapi/plugin-documentation": "4.6.2", + "@strapi/plugin-graphql": "4.6.2", + "@strapi/plugin-i18n": "4.6.2", + "@strapi/plugin-sentry": "4.6.2", + "@strapi/plugin-users-permissions": "4.6.2", + "@strapi/provider-email-mailgun": "4.6.2", + "@strapi/provider-upload-aws-s3": "4.6.2", + "@strapi/provider-upload-cloudinary": "4.6.2", + "@strapi/strapi": "4.6.2", "@vscode/sqlite3": "5.0.8", "better-sqlite3": "8.0.1", "lodash": "4.17.21", diff --git a/examples/kitchensink-ts/package.json b/examples/kitchensink-ts/package.json index b1b906b675..349b9442a2 100644 --- a/examples/kitchensink-ts/package.json +++ b/examples/kitchensink-ts/package.json @@ -1,7 +1,7 @@ { "name": "kitchensink-ts", "private": true, - "version": "4.6.1", + "version": "4.6.2", "description": "A Strapi application", "scripts": { "develop": "strapi develop", @@ -10,9 +10,9 @@ "strapi": "strapi" }, "dependencies": { - "@strapi/plugin-i18n": "4.6.1", - "@strapi/plugin-users-permissions": "4.6.1", - "@strapi/strapi": "4.6.1", + "@strapi/plugin-i18n": "4.6.2", + "@strapi/plugin-users-permissions": "4.6.2", + "@strapi/strapi": "4.6.2", "better-sqlite3": "8.0.1" }, "author": { diff --git a/examples/kitchensink/package.json b/examples/kitchensink/package.json index c7b150cd75..db6c9230ab 100644 --- a/examples/kitchensink/package.json +++ b/examples/kitchensink/package.json @@ -1,7 +1,7 @@ { "name": "kitchensink", "private": true, - "version": "4.6.1", + "version": "4.6.2", "description": "A Strapi application.", "scripts": { "develop": "strapi develop", @@ -12,10 +12,10 @@ "strapi": "strapi" }, "dependencies": { - "@strapi/provider-email-mailgun": "4.6.1", - "@strapi/provider-upload-aws-s3": "4.6.1", - "@strapi/provider-upload-cloudinary": "4.6.1", - "@strapi/strapi": "4.6.1", + "@strapi/provider-email-mailgun": "4.6.2", + "@strapi/provider-upload-aws-s3": "4.6.2", + "@strapi/provider-upload-cloudinary": "4.6.2", + "@strapi/strapi": "4.6.2", "lodash": "4.17.21", "mysql": "2.18.1", "passport-google-oauth2": "0.2.0", diff --git a/lerna.json b/lerna.json index 188b0a282a..b62a511529 100644 --- a/lerna.json +++ b/lerna.json @@ -1,5 +1,5 @@ { - "version": "4.6.1", + "version": "4.6.2", "packages": [ "packages/*", "examples/*" diff --git a/packages/admin-test-utils/package.json b/packages/admin-test-utils/package.json index 34471e549e..b094b3ae12 100644 --- a/packages/admin-test-utils/package.json +++ b/packages/admin-test-utils/package.json @@ -1,6 +1,6 @@ { "name": "@strapi/admin-test-utils", - "version": "4.6.1", + "version": "4.6.2", "private": true, "description": "Test utilities for the Strapi administration panel", "license": "MIT", diff --git a/packages/cli/create-strapi-app/package.json b/packages/cli/create-strapi-app/package.json index d6fd3bda4d..9c399a6dcf 100644 --- a/packages/cli/create-strapi-app/package.json +++ b/packages/cli/create-strapi-app/package.json @@ -1,9 +1,9 @@ { "name": "create-strapi-app", - "version": "4.6.1", + "version": "4.6.2", "description": "Generate a new Strapi application.", "dependencies": { - "@strapi/generate-new": "4.6.1", + "@strapi/generate-new": "4.6.2", "commander": "8.3.0", "inquirer": "8.2.5" }, diff --git a/packages/cli/create-strapi-starter/package.json b/packages/cli/create-strapi-starter/package.json index dd9caa5d0f..48312153ec 100644 --- a/packages/cli/create-strapi-starter/package.json +++ b/packages/cli/create-strapi-starter/package.json @@ -1,6 +1,6 @@ { "name": "create-strapi-starter", - "version": "4.6.1", + "version": "4.6.2", "description": "Generate a new Strapi application.", "keywords": [ "create-strapi-starter", @@ -38,7 +38,7 @@ "test": "echo \"no tests yet\"" }, "dependencies": { - "@strapi/generate-new": "4.6.1", + "@strapi/generate-new": "4.6.2", "chalk": "4.1.1", "ci-info": "3.5.0", "commander": "8.3.0", diff --git a/packages/core/admin/admin/src/pages/HomePage/CloudBox.js b/packages/core/admin/admin/src/pages/HomePage/CloudBox.js new file mode 100644 index 0000000000..c05aada847 --- /dev/null +++ b/packages/core/admin/admin/src/pages/HomePage/CloudBox.js @@ -0,0 +1,83 @@ +import React from 'react'; +import styled from 'styled-components'; +import { useIntl } from 'react-intl'; +import { useTracking, pxToRem } from '@strapi/helper-plugin'; +import { Box, Flex, Typography } from '@strapi/design-system'; +import cloudIconBackgroundImage from './assets/strapi-cloud-background.png'; +import cloudIcon from './assets/strapi-cloud-icon.svg'; +import cloudFlagsImage from './assets/strapi-cloud-flags.svg'; + +const BlockLink = styled.a` + text-decoration: none; +`; + +const CloudCustomWrapper = styled(Box)` + background-image: url(${({ backgroundImage }) => backgroundImage}); +`; + +const CloudIconWrapper = styled(Flex)` + background: rgba(255, 255, 255, 0.3); +`; + +const CloudBox = () => { + const { formatMessage } = useIntl(); + const { trackUsage } = useTracking(); + + return ( + { + trackUsage('didClickOnTryStrapiCloudSection'); + }} + > + + + + {formatMessage({ + + + + + + {formatMessage({ + id: 'app.components.BlockLink.cloud', + defaultMessage: 'Strapi Cloud', + })} + + + + {formatMessage({ + id: 'app.components.BlockLink.cloud.content', + defaultMessage: + 'A fully composable, and collaborative platform to boost your team velocity.', + })} + + + + + + ); +}; + +export default CloudBox; diff --git a/packages/core/admin/admin/src/pages/HomePage/ContentBlocks.js b/packages/core/admin/admin/src/pages/HomePage/ContentBlocks.js index 0a44e61705..17d63fe300 100644 --- a/packages/core/admin/admin/src/pages/HomePage/ContentBlocks.js +++ b/packages/core/admin/admin/src/pages/HomePage/ContentBlocks.js @@ -4,6 +4,7 @@ import { useIntl } from 'react-intl'; import { ContentBox, useTracking } from '@strapi/helper-plugin'; import { Stack } from '@strapi/design-system'; import { InformationSquare, CodeSquare, PlaySquare, FeatherSquare } from '@strapi/icons'; +import CloudBox from './CloudBox'; const BlockLink = styled.a` text-decoration: none; @@ -19,6 +20,7 @@ const ContentBlocks = () => { return ( + \ No newline at end of file diff --git a/packages/core/admin/admin/src/pages/HomePage/assets/strapi-cloud-icon.svg b/packages/core/admin/admin/src/pages/HomePage/assets/strapi-cloud-icon.svg new file mode 100644 index 0000000000..0cea9bf9ce --- /dev/null +++ b/packages/core/admin/admin/src/pages/HomePage/assets/strapi-cloud-icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/core/admin/admin/src/pages/HomePage/tests/index.test.js b/packages/core/admin/admin/src/pages/HomePage/tests/index.test.js index edd897265f..86ae33e056 100644 --- a/packages/core/admin/admin/src/pages/HomePage/tests/index.test.js +++ b/packages/core/admin/admin/src/pages/HomePage/tests/index.test.js @@ -60,6 +60,7 @@ describe('Homepage', () => { }); test.each([ + 'strapi cloud a fully composable, and collaborative platform to boost your team velocity.', 'documentation discover the essential concepts, guides and instructions.', 'code example learn by using ready-made starters for your projects.', 'tutorials follow step-by-step instructions to use and customize strapi.', diff --git a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/FormiTokenContainer/LifeSpanInput.js b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/FormiTokenContainer/LifeSpanInput.js index 16f8e5acff..7d00e3c45e 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/FormiTokenContainer/LifeSpanInput.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/FormiTokenContainer/LifeSpanInput.js @@ -2,8 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { useIntl } from 'react-intl'; import { usePersistentState } from '@strapi/helper-plugin'; -import { Select, Option } from '@strapi/design-system/Select'; -import { Typography } from '@strapi/design-system/Typography'; +import { Select, Option, Typography } from '@strapi/design-system'; import { getDateOfExpiration } from '../../../pages/ApiTokens/EditView/utils'; const LifeSpanInput = ({ token, errors, values, onChange, disabled }) => { diff --git a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/LifeSpanInput/index.js b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/LifeSpanInput/index.js index 31fd84dadf..f8792dfec4 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/LifeSpanInput/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/LifeSpanInput/index.js @@ -1,8 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { useIntl } from 'react-intl'; -import { Select, Option } from '@strapi/design-system/Select'; -import { Typography } from '@strapi/design-system/Typography'; +import { Select, Option, Typography } from '@strapi/design-system'; import { getDateOfExpiration } from '../../../pages/ApiTokens/EditView/utils'; const LifeSpanInput = ({ token, errors, values, onChange, isCreating }) => { diff --git a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Regenerate/index.js b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Regenerate/index.js index 1891c1d5ec..ef3c33c79c 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Regenerate/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Regenerate/index.js @@ -1,8 +1,8 @@ import React, { useState } from 'react'; import PropTypes from 'prop-types'; import { useIntl } from 'react-intl'; -import { Button } from '@strapi/design-system/Button'; -import Refresh from '@strapi/icons/Refresh'; +import { Button } from '@strapi/design-system'; +import { Refresh } from '@strapi/icons'; import { ConfirmDialog } from '@strapi/helper-plugin'; import { useRegenerate } from '../../../../../hooks'; diff --git a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Table/DeleteButton/index.js b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Table/DeleteButton/index.js index 8aac1bc1c5..af1042c249 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Table/DeleteButton/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Table/DeleteButton/index.js @@ -1,20 +1,25 @@ -import React from 'react'; +import React, { useState } from 'react'; import { Trash } from '@strapi/icons'; import { IconButton, Box } from '@strapi/design-system'; -import { stopPropagation, useTracking } from '@strapi/helper-plugin'; +import { useTracking, ConfirmDialog } from '@strapi/helper-plugin'; import { useIntl } from 'react-intl'; import PropTypes from 'prop-types'; const DeleteButton = ({ tokenName, onClickDelete }) => { const { formatMessage } = useIntl(); const { trackUsage } = useTracking(); // TODO: Track different types of tokens + const [showConfirmDialog, setShowConfirmDialog] = useState(false); + const handleClickDelete = () => { + setShowConfirmDialog(false); + trackUsage('willDeleteToken'); + onClickDelete(); + }; return ( - + e.stopPropagation()}> { - trackUsage('willDeleteToken'); - onClickDelete(); + setShowConfirmDialog(true); }} label={formatMessage( { @@ -27,6 +32,11 @@ const DeleteButton = ({ tokenName, onClickDelete }) => { noBorder icon={} /> + setShowConfirmDialog(false)} + onConfirm={handleClickDelete} + isOpen={showConfirmDialog} + /> ); }; diff --git a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Table/DeleteButton/tests/DeleteButton.test.js b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Table/DeleteButton/tests/DeleteButton.test.js new file mode 100644 index 0000000000..d7f4c53868 --- /dev/null +++ b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Table/DeleteButton/tests/DeleteButton.test.js @@ -0,0 +1,61 @@ +import React from 'react'; +import { ThemeProvider, lightTheme } from '@strapi/design-system'; +import { act, fireEvent, render } from '@testing-library/react'; +import { IntlProvider } from 'react-intl'; +import { NotificationsProvider } from '@strapi/helper-plugin'; + +import DeleteButton from '../index'; + +jest.mock('@strapi/helper-plugin', () => ({ + ...jest.requireActual('@strapi/helper-plugin'), + useTracking: jest.fn(() => ({ trackUsage: jest.fn() })), +})); + +function ComponentToTest(props) { + return ( + + + {}}> + {}} {...props} /> + + + + ); +} + +const setup = (props = { onClickDelete: jest.fn() }) => { + return render(); +}; + +describe('DeleteButton', () => { + afterEach(() => { + jest.clearAllMocks(); + }); + it('show confirmation delete dialog when the delete button is clicked', () => { + const { queryByText, getByRole } = setup(); + fireEvent.click(getByRole('button', { name: 'Delete test' })); + + expect(queryByText('Are you sure you want to delete this?')).toBeInTheDocument(); + }); + + it('closes the modal when you click on Cancel button', () => { + const { queryByText, getByText, getByRole } = setup(); + fireEvent.click(getByRole('button', { name: 'Delete test' })); + + act(() => { + fireEvent.click(getByText('Cancel')); + }); + + expect(queryByText('Are you sure you want to delete this?')).not.toBeInTheDocument(); + }); + + it('trigger the onClickDelete function when you click on the Confirm button', () => { + const spy = jest.fn(); + const { getByRole, getByText } = setup({ onClickDelete: spy }); + + fireEvent.click(getByRole('button', { name: 'Delete test' })); + fireEvent.click(getByText('Confirm')); + + expect(spy).toBeCalledTimes(1); + }); +}); diff --git a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Table/index.js b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Table/index.js index 42004f367f..7504aaabd6 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Table/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/Table/index.js @@ -1,9 +1,7 @@ import React from 'react'; import { useHistory } from 'react-router-dom'; import PropTypes from 'prop-types'; -import { Typography } from '@strapi/design-system/Typography'; -import { Tbody, Tr, Td } from '@strapi/design-system/Table'; -import { Flex } from '@strapi/design-system/Flex'; +import { Typography, Flex, Tbody, Tr, Td } from '@strapi/design-system'; import { RelativeTime, onRowClick, diff --git a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/TokenDescription/index.js b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/TokenDescription/index.js index 8f01152212..d420d70715 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/TokenDescription/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/TokenDescription/index.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { useIntl } from 'react-intl'; -import { Textarea } from '@strapi/design-system/Textarea'; +import { Textarea } from '@strapi/design-system'; const TokenDescription = ({ errors, values, onChange, canEditInputs }) => { const { formatMessage } = useIntl(); diff --git a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/TokenName/index.js b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/TokenName/index.js index 432af30fb6..47cc2b8f6a 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/TokenName/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/TokenName/index.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { useIntl } from 'react-intl'; -import { TextInput } from '@strapi/design-system/TextInput'; +import { TextInput } from '@strapi/design-system'; const TokenName = ({ errors, values, onChange, canEditInputs }) => { const { formatMessage } = useIntl(); diff --git a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/TokenTypeSelect/index.js b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/TokenTypeSelect/index.js index 2e44b4a46f..8a6d844fc9 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/TokenTypeSelect/index.js +++ b/packages/core/admin/admin/src/pages/SettingsPage/components/Tokens/TokenTypeSelect/index.js @@ -2,7 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { useIntl } from 'react-intl'; -import { Select, Option } from '@strapi/design-system/Select'; +import { Select, Option } from '@strapi/design-system'; const TokenTypeSelect = ({ errors, values, onChange, canEditInputs, options, label }) => { const { formatMessage } = useIntl(); diff --git a/packages/core/admin/admin/src/pages/SettingsPage/pages/ApiTokens/EditView/tests/__snapshots__/index.test.js.snap b/packages/core/admin/admin/src/pages/SettingsPage/pages/ApiTokens/EditView/tests/__snapshots__/index.test.js.snap index 71244fe533..73aaa18e0d 100644 --- a/packages/core/admin/admin/src/pages/SettingsPage/pages/ApiTokens/EditView/tests/__snapshots__/index.test.js.snap +++ b/packages/core/admin/admin/src/pages/SettingsPage/pages/ApiTokens/EditView/tests/__snapshots__/index.test.js.snap @@ -15,26 +15,48 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot color: #32324d; } -.c25 { +.c24 { font-weight: 500; font-size: 1rem; line-height: 1.25; color: #32324d; } -.c53 { +.c28 { + font-size: 0.875rem; + line-height: 1.43; + color: #d02b20; +} + +.c39 { + font-size: 0.875rem; + line-height: 1.43; + display: block; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + color: #666687; +} + +.c43 { + font-size: 0.75rem; + line-height: 1.33; + color: #666687; +} + +.c49 { font-size: 0.875rem; line-height: 1.43; color: #666687; } -.c64 { +.c60 { font-size: 0.75rem; line-height: 1.33; color: #4945ff; } -.c65 { +.c61 { font-weight: 500; font-size: 1rem; line-height: 1.25; @@ -61,6 +83,11 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot padding-right: 8px; } +.c19 { + padding-right: 56px; + padding-left: 56px; +} + .c22 { background: #ffffff; padding-top: 24px; @@ -71,25 +98,34 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot box-shadow: 0px 1px 4px rgba(33,33,52,0.1); } -.c48 { +.c38 { + padding-right: 16px; + padding-left: 16px; +} + +.c40 { + padding-left: 12px; +} + +.c44 { background: #ffffff; border-radius: 4px; box-shadow: 0px 1px 4px rgba(33,33,52,0.1); } -.c51 { +.c47 { padding-top: 24px; padding-right: 32px; padding-bottom: 24px; padding-left: 32px; } -.c54 { +.c50 { background: #ffffff; padding: 16px; } -.c73 { +.c69 { background: #eaeaef; padding-top: 24px; padding-right: 32px; @@ -97,11 +133,11 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot padding-left: 32px; } -.c55 { +.c51 { border-radius: 4px; } -.c57 { +.c53 { background: #f6f6f9; padding-top: 24px; padding-right: 24px; @@ -109,21 +145,21 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot padding-left: 24px; } -.c59 { +.c55 { max-width: 100%; -webkit-flex: 1; -ms-flex: 1; flex: 1; } -.c61 { +.c57 { min-width: 0; -webkit-flex: 1; -ms-flex: 1; flex: 1; } -.c66 { +.c62 { background: #dcdce4; border-radius: 50%; width: 2rem; @@ -134,12 +170,12 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot cursor: pointer; } -.c68 { +.c64 { color: #666687; width: 0.6875rem; } -.c71 { +.c67 { background: #ffffff; padding-top: 24px; padding-right: 24px; @@ -179,7 +215,7 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot flex-direction: row; } -.c23 { +.c20 { -webkit-align-items: stretch; -webkit-box-align: stretch; -ms-flex-align: stretch; @@ -193,7 +229,7 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot flex-direction: column; } -.c67 { +.c63 { -webkit-align-items: center; -webkit-box-align: center; -ms-flex-align: center; @@ -214,62 +250,62 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot justify-content: center; } -.c56 { +.c52 { border: 1px solid #f6f6f9; } -.c56:hover:not([aria-disabled='true']) { +.c52:hover:not([aria-disabled='true']) { border: 1px solid #4945ff; } -.c56:hover:not([aria-disabled='true']) .c11 { +.c52:hover:not([aria-disabled='true']) .c11 { color: #4945ff; } -.c56:hover:not([aria-disabled='true']) > .c8 { +.c52:hover:not([aria-disabled='true']) > .c8 { background: #f0f0ff; } -.c56:hover:not([aria-disabled='true']) [data-strapi-dropdown='true'] { +.c52:hover:not([aria-disabled='true']) [data-strapi-dropdown='true'] { background: #d9d8ff; } -.c70 { +.c66 { border: 1px solid #ffffff; } -.c70:hover:not([aria-disabled='true']) { +.c66:hover:not([aria-disabled='true']) { border: 1px solid #4945ff; } -.c70:hover:not([aria-disabled='true']) .c11 { +.c66:hover:not([aria-disabled='true']) .c11 { color: #4945ff; } -.c70:hover:not([aria-disabled='true']) > .c8 { +.c66:hover:not([aria-disabled='true']) > .c8 { background: #f0f0ff; } -.c70:hover:not([aria-disabled='true']) [data-strapi-dropdown='true'] { +.c66:hover:not([aria-disabled='true']) [data-strapi-dropdown='true'] { background: #d9d8ff; } -.c62 { +.c58 { background: transparent; border: none; position: relative; outline: none; } -.c62[aria-disabled='true'] { +.c58[aria-disabled='true'] { pointer-events: none; } -.c62[aria-disabled='true'] svg path { +.c58[aria-disabled='true'] svg path { fill: #666687; } -.c62 svg { +.c58 svg { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; @@ -277,11 +313,11 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot font-size: 0.625rem; } -.c62 svg path { +.c58 svg path { fill: #4945ff; } -.c62:after { +.c58:after { -webkit-transition-property: all; transition-property: all; -webkit-transition-duration: 0.2s; @@ -296,11 +332,11 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot border: 2px solid transparent; } -.c62:focus-visible { +.c58:focus-visible { outline: none; } -.c62:focus-visible:after { +.c58:focus-visible:after { border-radius: 8px; content: ''; position: absolute; @@ -311,21 +347,39 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot border: 2px solid #4945ff; } -.c24 > * { +.c21 > * { margin-top: 0; margin-bottom: 0; } -.c24 > * + * { +.c21 > * + * { + margin-top: 24px; +} + +.c23 > * { + margin-top: 0; + margin-bottom: 0; +} + +.c23 > * + * { margin-top: 16px; } -.c52 > * { +.c27 > * { margin-top: 0; margin-bottom: 0; } -.c52 > * + * { +.c27 > * + * { + margin-top: 4px; +} + +.c48 > * { + margin-top: 0; + margin-bottom: 0; +} + +.c48 > * + * { margin-top: 8px; } @@ -338,42 +392,42 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot margin-left: 8px; } -.c60 > * { +.c56 > * { margin-left: 0; margin-right: 0; } -.c60 > * + * { +.c56 > * + * { margin-left: 12px; } -.c69 path { +.c65 path { fill: #666687; } -.c63 { +.c59 { text-align: left; } -.c63 > span { +.c59 > span { max-width: 100%; } -.c63 svg { +.c59 svg { width: 0.875rem; height: 0.875rem; } -.c63 svg path { +.c59 svg path { fill: #8e8ea9; } -.c58 { +.c54 { min-height: 5.5rem; border-radius: 4px; } -.c58:hover svg path { +.c54:hover svg path { fill: #4945ff; } @@ -435,7 +489,7 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot border: 2px solid #4945ff; } -.c74 { +.c70 { border: 0; -webkit-clip: rect(0 0 0 0); clip: rect(0 0 0 0); @@ -519,28 +573,166 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot fill: #ffffff; } -.c26 { +.c29 { + line-height: 0; +} + +.c31 { + border: none; + border-radius: 4px; + padding-bottom: 0.65625rem; + padding-left: 16px; + padding-right: 16px; + padding-top: 0.65625rem; + color: #32324d; + font-weight: 400; + font-size: 0.875rem; + display: block; + width: 100%; + background: inherit; +} + +.c31::-webkit-input-placeholder { + color: #8e8ea9; + opacity: 1; +} + +.c31::-moz-placeholder { + color: #8e8ea9; + opacity: 1; +} + +.c31:-ms-input-placeholder { + color: #8e8ea9; + opacity: 1; +} + +.c31::placeholder { + color: #8e8ea9; + opacity: 1; +} + +.c31[aria-disabled='true'] { + color: inherit; +} + +.c31:focus { + outline: none; + box-shadow: none; +} + +.c30 { + border: 1px solid #dcdce4; + border-radius: 4px; + background: #ffffff; + outline: none; + box-shadow: 0; + -webkit-transition-property: border-color,box-shadow,fill; + transition-property: border-color,box-shadow,fill; + -webkit-transition-duration: 0.2s; + transition-duration: 0.2s; +} + +.c30:focus-within { + border: 1px solid #4945ff; + box-shadow: #4945ff 0px 0px 0px 2px; +} + +.c35 { + position: relative; + border: 1px solid #dcdce4; + padding-right: 12px; + border-radius: 4px; + background: #ffffff; + overflow: hidden; + min-height: 2.5rem; + outline: none; + box-shadow: 0; + -webkit-transition-property: border-color,box-shadow,fill; + transition-property: border-color,box-shadow,fill; + -webkit-transition-duration: 0.2s; + transition-duration: 0.2s; +} + +.c35:focus-within { + border: 1px solid #4945ff; + box-shadow: #4945ff 0px 0px 0px 2px; +} + +.c41 { + background: transparent; + border: none; + position: relative; + z-index: 1; +} + +.c41 svg { + height: 0.6875rem; + width: 0.6875rem; +} + +.c41 svg path { + fill: #666687; +} + +.c42 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + background: none; + border: none; +} + +.c42 svg { + width: 0.375rem; +} + +.c36 { + position: absolute; + left: 0; + right: 0; + bottom: 0; + top: 0; + width: 100%; + background: transparent; + border: none; +} + +.c36:focus { + outline: none; +} + +.c36[aria-disabled='true'] { + cursor: not-allowed; +} + +.c37 { + width: 100%; +} + +.c25 { display: grid; grid-template-columns: repeat(12,1fr); gap: 20px; } -.c49 { +.c45 { display: grid; grid-template-columns: repeat(12,1fr); } -.c27 { +.c26 { grid-column: span 6; max-width: 100%; } -.c50 { +.c46 { grid-column: span 7; max-width: 100%; } -.c72 { +.c68 { grid-column: span 5; max-width: 100%; } @@ -549,105 +741,109 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot outline: none; } +.c33 { + border: 1px solid #dcdce4; + border-radius: 4px; + padding-left: 16px; + padding-right: 16px; + padding-top: 12px; + padding-bottom: 12px; + background: #ffffff; + outline: none; + box-shadow: 0; + -webkit-transition-property: border-color,box-shadow,fill; + transition-property: border-color,box-shadow,fill; + -webkit-transition-duration: 0.2s; + transition-duration: 0.2s; +} + +.c33:focus-within { + border: 1px solid #4945ff; + box-shadow: #4945ff 0px 0px 0px 2px; +} + +.c34 { + display: block; + width: 100%; + font-weight: 400; + font-size: 0.875rem; + border: none; + color: #32324d; + resize: none; + background: inherit; +} + +.c34::-webkit-input-placeholder { + color: #8e8ea9; + opacity: 1; +} + +.c34::-moz-placeholder { + color: #8e8ea9; + opacity: 1; +} + +.c34:-ms-input-placeholder { + color: #8e8ea9; + opacity: 1; +} + +.c34::placeholder { + color: #8e8ea9; + opacity: 1; +} + +.c34:focus-within { + outline: none; +} + +.c32 textarea { + height: 5rem; + line-height: 1.25rem; +} + +.c32 textarea::-webkit-input-placeholder { + font-weight: 400; + font-size: 0.875rem; + line-height: 1.43; + color: #8e8ea9; + opacity: 1; +} + +.c32 textarea::-moz-placeholder { + font-weight: 400; + font-size: 0.875rem; + line-height: 1.43; + color: #8e8ea9; + opacity: 1; +} + +.c32 textarea:-ms-input-placeholder { + font-weight: 400; + font-size: 0.875rem; + line-height: 1.43; + color: #8e8ea9; + opacity: 1; +} + +.c32 textarea::placeholder { + font-weight: 400; + font-size: 0.875rem; + line-height: 1.43; + color: #8e8ea9; + opacity: 1; +} + .c5 { padding-right: 8px; } -.c19 { - padding-right: 56px; - padding-left: 56px; -} - -.c42 { - padding-right: 16px; - padding-left: 16px; -} - -.c44 { - padding-left: 12px; -} - .c7 { font-size: 0.875rem; line-height: 1.43; color: #4945ff; } -.c29 { - font-size: 0.75rem; - line-height: 1.33; - font-weight: 600; - color: #32324d; -} - -.c31 { - font-size: 0.875rem; - line-height: 1.43; - color: #d02b20; -} - -.c43 { - font-size: 0.875rem; - line-height: 1.43; - display: block; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - color: #666687; -} - -.c47 { - font-size: 0.75rem; - line-height: 1.33; - color: #666687; -} - -.c20 { - -webkit-align-items: stretch; - -webkit-box-align: stretch; - -ms-flex-align: stretch; - align-items: stretch; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; -} - -.c30 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; -} - -.c33 { - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; - -webkit-box-pack: justify; - -webkit-justify-content: space-between; - -ms-flex-pack: justify; - justify-content: space-between; -} - .c4 { display: -webkit-inline-box; display: -webkit-inline-flex; @@ -708,287 +904,38 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot display: flex; } -.c21 > * { - margin-top: 0; - margin-bottom: 0; -} - -.c21 > * + * { - margin-top: 24px; -} - -.c28 > * { - margin-top: 0; - margin-bottom: 0; -} - -.c28 > * + * { - margin-top: 4px; -} - -.c32 { - line-height: 0; -} - -.c35 { - border: none; - border-radius: 4px; - padding-bottom: 0.65625rem; - padding-left: 16px; - padding-right: 16px; - padding-top: 0.65625rem; - color: #32324d; - font-weight: 400; - font-size: 0.875rem; - display: block; - width: 100%; - background: inherit; -} - -.c35::-webkit-input-placeholder { - color: #8e8ea9; - opacity: 1; -} - -.c35::-moz-placeholder { - color: #8e8ea9; - opacity: 1; -} - -.c35:-ms-input-placeholder { - color: #8e8ea9; - opacity: 1; -} - -.c35::placeholder { - color: #8e8ea9; - opacity: 1; -} - -.c35[aria-disabled='true'] { - color: inherit; -} - -.c35:focus { - outline: none; - box-shadow: none; -} - -.c34 { - border: 1px solid #dcdce4; - border-radius: 4px; - background: #ffffff; - outline: none; - box-shadow: 0; - -webkit-transition-property: border-color,box-shadow,fill; - transition-property: border-color,box-shadow,fill; - -webkit-transition-duration: 0.2s; - transition-duration: 0.2s; -} - -.c34:focus-within { - border: 1px solid #4945ff; - box-shadow: #4945ff 0px 0px 0px 2px; -} - -.c40 { - position: absolute; - left: 0; - right: 0; - bottom: 0; - top: 0; - width: 100%; - background: transparent; - border: none; -} - -.c40:focus { - outline: none; -} - -.c40[aria-disabled='true'] { - cursor: not-allowed; -} - -.c39 { - position: relative; - border: 1px solid #dcdce4; - padding-right: 12px; - border-radius: 4px; - background: #ffffff; - overflow: hidden; - min-height: 2.5rem; - outline: none; - box-shadow: 0; - -webkit-transition-property: border-color,box-shadow,fill; - transition-property: border-color,box-shadow,fill; - -webkit-transition-duration: 0.2s; - transition-duration: 0.2s; -} - -.c39:focus-within { - border: 1px solid #4945ff; - box-shadow: #4945ff 0px 0px 0px 2px; -} - -.c45 { - background: transparent; - border: none; - position: relative; - z-index: 1; -} - -.c45 svg { - height: 0.6875rem; - width: 0.6875rem; -} - -.c45 svg path { - fill: #666687; -} - -.c46 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - background: none; - border: none; -} - -.c46 svg { - width: 0.375rem; -} - -.c41 { - width: 100%; -} - -.c37 { - border: 1px solid #dcdce4; - border-radius: 4px; - padding-left: 16px; - padding-right: 16px; - padding-top: 12px; - padding-bottom: 12px; - background: #ffffff; - outline: none; - box-shadow: 0; - -webkit-transition-property: border-color,box-shadow,fill; - transition-property: border-color,box-shadow,fill; - -webkit-transition-duration: 0.2s; - transition-duration: 0.2s; -} - -.c37:focus-within { - border: 1px solid #4945ff; - box-shadow: #4945ff 0px 0px 0px 2px; -} - -.c38 { - display: block; - width: 100%; - font-weight: 400; - font-size: 0.875rem; - border: none; - color: #32324d; - resize: none; - background: inherit; -} - -.c38::-webkit-input-placeholder { - color: #8e8ea9; - opacity: 1; -} - -.c38::-moz-placeholder { - color: #8e8ea9; - opacity: 1; -} - -.c38:-ms-input-placeholder { - color: #8e8ea9; - opacity: 1; -} - -.c38::placeholder { - color: #8e8ea9; - opacity: 1; -} - -.c38:focus-within { - outline: none; -} - -.c36 textarea { - height: 5rem; - line-height: 1.25rem; -} - -.c36 textarea::-webkit-input-placeholder { - font-weight: 400; - font-size: 0.875rem; - line-height: 1.43; - color: #8e8ea9; - opacity: 1; -} - -.c36 textarea::-moz-placeholder { - font-weight: 400; - font-size: 0.875rem; - line-height: 1.43; - color: #8e8ea9; - opacity: 1; -} - -.c36 textarea:-ms-input-placeholder { - font-weight: 400; - font-size: 0.875rem; - line-height: 1.43; - color: #8e8ea9; - opacity: 1; -} - -.c36 textarea::placeholder { - font-weight: 400; - font-size: 0.875rem; - line-height: 1.43; - color: #8e8ea9; - opacity: 1; -} - @media (max-width:68.75rem) { - .c27 { + .c26 { grid-column: span; } } @media (max-width:34.375rem) { - .c27 { + .c26 { grid-column: span 12; } } @media (max-width:68.75rem) { - .c50 { + .c46 { grid-column: span; } } @media (max-width:34.375rem) { - .c50 { + .c46 { grid-column: span; } } @media (max-width:68.75rem) { - .c72 { + .c68 { grid-column: span; } } @media (max-width:34.375rem) { - .c72 { + .c68 { grid-column: span; } } @@ -1091,27 +1038,27 @@ exports[`ADMIN | Pages | API TOKENS | EditView renders and matches the snapshot

Details