diff --git a/webapp/channels/src/components/admin_console/feature_discovery/feature_discovery.test.tsx b/webapp/channels/src/components/admin_console/feature_discovery/feature_discovery.test.tsx index 369d7f6173..946e40f41e 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/feature_discovery.test.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/feature_discovery.test.tsx @@ -13,7 +13,7 @@ import { } from 'tests/react_testing_utils'; import {AboutLinks, LicenseSkus} from 'utils/constants'; -import SamlSVG from './features/images/saml_svg'; +import GroupsSVG from './features/images/groups_svg'; describe('components/feature_discovery', () => { describe('FeatureDiscovery', () => { @@ -35,7 +35,7 @@ describe('components/feature_discovery', () => { defaultMessage: 'Bar', }} learnMoreURL='https://test.mattermost.com/secondary/' - featureDiscoveryImage={} + featureDiscoveryImage={} // eslint-disable-next-line @typescript-eslint/naming-convention stats={{TOTAL_USERS: 20}} prevTrialLicense={{IsLicensed: 'false'}} @@ -94,7 +94,7 @@ describe('components/feature_discovery', () => { defaultMessage: 'Bar', }} learnMoreURL='https://test.mattermost.com/secondary/' - featureDiscoveryImage={} + featureDiscoveryImage={} // eslint-disable-next-line @typescript-eslint/naming-convention stats={{TOTAL_USERS: 20}} prevTrialLicense={{IsLicensed: 'false'}} @@ -154,7 +154,7 @@ describe('components/feature_discovery', () => { defaultMessage: 'Bar', }} learnMoreURL='https://test.mattermost.com/secondary/' - featureDiscoveryImage={} + featureDiscoveryImage={} // eslint-disable-next-line @typescript-eslint/naming-convention stats={{TOTAL_USERS: 20}} prevTrialLicense={{IsLicensed: 'false'}} diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/announcement_banner.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/announcement_banner.tsx index 7137ce54c0..8a19d0d5d4 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/announcement_banner.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/announcement_banner.tsx @@ -24,7 +24,11 @@ const AnnouncementBannerFeatureDiscovery: React.FC = () => { defaultMessage: 'Create announcement banners to notify all members of important information.', })} learnMoreURL='https://docs.mattermost.com/administration/announcement-banner.html' - featureDiscoveryImage={} + featureDiscoveryImage={ + } /> ); }; diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/compliance_export.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/compliance_export.tsx index dd8fd2bc3b..a763148f13 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/compliance_export.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/compliance_export.tsx @@ -24,7 +24,11 @@ const ComplianceExportFeatureDiscovery: React.FC = () => { defaultMessage: 'Run daily compliance reports and export them to a variety of formats consumable by third-party integration tools such as Smarsh (Actiance).', })} learnMoreURL={DocLinks.COMPILANCE_EXPORT} - featureDiscoveryImage={} + featureDiscoveryImage={ + } /> ); }; diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/custom_terms_of_service.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/custom_terms_of_service.tsx index 059e156b85..d720da58fa 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/custom_terms_of_service.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/custom_terms_of_service.tsx @@ -24,7 +24,11 @@ const CustomTermsOfServiceFeatureDiscovery: React.FC = () => { defaultMessage: 'Create your own terms of service that new users must accept before accessing your Mattermost instance on desktop, web, or mobile.', })} learnMoreURL='https://docs.mattermost.com/cloud/cloud-administration/custom-terms-of-service.html' - featureDiscoveryImage={} + featureDiscoveryImage={ + } /> ); }; diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/data_retention.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/data_retention.tsx index 3d18371dd0..e611c35bab 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/data_retention.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/data_retention.tsx @@ -24,7 +24,11 @@ const DataRetentionFeatureDiscovery: React.FC = () => { defaultMessage: 'Hold on to your data only as long as you need to. Create data retention jobs for select channels and teams to automatically delete disposable data.', })} learnMoreURL='https://docs.mattermost.com/administration/data-retention.html' - featureDiscoveryImage={} + featureDiscoveryImage={ + } /> ); }; diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/groups.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/groups.tsx index 727ce29873..d52a8aea75 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/groups.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/groups.tsx @@ -24,7 +24,12 @@ const GroupsFeatureDiscovery: React.FC = () => { defaultMessage: 'Use AD/LDAP groups to organize and apply actions to multiple users at once. Manage team and channel memberships, permissions, and more.', })} learnMoreURL='https://docs.mattermost.com/deployment/ldap-group-sync.html' - featureDiscoveryImage={} + featureDiscoveryImage={ + + } /> ); }; diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/images/announcement_banner_svg.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/images/announcement_banner_svg.tsx index afa26647e4..ceeefba676 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/images/announcement_banner_svg.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/images/announcement_banner_svg.tsx @@ -10,548 +10,318 @@ type SvgProps = { const AnnouncementBannerSVG = (props: SvgProps) => ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + - - + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - ); diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/images/compliance_export_svg.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/images/compliance_export_svg.tsx index 4c5299fdaa..97c47f8e3b 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/images/compliance_export_svg.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/images/compliance_export_svg.tsx @@ -10,836 +10,293 @@ type SvgProps = { const ComplianceExportSVG = (props: SvgProps) => ( - - - - - + + + + + - - + + + - - + - + - - - - - - - + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + - - - - - - - - - - - - - - - + - - - - - - - ); diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/images/custom_terms_of_service_svg.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/images/custom_terms_of_service_svg.tsx index fcb53e04f7..7f7fc2aa65 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/images/custom_terms_of_service_svg.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/images/custom_terms_of_service_svg.tsx @@ -10,255 +10,197 @@ type SvgProps = { const CustomTermsOfServiceSVG = (props: SvgProps) => ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + ); diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/images/data_retention_svg.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/images/data_retention_svg.tsx index d8beded5a8..26f9b7e74d 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/images/data_retention_svg.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/images/data_retention_svg.tsx @@ -10,333 +10,292 @@ type SvgProps = { const DataRetentionSVG = (props: SvgProps) => ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/images/groups_svg.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/images/groups_svg.tsx index 94607f69f5..5094f337bb 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/images/groups_svg.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/images/groups_svg.tsx @@ -10,88 +10,296 @@ type SvgProps = { const GroupsSVG = (props: SvgProps) => ( - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); export default GroupsSVG; diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/images/guest_access_svg.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/images/guest_access_svg.tsx index 56ef0e9b78..d652f3c3cf 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/images/guest_access_svg.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/images/guest_access_svg.tsx @@ -10,421 +10,501 @@ type SvgProps = { const GuestAccessSVG = (props: SvgProps) => ( - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + - + + - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/images/ldap_svg.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/images/ldap_svg.tsx deleted file mode 100644 index e183a45b1b..0000000000 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/images/ldap_svg.tsx +++ /dev/null @@ -1,207 +0,0 @@ -// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. -// See LICENSE.txt for license information. - -import React from 'react'; - -type SvgProps = { - width?: number; - height?: number; -} - -const LdapSVG = (props: SvgProps) => ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -); - -export default LdapSVG; diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/images/saml_svg.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/images/saml_svg.tsx deleted file mode 100644 index 6a555e4edd..0000000000 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/images/saml_svg.tsx +++ /dev/null @@ -1,148 +0,0 @@ -// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. -// See LICENSE.txt for license information. - -import React from 'react'; - -type SvgProps = { - width?: number; - height?: number; -} - -const SamlSVG = (props: SvgProps) => ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -); - -export default SamlSVG; diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/images/system_roles_svg.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/images/system_roles_svg.tsx index 5e5c54cbbf..0ae2755daa 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/images/system_roles_svg.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/images/system_roles_svg.tsx @@ -10,861 +10,501 @@ type SvgProps = { const SystemRolesSVG = (props: SvgProps) => ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + - - + + + + + + + - - - - - - - - - - - - - - + + + + + + + - - + + - + + - - - - - - - - - - - - - - - - - - - - - - + + + + - + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - ); diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/ldap.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/ldap.tsx index 43be7c1f97..e1f4e08cdc 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/ldap.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/ldap.tsx @@ -6,7 +6,7 @@ import {defineMessage} from 'react-intl'; import {LicenseSkus} from 'utils/constants'; -import LdapSVG from './images/ldap_svg'; +import GroupsSVG from './images/groups_svg'; import FeatureDiscovery from '../index'; @@ -24,7 +24,11 @@ const LDAPFeatureDiscovery: React.FC = () => { defaultMessage: 'When you connect Mattermost with your organization\'s Active Directory/LDAP, users can log in without having to create new usernames and passwords.', })} learnMoreURL='https://www.mattermost.com/docs-adldap/?utm_medium=product&utm_source=product-feature-discovery&utm_content=adldap' - featureDiscoveryImage={} + featureDiscoveryImage={ + } /> ); }; diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/openid.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/openid.tsx index 81a512f1fa..07ee39c5d1 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/openid.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/openid.tsx @@ -6,7 +6,7 @@ import {defineMessage} from 'react-intl'; import {LicenseSkus} from 'utils/constants'; -import SamlSVG from './images/saml_svg'; +import GroupsSVG from './images/groups_svg'; import FeatureDiscovery from '../index'; @@ -24,7 +24,11 @@ const OpenIDFeatureDiscovery: React.FC = () => { defaultMessage: 'Use OpenID Connect for authentication and single sign-on (SSO) with any service that supports the OIDC specification such as Google, Entra ID, Apple, Okta, OneLogin, and more.', })} learnMoreURL='https://docs.mattermost.com/cloud/cloud-administration/sso-openid-connect.html' - featureDiscoveryImage={} + featureDiscoveryImage={ + } /> ); }; diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/openid_custom.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/openid_custom.tsx index 4de125b707..2b60a0e8fc 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/openid_custom.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/openid_custom.tsx @@ -6,7 +6,7 @@ import {defineMessage} from 'react-intl'; import {LicenseSkus} from 'utils/constants'; -import SamlSVG from './images/saml_svg'; +import GroupsSVG from './images/groups_svg'; import FeatureDiscovery from '../index'; @@ -24,7 +24,11 @@ const OpenIDCustomFeatureDiscovery: React.FC = () => { defaultMessage: 'Use OpenID Connect for authentication and single sign-on (SSO) with any service that supports the OIDC specification such as Apple, Okta, OneLogin, and more.', })} learnMoreURL='https://docs.mattermost.com/cloud/cloud-administration/sso-openid-connect.html' - featureDiscoveryImage={} + featureDiscoveryImage={ + } /> ); }; diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/saml.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/saml.tsx index 769bbbbb09..021ae51adb 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/saml.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/saml.tsx @@ -6,7 +6,7 @@ import {defineMessage} from 'react-intl'; import {LicenseSkus} from 'utils/constants'; -import SamlSVG from './images/saml_svg'; +import GroupsSVG from './images/groups_svg'; import FeatureDiscovery from '../index'; @@ -24,7 +24,12 @@ const SAMLFeatureDiscovery: React.FC = () => { defaultMessage: 'When you connect Mattermost with your organization\'s single sign-on provider, users can access Mattermost without having to re-enter their credentials.', })} learnMoreURL='https://www.mattermost.com/docs-saml/?utm_medium=product&utm_source=product-feature-discovery&utm_content=saml' - featureDiscoveryImage={} + featureDiscoveryImage={ + + } /> ); }; diff --git a/webapp/channels/src/components/admin_console/feature_discovery/features/system_roles.tsx b/webapp/channels/src/components/admin_console/feature_discovery/features/system_roles.tsx index cb17a81b10..f8386dc765 100644 --- a/webapp/channels/src/components/admin_console/feature_discovery/features/system_roles.tsx +++ b/webapp/channels/src/components/admin_console/feature_discovery/features/system_roles.tsx @@ -24,7 +24,11 @@ const SystemRolesFeatureDiscovery: React.FC = () => { defaultMessage: 'Assign customizable admin roles to give designated users read and/or write access to select sections of System Console.', })} learnMoreURL='https://docs.mattermost.com/deployment/admin-roles.html' - featureDiscoveryImage={} + featureDiscoveryImage={ + } /> ); }; diff --git a/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition.scss b/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition.scss index 0259f6a2e4..58385518d6 100644 --- a/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition.scss +++ b/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition.scss @@ -5,7 +5,7 @@ text-align: center; svg { - margin: 0 auto; + margin: 0 auto 24px auto; } } diff --git a/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition_right_panel.tsx b/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition_right_panel.tsx index 93e8a9cbcf..9e94a9acef 100644 --- a/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition_right_panel.tsx +++ b/webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition_right_panel.tsx @@ -7,9 +7,7 @@ import {FormattedMessage} from 'react-intl'; import type {ClientLicense} from '@mattermost/types/config'; import ContactUsButton from 'components/announcement_bar/contact_sales/contact_us'; -import TwoPeopleChattingSvg from 'components/common/svg_images_components/two_people_chatting_svg'; -import WomanUpArrowsAndCloudsSvg from 'components/common/svg_images_components/woman_up_arrows_and_clouds_svg'; -import WomanWithCardSvg from 'components/common/svg_images_components/woman_with_card_svg'; +import SetupSystemSvg from 'components/common/svg_images_components/setup_system'; import {isEnterpriseOrE20License} from 'utils/license_utils'; @@ -86,26 +84,13 @@ const EnterpriseEditionRightPanel = ({ }; const svgImage = () => { - if (isTrialLicense) { - return ( - - ); - } if (isEnterpriseOrE20) { - return ( - - ); + return null; //No image } return ( - ); }; diff --git a/webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.scss b/webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.scss index ad9652fba6..c81ae52776 100644 --- a/webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.scss +++ b/webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.scss @@ -36,6 +36,10 @@ line-height: 20px; text-align: center; } + + .alert-svg { + margin-bottom: 15px; + } } .content-footer { diff --git a/webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.tsx b/webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.tsx index adfc1fbc7a..52894127dd 100644 --- a/webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.tsx +++ b/webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.tsx @@ -56,10 +56,10 @@ const ConfirmLicenseRemovalModal: React.FC = (props: Props): JSX.Element > <>
-
+
diff --git a/webapp/channels/src/components/admin_console/license_settings/modals/upload_license_modal.scss b/webapp/channels/src/components/admin_console/license_settings/modals/upload_license_modal.scss index e0bb168724..96ab3e5dc3 100644 --- a/webapp/channels/src/components/admin_console/license_settings/modals/upload_license_modal.scss +++ b/webapp/channels/src/components/admin_console/license_settings/modals/upload_license_modal.scss @@ -22,7 +22,7 @@ justify-content: center; .svg-image { - margin-top: -20px; + margin-bottom:15px; } .hands-svg { diff --git a/webapp/channels/src/components/admin_console/license_settings/modals/upload_license_modal.tsx b/webapp/channels/src/components/admin_console/license_settings/modals/upload_license_modal.tsx index 01df29f8fe..f68cb63206 100644 --- a/webapp/channels/src/components/admin_console/license_settings/modals/upload_license_modal.tsx +++ b/webapp/channels/src/components/admin_console/license_settings/modals/upload_license_modal.tsx @@ -18,8 +18,8 @@ import {getCurrentLocale} from 'selectors/i18n'; import {isModalOpen} from 'selectors/views/modals'; import FileSvg from 'components/common/svg_images_components/file_svg'; -import HandsSvg from 'components/common/svg_images_components/hands_svg'; -import WomanArmOnTable from 'components/common/svg_images_components/woman_arm_on_table_svg'; +import SuccessSvg from 'components/common/svg_images_components/success_svg'; +import UploadLicenseSvg from 'components/common/svg_images_components/upload_license'; import LoadingWrapper from 'components/widgets/loading/loading_wrapper'; import {FileTypes, ModalIdentifiers} from 'utils/constants'; @@ -110,9 +110,9 @@ const UploadLicenseModal = (props: Props): JSX.Element | null => { <>
-
@@ -242,9 +242,9 @@ const UploadLicenseModal = (props: Props): JSX.Element | null => { <>
-
diff --git a/webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_edition.scss b/webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_edition.scss index c7bea81381..0d469492eb 100644 --- a/webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_edition.scss +++ b/webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_edition.scss @@ -6,7 +6,7 @@ text-align: center; svg { - margin: 0 auto; + margin: 0 auto 24px auto; } } diff --git a/webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_right_panel.tsx b/webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_right_panel.tsx index 79660b1584..9c0359cdaf 100644 --- a/webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_right_panel.tsx +++ b/webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_right_panel.tsx @@ -5,7 +5,7 @@ import React, {memo} from 'react'; import {FormattedMessage} from 'react-intl'; import ContactUsButton from 'components/announcement_bar/contact_sales/contact_us'; -import WomanUpArrowsAndCloudsSvg from 'components/common/svg_images_components/woman_up_arrows_and_clouds_svg'; +import SetupSystemSvg from 'components/common/svg_images_components/setup_system'; const StarterRightPanel = () => { const upgradeAdvantages = [ @@ -19,9 +19,9 @@ const StarterRightPanel = () => { return (
-
diff --git a/webapp/channels/src/components/admin_console/license_settings/team_edition/team_edition.scss b/webapp/channels/src/components/admin_console/license_settings/team_edition/team_edition.scss index fc49850b5a..f270b99b99 100644 --- a/webapp/channels/src/components/admin_console/license_settings/team_edition/team_edition.scss +++ b/webapp/channels/src/components/admin_console/license_settings/team_edition/team_edition.scss @@ -3,7 +3,7 @@ text-align: center; svg { - margin: 0 auto; + margin: 0 auto 24px auto; } } diff --git a/webapp/channels/src/components/admin_console/license_settings/team_edition/team_edition_right_panel.tsx b/webapp/channels/src/components/admin_console/license_settings/team_edition/team_edition_right_panel.tsx index 4d6ebdd33b..068be2b1ea 100644 --- a/webapp/channels/src/components/admin_console/license_settings/team_edition/team_edition_right_panel.tsx +++ b/webapp/channels/src/components/admin_console/license_settings/team_edition/team_edition_right_panel.tsx @@ -4,7 +4,7 @@ import React from 'react'; import {FormattedMessage, useIntl} from 'react-intl'; -import WomanUpArrowsAndCloudsSvg from 'components/common/svg_images_components/woman_up_arrows_and_clouds_svg'; +import SetupSystemSvg from 'components/common/svg_images_components/setup_system'; import LoadingWrapper from 'components/widgets/loading/loading_wrapper'; import {format} from 'utils/markdown'; @@ -157,9 +157,9 @@ const TeamEditionRightPanel: React.FC = ({ return (
-
diff --git a/webapp/channels/src/components/admin_console/system_users/system_users_export/upgrade_export_data_modal.tsx b/webapp/channels/src/components/admin_console/system_users/system_users_export/upgrade_export_data_modal.tsx index 079027be98..a63fa1ff4f 100644 --- a/webapp/channels/src/components/admin_console/system_users/system_users_export/upgrade_export_data_modal.tsx +++ b/webapp/channels/src/components/admin_console/system_users/system_users_export/upgrade_export_data_modal.tsx @@ -5,7 +5,7 @@ import React from 'react'; import {FormattedMessage} from 'react-intl'; import useOpenPricingModal from 'components/common/hooks/useOpenPricingModal'; -import WomanUpArrowsAndCloudsSvg from 'components/common/svg_images_components/woman_up_arrows_and_clouds_svg'; +import SetupSystemSvg from 'components/common/svg_images_components/setup_system'; import ConfirmModalRedux from 'components/confirm_modal_redux'; import './upgrade_export_data_modal.scss'; @@ -35,7 +35,7 @@ export function UpgradeExportDataModal({onExited}: Props) { defaultMessage='Export detailed data reports with ease and analyse user statistics conveniently. Upgrade to the Professional plan to gain access to data export.' />
- diff --git a/webapp/channels/src/components/common/svg_images_components/alert_svg.tsx b/webapp/channels/src/components/common/svg_images_components/alert_svg.tsx index 6fee1280c2..5161a60d65 100644 --- a/webapp/channels/src/components/common/svg_images_components/alert_svg.tsx +++ b/webapp/channels/src/components/common/svg_images_components/alert_svg.tsx @@ -10,25 +10,73 @@ type SvgProps = { const AlertSvg = (props: SvgProps) => ( + + + + + + + + ); export default AlertSvg; diff --git a/webapp/channels/src/components/common/svg_images_components/hands_svg.tsx b/webapp/channels/src/components/common/svg_images_components/hands_svg.tsx deleted file mode 100644 index f69b11be95..0000000000 --- a/webapp/channels/src/components/common/svg_images_components/hands_svg.tsx +++ /dev/null @@ -1,97 +0,0 @@ -// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. -// See LICENSE.txt for license information. - -import React from 'react'; - -type SvgProps = { - width: number; - height: number; -} - -const HandsSvg = (props: SvgProps) => ( - - - - - - - - - - - - - - - - - - - - - - - - - -); - -export default HandsSvg; diff --git a/webapp/channels/src/components/common/svg_images_components/setup_system.tsx b/webapp/channels/src/components/common/svg_images_components/setup_system.tsx new file mode 100644 index 0000000000..0dbf8e605a --- /dev/null +++ b/webapp/channels/src/components/common/svg_images_components/setup_system.tsx @@ -0,0 +1,247 @@ +// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. + +import React from 'react'; + +type SvgProps = { + width: number; + height: number; +}; + +const SetupSystemSvg = (props: SvgProps) => ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +); + +export default SetupSystemSvg; diff --git a/webapp/channels/src/components/common/svg_images_components/success_svg.tsx b/webapp/channels/src/components/common/svg_images_components/success_svg.tsx new file mode 100644 index 0000000000..f091c2729d --- /dev/null +++ b/webapp/channels/src/components/common/svg_images_components/success_svg.tsx @@ -0,0 +1,67 @@ +// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. + +import React from 'react'; + +type SvgProps = { + width: number; + height: number; +} + +const SuccessSvg = (props: SvgProps) => ( + + + + + + + + + + +); + +export default SuccessSvg; diff --git a/webapp/channels/src/components/common/svg_images_components/two_people_chatting_svg.tsx b/webapp/channels/src/components/common/svg_images_components/two_people_chatting_svg.tsx deleted file mode 100644 index cb7ccfb794..0000000000 --- a/webapp/channels/src/components/common/svg_images_components/two_people_chatting_svg.tsx +++ /dev/null @@ -1,417 +0,0 @@ -// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. -// See LICENSE.txt for license information. - -import React from 'react'; - -type SvgProps = { - width: number; - height: number; -}; - -const TwoPeopleChattingSvg = (props: SvgProps) => ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -); - -export default TwoPeopleChattingSvg; diff --git a/webapp/channels/src/components/common/svg_images_components/upload_license.tsx b/webapp/channels/src/components/common/svg_images_components/upload_license.tsx new file mode 100644 index 0000000000..301ff065b8 --- /dev/null +++ b/webapp/channels/src/components/common/svg_images_components/upload_license.tsx @@ -0,0 +1,104 @@ +// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. + +// https://www.figma.com/file/MYVj0NUudT9V7GV9KepBy3/%E2%9C%85Foundations---Illustrations?node-id=665%3A9992 + +import React from 'react'; + +type SvgProps = { + width: number; + height: number; +}; + +const UploadLicenseSvg = (props: SvgProps) => ( + + + + + + + + + + + + + + +); + +export default UploadLicenseSvg; diff --git a/webapp/channels/src/components/common/svg_images_components/woman_arm_on_table_svg.tsx b/webapp/channels/src/components/common/svg_images_components/woman_arm_on_table_svg.tsx deleted file mode 100644 index 920cb700b3..0000000000 --- a/webapp/channels/src/components/common/svg_images_components/woman_arm_on_table_svg.tsx +++ /dev/null @@ -1,332 +0,0 @@ -// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. -// See LICENSE.txt for license information. - -// https://www.figma.com/file/MYVj0NUudT9V7GV9KepBy3/%E2%9C%85Foundations---Illustrations?node-id=665%3A9992 - -import React from 'react'; - -type SvgProps = { - width: number; - height: number; -}; - -const WomanArmOnTable = (props: SvgProps) => ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -); - -export default WomanArmOnTable; diff --git a/webapp/channels/src/components/common/svg_images_components/woman_up_arrows_and_clouds_svg.tsx b/webapp/channels/src/components/common/svg_images_components/woman_up_arrows_and_clouds_svg.tsx deleted file mode 100644 index 8218738562..0000000000 --- a/webapp/channels/src/components/common/svg_images_components/woman_up_arrows_and_clouds_svg.tsx +++ /dev/null @@ -1,273 +0,0 @@ -// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. -// See LICENSE.txt for license information. - -import React from 'react'; - -type SvgProps = { - width: number; - height: number; -}; - -const WomanUpArrowsAndCloudsSvg = (props: SvgProps) => ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -); - -export default WomanUpArrowsAndCloudsSvg; diff --git a/webapp/channels/src/components/post_edit_history/__snapshots__/post_edit_history.test.tsx.snap b/webapp/channels/src/components/post_edit_history/__snapshots__/post_edit_history.test.tsx.snap index ee3cebfb7c..fafb3778ad 100644 --- a/webapp/channels/src/components/post_edit_history/__snapshots__/post_edit_history.test.tsx.snap +++ b/webapp/channels/src/components/post_edit_history/__snapshots__/post_edit_history.test.tsx.snap @@ -64,21 +64,68 @@ exports[`components/post_edit_history should display error screen if errors are + + + + + + +

), bottomLeftMessage: formatMessage({id: 'trial_benefits.modal.onlyVisibleToAdmins', defaultMessage: 'Only visible to admins'}), diff --git a/webapp/channels/src/sass/base/_css_variables.scss b/webapp/channels/src/sass/base/_css_variables.scss index 7a5ee68d9d..c82c88cdee 100644 --- a/webapp/channels/src/sass/base/_css_variables.scss +++ b/webapp/channels/src/sass/base/_css_variables.scss @@ -110,4 +110,11 @@ --center-channel-text: var(--center-channel-color); // use --center-channel-color-rgb instead --center-channel-text-rgb: var(--center-channel-color-rgb); + + //Colors used in svgs but not themed + --indigo-400: #28427B; + --indigo-300: #32539A; + --sand: #CCC4AE; + --neutral-0: #FFFFFF; + --neutral-1200: #090A0B; }