mirrors/mostlymatter
1
0
Форкнуть 0
Код Задачи Запросы на слияние Действия Пакеты Проекты Релизы Вики Активность

Remove redundant button styles and use proper button classes (#30929)

Просмотр исходного кода 
* remove redundant button styles and use proper button classes

* remove import for contact_us css

* fix view plans button to be xs

* tweak to disabled state on save button in floating bar

* change contact us to tertiary button like before

* updated btn-full on free edition right panel

* update contact button to be primary when shown in the trial card

* fix issue with hover state on save changes panel error state

* fix style lint issues

* update snapshots

* fixed a few license page buttons

* fix lint issue

* Update index.test.tsx.snap

* add empty end lines

* fixed scope of css so it doesn't affect product switcher

* upate button font size for xs, update bg color for button in announce bar

* fix lint error

* update missed cancel buttons to use proper classes

* fixed text spec to find the right button

* updated snapshots

* fix issue with test on cancel button

* update snapshots
Этот коммит содержится в:
Matthew Birtch
2025-06-03 15:37:20 -04:00
коммит произвёл GitHub
родитель 0a7be9f034
Коммит a87d29fce7
66 изменённых файлов: 162 добавлений и 654 удалений
Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

2
e2e-tests/cypress/tests/integration/channels/enterprise/system_console/team_guest_channel_spec.js
Просмотреть файл

@@ -89,7 +89,7 @@ describe('Team Scheme Guest Permissions Test', () => {
// * Ensure all checkboxes have the correct unchecked state
verifyAllGuestPermissions(false);
cy.get('.cancel-button').click();
cy.findByTestId('permission-scheme-cancel-button').should('be.visible').click();
//Clean up - Delete scheme
cy.findByText(`TestScheme-${randomId}`).siblings('.actions').children('.delete-button').click().wait(TIMEOUTS.HALF_SEC);

2
e2e-tests/cypress/tests/integration/channels/integrations/incoming_webhook/incoming_webhook_is_image_only_spec.js
Просмотреть файл

@@ -62,7 +62,7 @@ describe('Incoming webhook', () => {
// * Verify that the hook ID in the URL matches with the one shown in a page
// * Verify that the copy link is shown.
cy.findByText(hookUrl).should('be.visible').
parent().siblings('.fa-copy').should('be.visible');
parent().siblings('[data-testid="copyText"]').should('be.visible');
// # Click "Done" and verify that it redirects to incoming webhooks URL
cy.findByText('Done').click();

2
e2e-tests/cypress/tests/integration/channels/integrations/incoming_webhook/setup_incoming_webhook_spec.js
Просмотреть файл

@@ -64,7 +64,7 @@ describe('Incoming webhook', () => {
// * Verify that the hook ID in the URL matches with the one shown in a page
// * Verify that the copy link is shown.
cy.findByText(hookUrl).should('be.visible').
parent().siblings('.fa-copy').should('be.visible');
parent().siblings('[data-testid="copyText"]').should('be.visible');
// # Click "Done" and verify that it redirects to incoming webhooks URL
cy.findByText('Done').click();

4
webapp/channels/src/components/actions_menu/__snapshots__/actions_menu.test.tsx.snap
Просмотреть файл

@@ -182,12 +182,12 @@ exports[`components/actions_menu/ActionsMenu no actions - sysadmin - menu should
className="visit-marketplace"
>
<button
className="btn btn-primary visit-marketplace-button"
className="btn btn-primary btn-sm visit-marketplace-button"
id="marketPlaceButton"
onClick={[Function]}
>
<ActionsMenuIcon
name="icon-view-grid-plus-outline visit-marketplace-button-icon"
name="icon-view-grid-plus-outline"
/>
<span
className="visit-marketplace-button-text"

29
webapp/channels/src/components/actions_menu/actions_menu.scss
Просмотреть файл

@@ -1,34 +1,19 @@
.visit-marketplace-text {
margin: 12px;
font-family: 'Open Sans';
font-size: 14px;
font-weight: 400;
line-height: 20px;
padding: 8px 16px 12px 16px;
text-align: center;
}
.visit-marketplace {
top: 1px;
padding-top: 4px;
padding-right: 16px;
padding-bottom: 16px;
padding-bottom: 8px;
padding-left: 16px;
font-size: 12px;
text-align: center;
}
.visit-marketplace-button {
border-radius: 4px;
}
width: 100%;
.visit-marketplace-button-text {
align-items: center;
font-size: 12px;
font-weight: 600;
line-height: 9px;
}
.visit-marketplace-button-icon {
margin-right: 5px;
font-size: 14.4px;
.Menu {
padding: 8px 0;
text-align: left;
}
}

4
webapp/channels/src/components/actions_menu/actions_menu.tsx
Просмотреть файл

@@ -212,10 +212,10 @@ export class ActionMenuClass extends React.PureComponent<Props, State> {
<div className='visit-marketplace' >
<button
id='marketPlaceButton'
className='btn btn-primary visit-marketplace-button'
className='btn btn-primary btn-sm visit-marketplace-button'
onClick={this.handleOpenMarketplace}
>
<ActionsMenuIcon name='icon-view-grid-plus-outline visit-marketplace-button-icon'/>
<ActionsMenuIcon name='icon-view-grid-plus-outline'/>
<span className='visit-marketplace-button-text'>
<FormattedMessage
id='post_info.actions.visitMarketplace'

80
webapp/channels/src/components/admin_console/billing/billing_subscriptions/billing_subscriptions.scss
Просмотреть файл

@@ -91,33 +91,7 @@
.UpgradeMattermostCloud__upgradeButton {
width: 100%;
padding: 13px 0;
border: none;
border-radius: 4px;
margin-top: 16px;
background: var(--button-bg);
box-shadow: inset 0 0 0 1px var(--sys-button-bg);
color: var(--button-color);
font-size: 14px;
font-weight: 600;
line-height: 14px;
&:hover:not(.disabled) {
background: linear-gradient(0deg, rgba(var(--center-channel-color-rgb), 0.16), rgba(var(--center-channel-color-rgb), 0.16)), var(--button-bg);
}
&:active {
background: linear-gradient(0deg, rgba(var(--center-channel-color-rgb), 0.32), rgba(var(--center-channel-color-rgb), 0.32)), var(--button-bg);
}
&:focus {
box-shadow: inset 0 0 0 2px var(--sidebar-text-active-border);
}
&.disabled {
background: rgba(var(--center-channel-color-rgb), 0.08);
color: rgba(var(--center-channel-color-rgb), 0.32);
}
}
.PrivateCloudCard {
@@ -153,34 +127,7 @@
.PrivateCloudCard__actionButton {
display: block;
padding: 13px 20px;
border: none;
border-radius: 4px;
margin-top: 16px;
background: var(--sys-center-channel-bg);
box-shadow: inset 0 0 0 1px var(--sys-button-bg);
color: var(--sys-button-bg);
font-size: 14px;
font-weight: 600;
line-height: 14px;
@include utils-mixins.fit-content;
&:hover:not(.disabled) {
background: rgba(var(--sys-button-bg-rgb), 0.04);
text-decoration: none;
}
&:active {
background: rgba(var(--sys-button-bg-rgb), 0.08);
text-decoration: none;
}
&:focus {
box-shadow: inset 0 0 0 2px var(--sys-button-bg);
text-decoration: none;
}
}
.cancelSubscriptionSection {
@@ -209,32 +156,5 @@
.cancelSubscriptionSection__contactUs {
display: block;
padding: 13px 20px;
border-radius: 4px;
margin-top: 16px;
box-shadow: inset 0 0 0 1px var(--sys-dnd-indicator);
color: var(--sys-dnd-indicator);
font-size: 12px;
font-weight: 600;
line-height: 9.5px;
@include utils-mixins.fit-content;
&:hover:not(.disabled) {
background: rgba(var(--sys-dnd-indicator-rgb), 0.04);
color: var(--sys-dnd-indicator);
text-decoration: none;
}
&:active {
background: rgba(var(--sys-dnd-indicator-rgb), 0.08);
text-decoration: none;
}
&:focus {
box-shadow: inset 0 0 0 2px var(--sys-dnd-indicator);
color: var(--sys-dnd-indicator);
text-decoration: none;
}
}

2
webapp/channels/src/components/admin_console/billing/billing_subscriptions/cancel_subscription.tsx
Просмотреть файл

@@ -31,7 +31,7 @@ const CancelSubscription = () => {
<ExternalLink
location='cancel_subscription'
href={contactSupportURL}
className='cancelSubscriptionSection__contactUs'
className='btn btn-secondary btn-sm btn-danger cancelSubscriptionSection__contactUs'
onClick={() => trackEvent('cloud_admin', 'click_contact_us')}
>
<FormattedMessage

4
webapp/channels/src/components/admin_console/billing/billing_subscriptions/contact_sales_card.tsx
Просмотреть файл

@@ -145,7 +145,7 @@ const ContactSalesCard = (props: Props) => {
<ExternalLink
location='contact_sales_card'
href={contactSalesLink}
className='PrivateCloudCard__actionButton'
className='btn btn-tertiary PrivateCloudCard__actionButton'
onClick={() => trackEvent('cloud_admin', 'click_contact_sales')}
>
<FormattedMessage
@@ -165,7 +165,7 @@ const ContactSalesCard = (props: Props) => {
openSalesLink();
}
}}
className='PrivateCloudCard__actionButton'
className='btn btn-tertiary PrivateCloudCard__actionButton'
>
{subscriptionPlan === CloudProducts.STARTER ? (
<FormattedMessage

46
webapp/channels/src/components/admin_console/billing/billing_summary/billing_summary.scss
Просмотреть файл

@@ -147,53 +147,7 @@
}
.BillingSummary__lastInvoice-downloadButton {
display: flex;
width: 100%;
align-items: center;
justify-content: center;
padding: 11px 20px;
border-radius: 4px;
background: var(--sys-button-bg);
color: var(--sys-button-color);
&:hover:not(.disabled) {
background: linear-gradient(0deg, rgba(var(--sys-center-channel-color-rgb), 0.16), rgba(var(--sys-center-channel-color-rgb), 0.16)), var(--sys-button-bg);
color: var(--sys-button-color);
text-decoration: none;
}
&:active {
background: linear-gradient(0deg, rgba(var(--sys-center-channel-color-rgb), 0.32), rgba(var(--sys-center-channel-color-rgb), 0.32)), var(--sys-button-bg);
color: var(--sys-button-color);
text-decoration: none;
}
&:focus {
box-shadow: inset 0 0 0 2px var(--sys-sidebar-text-active-border);
color: var(--sys-button-color);
text-decoration: none;
}
&.disabled {
background: rgba(var(--sys-center-channel-color-rgb), 0.08);
color: rgba(var(--sys-center-channel-color-rgb), 0.32);
}
> i {
font-size: 18px;
line-height: 21px;
&::before {
margin: 0;
}
}
> span {
margin-left: 6px;
font-size: 14px;
font-weight: 600;
line-height: 14px;
}
}
.BillingSummary__lastInvoice-billingHistory {

2
webapp/channels/src/components/admin_console/billing/billing_summary/billing_summary.tsx
Просмотреть файл

@@ -55,7 +55,7 @@ export const noBillingHistory = (
<ExternalLink
location='billing_summary'
href={CloudLinks.BILLING_DOCS}
className='BillingSummary__noBillingHistory-link'
className='btn btn-primary BillingSummary__noBillingHistory-link'
onClick={() => trackEvent('cloud_admin', 'click_how_billing_works', {screen: 'subscriptions'})}
>
<FormattedMessage

44
webapp/channels/src/components/admin_console/billing/company_info_display.scss
Просмотреть файл

@@ -29,51 +29,7 @@
}
.CompanyInfoDisplay__addInfoButton {
display: flex;
align-items: center;
padding: 8px 16px;
border-radius: 4px;
background: var(--sys-button-bg);
color: var(--sys-button-color);
&:hover:not(.disabled) {
background: linear-gradient(0deg, rgba(var(--sys-center-channel-color-rgb), 0.16), rgba(var(--sys-center-channel-color-rgb), 0.16)), var(--sys-button-bg);
color: var(--sys-button-color);
text-decoration: none;
}
&:active {
background: linear-gradient(0deg, rgba(var(--sys-center-channel-color-rgb), 0.32), rgba(var(--sys-center-channel-color-rgb), 0.32)), var(--sys-button-bg);
color: var(--sys-button-color);
text-decoration: none;
}
&:focus {
box-shadow: inset 0 0 0 2px var(--sys-sidebar-text-active-border);
color: var(--sys-button-color);
text-decoration: none;
}
&.disabled {
background: rgba(var(--sys-center-channel-color-rgb), 0.08);
color: rgba(var(--sys-center-channel-color-rgb), 0.32);
}
> i {
font-size: 14.4px;
line-height: 17px;
&::before {
margin: 0;
}
}
> span {
margin-left: 4px;
font-size: 12px;
font-weight: 600;
line-height: 9px;
}
}
.CompanyInfoDisplay__noCompanyInfo {

4
webapp/channels/src/components/admin_console/billing/company_info_display.tsx
Просмотреть файл

@@ -18,7 +18,7 @@ const addInfoButton = (
<div className='CompanyInfoDisplay__addInfo'>
<BlockableLink
to='/admin_console/billing/company_info_edit'
className='CompanyInfoDisplay__addInfoButton'
className='btn btn-primary CompanyInfoDisplay__addInfoButton'
onClick={() => trackEvent('cloud_admin', 'click_add_company_info')}
>
<i className='icon icon-plus'/>
@@ -44,7 +44,7 @@ const noCompanyInfoSection = (
</div>
<BlockableLink
to='/admin_console/billing/company_info_edit'
className='CompanyInfoDisplay__noCompanyInfo-link'
className='btn btn-primary CompanyInfoDisplay__noCompanyInfo-link'
onClick={() => trackEvent('cloud_admin', 'click_add_company_info')}
>
<FormattedMessage

2
webapp/channels/src/components/admin_console/billing/company_info_edit.tsx
Просмотреть файл

@@ -284,7 +284,7 @@ const CompanyInfoEdit: React.FC<Props> = () => {
)}
/>
<BlockableLink
className='cancel-button'
className='btn btn-tertiary'
to='/admin_console/billing/company_info'
>
<FormattedMessage

22
webapp/channels/src/components/admin_console/billing/plan_details/plan_details.scss
Просмотреть файл

@@ -33,28 +33,6 @@
.PlanDetails__viewPlansButton {
display: block;
margin-left: auto;
&.btn {
padding: 11px 16px;
border-radius: 4px;
background: variables.$primary-color;
color: variables.$white;
font-size: 12px;
font-weight: bold;
line-height: 9.5px;
&:focus,
&:active,
&:focus:active {
border-color: transparent;
outline: none;
}
&.btn-secondary {
background: rgba(var(--button-bg-rgb), 0.08);
color: var(--button-bg);
}
}
}
.PlanDetails__planName {

4
webapp/channels/src/components/admin_console/data_retention_settings/custom_policy_form/__snapshots__/custom_policy_form.test.tsx.snap
Просмотреть файл

@@ -255,7 +255,7 @@ exports[`components/admin_console/data_retention_settings/custom_policy_form sho
saving={false}
/>
<Connect(Component)
className="cancel-button"
className="btn btn-tertiary"
to="/admin_console/compliance/data_retention_settings"
>
<MemoizedFormattedMessage
@@ -519,7 +519,7 @@ exports[`components/admin_console/data_retention_settings/custom_policy_form sho
saving={false}
/>
<Connect(Component)
className="cancel-button"
className="btn btn-tertiary"
to="/admin_console/compliance/data_retention_settings"
>
<MemoizedFormattedMessage

2
webapp/channels/src/components/admin_console/data_retention_settings/custom_policy_form/custom_policy_form.tsx
Просмотреть файл

@@ -537,7 +537,7 @@ export default class CustomPolicyForm extends React.PureComponent<Props, State>
)}
/>
<BlockableLink
className='cancel-button'
className='btn btn-tertiary'
to='/admin_console/compliance/data_retention_settings'
>
<FormattedMessage

2
webapp/channels/src/components/admin_console/data_retention_settings/global_policy_form/__snapshots__/global_policy_form.test.tsx.snap
Просмотреть файл

@@ -252,7 +252,7 @@ exports[`components/PluginManagement should match snapshot 1`] = `
saving={false}
/>
<Connect(Component)
className="cancel-button"
className="btn btn-tertiary"
to="/admin_console/compliance/data_retention_settings"
>
<MemoizedFormattedMessage

2
webapp/channels/src/components/admin_console/data_retention_settings/global_policy_form/global_policy_form.tsx
Просмотреть файл

@@ -273,7 +273,7 @@ export default class GlobalPolicyForm extends React.PureComponent<Props, State>
)}
/>
<BlockableLink
className='cancel-button'
className='btn btn-tertiary'
to='/admin_console/compliance/data_retention_settings'
>
<FormattedMessage

41
webapp/channels/src/components/admin_console/feature_discovery/feature_discovery.scss
Просмотреть файл

@@ -40,44 +40,3 @@
font-size: 14px;
line-height: 20px;
}
.FeatureDiscovery .btn {
width: 160px;
height: 48px;
padding: 14px 0;
border-radius: 4px;
margin-right: 8px;
background: variables.$primary-color;
color: variables.$white;
font-size: 16px;
font-weight: 400;
line-height: 16px;
&:focus,
&:active,
&:focus:active {
border-color: transparent;
outline: none;
}
&:disabled {
border-color: transparent;
background: variables.$light-gray;
color: variables.$dark-gray;
}
&.btn-inactive {
background: rgba(var(--center-channel-color-rgb), 0.08);
color: rgba(var(--center-channel-color-rgb), 0.75);
}
&.btn-secondary {
border: 1px solid variables.$primary-color;
background: variables.$white;
color: variables.$primary-color;
}
&.btn-primary {
width: 190px;
}
}

4
webapp/channels/src/components/admin_console/feature_discovery/feature_discovery.tsx
Просмотреть файл

@@ -92,7 +92,7 @@ export default class FeatureDiscovery extends React.PureComponent<Props, State>
return (
<div className='purchase-card'>
<button
className='btn btn-primary'
className='btn btn-primary btn-lg'
data-testid='featureDiscovery_primaryCallToAction'
onClick={() => {
trackEvent(TELEMETRY_CATEGORIES.SELF_HOSTED_ADMIN, 'click_enterprise_contact_sales_feature_discovery');
@@ -106,7 +106,7 @@ export default class FeatureDiscovery extends React.PureComponent<Props, State>
</button>
<ExternalLink
location='feature_discovery'
className='btn btn-secondary'
className='btn btn-tertiary btn-lg'
href={learnMoreURL}
data-testid='featureDiscovery_secondaryCallToAction'
>

46
webapp/channels/src/components/admin_console/ip_filtering/add_edit_ip_filter_modal.scss
Просмотреть файл

@@ -140,29 +140,6 @@
.buttons {
margin-top: 32px;
text-align: right;
.confirm-btn {
&:hover,
&:active,
&:focus,
&:active:focus {
background:
linear-gradient(0deg, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.16)),
var(--button-bg);
}
height: 40px;
flex: none;
padding: 12px 20px;
border: none;
border-radius: 4px;
margin-left: 8px;
background: var(--button-bg);
color: var(--sys-button-color);
font-size: 14px;
font-weight: 600;
line-height: 14px;
}
}
}
@@ -175,28 +152,5 @@
font-style: normal;
font-weight: 600;
line-height: 20px;
.btn-cancel {
padding: 10px 20px;
border: none;
border-radius: 4px;
background: var(--button-bg-8, rgba(28, 88, 217, 0.08));
color: var(--button-bg, #1c58d9);
}
.btn-save {
&:disabled {
background: rgba(63, 67, 80, 0.08);
color: rgba(63, 67, 80, 0.32);
cursor: not-allowed;
}
padding: 10px 20px;
border: none;
border-radius: 4px;
margin-left: 8px;
background: var(--button-bg, #1c58d9);
color: var(--button-color, #fff);
}
}
}

4
webapp/channels/src/components/admin_console/ip_filtering/add_edit_ip_filter_modal.tsx
Просмотреть файл

@@ -126,7 +126,7 @@ export default function IPFilteringAddOrEditModal({onExited, onSave, existingRan
<Modal.Footer>
<button
type='button'
className='btn-cancel'
className='btn btn-tertiary'
onClick={onExited}
>
{formatMessage({id: 'admin.ip_filtering.cancel', defaultMessage: 'Cancel'})}
@@ -134,7 +134,7 @@ export default function IPFilteringAddOrEditModal({onExited, onSave, existingRan
<button
data-testid='save-add-edit-button'
type='button'
className='btn-save'
className='btn btn-primary'
onClick={handleSave}
disabled={Boolean(CIDRError) || !CIDR.length || !name.length}
>

17
webapp/channels/src/components/admin_console/ip_filtering/delete_confirmation.scss
Просмотреть файл

@@ -88,22 +88,5 @@
font-style: normal;
font-weight: 600;
line-height: 20px;
.btn-cancel {
padding: 10px 20px;
border: none;
border-radius: 4px;
background: var(--button-bg-8, rgba(28, 88, 217, 0.08));
color: var(--button-bg, #1c58d9);
}
.btn-delete {
padding: 10px 20px;
border: none;
border-radius: 4px;
margin-left: 8px;
background: var(--do-not-disturb-indicator, #d24b4e);
color: var(--button-color, #fff);
}
}
}

4
webapp/channels/src/components/admin_console/ip_filtering/delete_confirmation.tsx
Просмотреть файл

@@ -41,14 +41,14 @@ export default function DeleteConfirmationModal({onExited, onConfirm, filterToDe
<Modal.Footer>
<button
type='button'
className='btn-cancel'
className='btn btn-tertiary'
onClick={onExited}
>
{formatMessage({id: 'admin.ip_filtering.cancel', defaultMessage: 'Cancel'})}
</button>
<button
type='button'
className='btn-delete'
className='btn btn-primary btn-danger'
onClick={() => onConfirm?.(filterToDelete!)}
>
{formatMessage({id: 'admin.ip_filtering.delete_filter', defaultMessage: 'Delete filter'})}

2
webapp/channels/src/components/admin_console/ip_filtering/edit_section/edit_section_header.tsx
Просмотреть файл

@@ -45,7 +45,7 @@ const EditSectionHeader = ({
</div>
<div className='AddIPFilterButton'>
<button
className='Button'
className='btn btn-primary'
onClick={() => {
setShowAddModal(true);
}}

2
webapp/channels/src/components/admin_console/ip_filtering/edit_section/edit_section_ip_not_in_range_panel.tsx
Просмотреть файл

@@ -33,7 +33,7 @@ const IPNotInRangeErrorPanel = ({
defaultMessage='Include your IP address in at least one of the rules below to continue.'
/>
<div
className='Button'
className='btn btn-primary'
onClick={() => setShowAddModal(true)}
>
<FormattedMessage

2
webapp/channels/src/components/admin_console/ip_filtering/edit_section/edit_section_no_filters_panel.tsx
Просмотреть файл

@@ -32,7 +32,7 @@ const NoFiltersPanel = ({setShowAddModal}: NoFiltersPanelProps) => (
add: (msg) => (
<div
onClick={() => setShowAddModal(true)}
className='Button'
className='btn btn-primary'
>
{msg}
</div>

17
webapp/channels/src/components/admin_console/ip_filtering/save_confirmation_modal.scss
Просмотреть файл

@@ -144,22 +144,5 @@
font-style: normal;
font-weight: 600;
line-height: 20px;
.btn-cancel {
padding: 10px 20px;
border: none;
border-radius: 4px;
background: var(--button-bg-8, rgba(28, 88, 217, 0.08));
color: var(--button-bg, #1c58d9);
}
.btn-delete {
padding: 10px 20px;
border: none;
border-radius: 4px;
margin-left: 8px;
background: var(--do-not-disturb-indicator, #d24b4e);
color: var(--button-color, #fff);
}
}
}

4
webapp/channels/src/components/admin_console/ip_filtering/save_confirmation_modal.tsx
Просмотреть файл

@@ -67,7 +67,7 @@ export default function SaveConfirmationModal({onExited, onConfirm, title, subti
<Modal.Footer>
<button
type='button'
className='btn-cancel'
className='btn btn-tertiary'
onClick={onExited}
>
{formatMessage({id: 'admin.ip_filtering.cancel', defaultMessage: 'Cancel'})}
@@ -75,7 +75,7 @@ export default function SaveConfirmationModal({onExited, onConfirm, title, subti
<button
data-testid='save-confirmation-button'
type='button'
className='btn-delete'
className='btn btn-primary btn-danger'
onClick={() => onConfirm?.()}
>
{buttonText}

41
webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition.scss
Просмотреть файл

@@ -1,6 +1,4 @@
.EnterpriseEditionRightPannel {
font-family: Metropolis;
.svg-image {
text-align: center;
@@ -12,6 +10,7 @@
.upgrade-title {
margin: 10px 0;
color: #3f4350;
font-family: Metropolis, sans-serif;
font-size: 16px;
font-weight: 700;
line-height: 24px;
@@ -37,18 +36,11 @@
button {
width: 100%;
border-radius: 4px;
margin: 5px auto;
}
.purchase_buttons {
margin-top: 20px;
button {
height: 48px !important;
padding: 7px 12px !important;
margin: 0 5px !important;
}
}
.upgrade-error {
@@ -57,16 +49,10 @@
}
.EnterpriseEditionLeftPanel {
font-family: Metropolis;
&__Grid {
display: flex;
}
.PlanDetails__viewPlansButton {
height: 33px;
}
.pre-title {
margin-bottom: 10px;
color: rgba(63, 67, 80, 0.75) !important;
@@ -78,6 +64,7 @@
.title {
display: flex;
color: #3f4350;
font-family: Metropolis, sans-serif;
font-size: 18px;
font-weight: 700;
gap: 4px;
@@ -91,7 +78,6 @@
.license-notices {
font-size: 12px;
text-align: justify;
}
.licenseInformation {
@@ -111,13 +97,6 @@
display: inline-block;
color: #3f4350;
}
.add-seats-button {
border-radius: 4px;
font-family: 'Open Sans', sans-serif;
font-size: 12px;
font-weight: 600;
}
}
.licenseElements {
@@ -171,22 +150,6 @@
}
}
}
.add-new-licence-btn {
display: block;
padding: 12px 20px;
border: 1px solid var(--sys-button-bg);
border-radius: 4px;
margin-top: 15px;
background-color: var(--sys-center-channel-bg);
color: var(--sys-button-bg);
span {
font-size: 14px;
font-weight: 600;
line-height: 14px;
}
}
}
#remove-button {

6
webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition_left_panel.tsx
Просмотреть файл

@@ -77,7 +77,7 @@ const EnterpriseEditionLeftPanel = ({
<button
id='enterprise_edition_view_plans'
onClick={() => openPricingModal({trackingLocation: 'license_settings_view_plans'})}
className='btn btn-secondary PlanDetails__viewPlansButton'
className='btn btn-tertiary btn-sm PlanDetails__viewPlansButton'
>
{formatMessage({
id: 'workspace_limits.menu_limit.view_plans',
@@ -127,7 +127,7 @@ const EnterpriseEditionLeftPanel = ({
<div className='license-details-top'>
<span className='title'>{'License details'}</span>
<button
className='add-seats-button btn btn-primary'
className='btn btn-primary btn-sm add-seats-button '
onClick={openContactSales}
>
<FormattedMessage
@@ -297,7 +297,7 @@ const renderAddNewLicenseButton = (
return (
<>
<button
className='add-new-licence-btn'
className='btn btn-tertiary add-new-licence-btn'
onClick={() => fileInputRef.current?.click()}
>
<FormattedMessage

1
webapp/channels/src/components/admin_console/license_settings/enterprise_edition/enterprise_edition_right_panel.tsx
Просмотреть файл

@@ -83,7 +83,6 @@ const EnterpriseEditionRightPanel = ({
<div className='purchase-card'>
<ContactUsButton
eventID='post_trial_contact_sales'
customClass='light-blue-btn'
/>
</div>
);

13
webapp/channels/src/components/admin_console/license_settings/license_settings.scss
Просмотреть файл

@@ -45,17 +45,12 @@
}
}
.light-blue-btn {
height: 40px;
padding: 10px 24px !important;
border: none !important;
background: rgba(28, 88, 217, 0.08) !important;
color: #1c58d9 !important;
font-weight: 700;
}
.admin-console__banner_section {
margin-bottom: 20px;
&:empty {
margin-bottom: 0px;
}
}
.current-plan-legend {

2
webapp/channels/src/components/admin_console/license_settings/modals/confirm_license_removal_modal.tsx
Просмотреть файл

@@ -79,7 +79,7 @@ const ConfirmLicenseRemovalModal: React.FC<Props> = (props: Props): JSX.Element
<div className='content-footer'>
<button
onClick={handleOnClose}
className='btn light-blue-btn'
className='btn btn-tertiary'
id='cancel-removal'
>
<FormattedMessage

83
webapp/channels/src/components/admin_console/license_settings/renew_license_card/renew_license_card.scss
Просмотреть файл

@@ -1,4 +1,44 @@
.RenewLicenseCard {
&__buttons {
display: flex;
}
&__text {
&-title {
margin-bottom: 5px;
color: var(--sys-sidebar-text-active-border);
font-family: 'Open Sans', sans-serif;
font-size: 18px;
font-weight: 600;
line-height: 24px;
&.critical {
color: var(--sys-error-text);
}
}
&-description {
margin-bottom: 5px;
color: var(--sys-center-channel-color);
font-family: 'Open Sans', sans-serif;
font-size: 14px;
line-height: 30px;
&.bolder {
font-weight: 600;
}
}
}
&__licensedUsersNum,
&__activeUsersNum {
display: inline-block;
}
&__activeUsersNum {
margin-left: 25px;
}
.annnouncementBar__purchaseNow {
display: block;
padding: 12px 20px;
@@ -15,43 +55,10 @@
}
}
&__buttons {
display: flex;
&__alertBanner {
padding: 12px 20px;
border: 1px solid rgba(var(--error-text-color-rgb), 0.16);
margin-top: 4px;
background: rgba(var(--error-text-color-rgb), 0.08);
}
}
.RenewLicenseCard__text-title {
margin-bottom: 5px;
color: var(--sys-sidebar-text-active-border);
font-family: Open Sans;
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: 24px;
&.critical {
color: var(--sys-error-text);
}
}
.RenewLicenseCard__text-description {
margin-bottom: 5px;
color: var(--sys-center-channel-color);
font-family: Open Sans;
font-size: 14px;
font-style: normal;
line-height: 30px;
&.bolder {
font-weight: 600;
}
}
.RenewLicenseCard__licensedUsersNum {
display: inline-block;
}
.RenewLicenseCard__activeUsersNum {
display: inline-block;
margin-left: 25px;
}

2
webapp/channels/src/components/admin_console/license_settings/renew_license_card/renew_license_card.tsx
Просмотреть файл

@@ -29,7 +29,7 @@ const RenewLicenseCard: React.FC<RenewLicenseCardProps> = ({license, totalUsers,
<div className='purchase-card'>
<ContactUsButton
eventID='post_trial_contact_sales'
customClass='light-blue-btn'
customClass='btn-primary'
/>
</div>
);

24
webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_edition.scss
Просмотреть файл

@@ -43,21 +43,6 @@
justify-content: center;
margin-top: 20px;
button {
width: 120px;
padding: 14px 12px !important;
border-radius: 4px;
span {
font-size: 16px !important;
}
&.contact-us {
width: 130px;
margin-left: 0px !important;
}
}
@media screen and (max-width: 1130px) {
flex-direction: column;
@@ -85,10 +70,6 @@
right: 10px;
display: block;
margin-left: auto;
&.btn {
@include mixins.tertiary-button;
}
}
.pre-title {
@@ -137,11 +118,6 @@
display: hidden;
}
button {
height: 48px;
border-radius: 4px;
}
.help-text {
font-size: 12px;
}

4
webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_left_panel.tsx
Просмотреть файл

@@ -36,7 +36,7 @@ const StarterLeftPanel: React.FC<StarterEditionProps> = ({
<button
id='starter_edition_view_plans'
onClick={() => openPricingModal({trackingLocation: 'license_settings_view_plans'})}
className='btn btn-secondary PlanDetails__viewPlansButton'
className='btn btn-tertiary btn-sm PlanDetails__viewPlansButton'
>
{intl.formatMessage({
id: 'workspace_limits.menu_limit.view_plans',
@@ -95,7 +95,7 @@ const StarterLeftPanel: React.FC<StarterEditionProps> = ({
</div>
<div className='uploadButtons'>
<button
className='btn btn-upload light-blue-btn'
className='btn btn-primary'
onClick={() => fileInputRef.current?.click()}
id='open-modal'
>

1
webapp/channels/src/components/admin_console/license_settings/starter_edition/starter_right_panel.tsx
Просмотреть файл

@@ -70,6 +70,7 @@ const StarterRightPanel = () => {
<div className='purchase_buttons'>
<ContactUsButton
eventID='post_trial_contact_sales'
customClass='btn-tertiary btn-full'
/>
</div>
</div>

6
webapp/channels/src/components/admin_console/license_settings/trial_license_card/trial_license_card.scss
Просмотреть файл

@@ -12,10 +12,7 @@
.RenewLicenseCard__buttons {
.contact_us_primary_cta {
padding: 6px 12px;
margin-left: 0px;
background-color: var(--sys-button-bg);
color: var(--sys-center-channel-bg);
}
}
@@ -29,7 +26,4 @@
margin-top: 0;
}
button.contact-us {
padding: 11px 19px;
}
}

2
webapp/channels/src/components/admin_console/license_settings/trial_license_card/trial_license_card.tsx
Просмотреть файл

@@ -59,7 +59,7 @@ const TrialLicenseCard: React.FC<Props> = ({license}: Props) => {
</div>
<div className='RenewLicenseCard__buttons'>
<ContactUsButton
customClass='contact_us_primary_cta'
customClass='btn-sm btn-primary'
/>
</div>
</div>

4
webapp/channels/src/components/admin_console/permission_schemes_settings/permission_system_scheme_settings/__snapshots__/permission_system_scheme_settings.test.tsx.snap
Просмотреть файл

@@ -439,6 +439,7 @@ exports[`components/admin_console/permission_schemes_settings/permission_system_
/>
<Connect(Component)
className="btn btn-tertiary"
data-testid="permission-scheme-cancel-button"
to="/admin_console/user_management/permissions"
>
<MemoizedFormattedMessage
@@ -789,6 +790,7 @@ exports[`components/admin_console/permission_schemes_settings/permission_system_
/>
<Connect(Component)
className="btn btn-tertiary"
data-testid="permission-scheme-cancel-button"
to="/admin_console/user_management/permissions"
>
<MemoizedFormattedMessage
@@ -1139,6 +1141,7 @@ exports[`components/admin_console/permission_schemes_settings/permission_system_
/>
<Connect(Component)
className="btn btn-tertiary"
data-testid="permission-scheme-cancel-button"
to="/admin_console/user_management/permissions"
>
<MemoizedFormattedMessage
@@ -1489,6 +1492,7 @@ exports[`components/admin_console/permission_schemes_settings/permission_system_
/>
<Connect(Component)
className="btn btn-tertiary"
data-testid="permission-scheme-cancel-button"
to="/admin_console/user_management/permissions"
>
<MemoizedFormattedMessage

1
webapp/channels/src/components/admin_console/permission_schemes_settings/permission_system_scheme_settings/permission_system_scheme_settings.tsx
Просмотреть файл

@@ -538,6 +538,7 @@ class PermissionSystemSchemeSettings extends React.PureComponent<Props, State> {
<BlockableLink
className='btn btn-tertiary'
to='/admin_console/user_management/permissions'
data-testid='permission-scheme-cancel-button'
>
<FormattedMessage
id='admin.permissions.permissionSchemes.cancel'

15
webapp/channels/src/components/admin_console/permission_schemes_settings/permission_team_scheme_settings/__snapshots__/permission_team_scheme_settings.test.tsx.snap
Просмотреть файл

@@ -345,7 +345,8 @@ exports[`components/admin_console/permission_schemes_settings/permission_team_sc
}
/>
<Connect(Component)
className="cancel-button"
className="btn btn-tertiary"
data-testid="permission-scheme-cancel-button"
to="/admin_console/user_management/permissions"
>
<MemoizedFormattedMessage
@@ -751,7 +752,8 @@ exports[`components/admin_console/permission_schemes_settings/permission_team_sc
}
/>
<Connect(Component)
className="cancel-button"
className="btn btn-tertiary"
data-testid="permission-scheme-cancel-button"
to="/admin_console/user_management/permissions"
>
<MemoizedFormattedMessage
@@ -1159,7 +1161,8 @@ exports[`components/admin_console/permission_schemes_settings/permission_team_sc
}
/>
<Connect(Component)
className="cancel-button"
className="btn btn-tertiary"
data-testid="permission-scheme-cancel-button"
to="/admin_console/user_management/permissions"
>
<MemoizedFormattedMessage
@@ -1569,7 +1572,8 @@ exports[`components/admin_console/permission_schemes_settings/permission_team_sc
}
/>
<Connect(Component)
className="cancel-button"
className="btn btn-tertiary"
data-testid="permission-scheme-cancel-button"
to="/admin_console/user_management/permissions"
>
<MemoizedFormattedMessage
@@ -2045,7 +2049,8 @@ exports[`components/admin_console/permission_schemes_settings/permission_team_sc
}
/>
<Connect(Component)
className="cancel-button"
className="btn btn-tertiary"
data-testid="permission-scheme-cancel-button"
to="/admin_console/user_management/permissions"
>
<MemoizedFormattedMessage

3
webapp/channels/src/components/admin_console/permission_schemes_settings/permission_team_scheme_settings/permission_team_scheme_settings.tsx
Просмотреть файл

@@ -816,8 +816,9 @@ export default class PermissionTeamSchemeSettings extends React.PureComponent<Pr
}
/>
<BlockableLink
className='cancel-button'
className='btn btn-tertiary'
to='/admin_console/user_management/permissions'
data-testid='permission-scheme-cancel-button'
>
<FormattedMessage
id='admin.permissions.permissionSchemes.cancel'

4
webapp/channels/src/components/admin_console/workspace-optimization/__snapshots__/cta_buttons.test.tsx.snap
Просмотреть файл

@@ -5,13 +5,13 @@ exports[`components/admin_console/workspace-optimization/cta_buttons should matc
className="ctaButtons"
>
<button
className="actionButton annnouncementBar__purchaseNow"
className="btn btn-primary btn-sm actionButton annnouncementBar__purchaseNow"
onClick={[Function]}
>
Action Text
</button>
<button
className="learnMoreButton light-blue-btn"
className="btn btn-tertiary btn-sm learnMoreButton"
onClick={[Function]}
>
Learn More

4
webapp/channels/src/components/admin_console/workspace-optimization/cta_buttons.tsx
Просмотреть файл

@@ -50,7 +50,7 @@ const CtaButtons = ({
<div className='ctaButtons'>
{(actionLink || actionButtonCallback) && actionText && (
<button
className='actionButton annnouncementBar__purchaseNow'
className='btn btn-primary btn-sm actionButton annnouncementBar__purchaseNow'
onClick={getClickHandler('cta', actionLink)}
>
{actionText}
@@ -58,7 +58,7 @@ const CtaButtons = ({
)}
{learnMoreLink && learnMoreText && (
<button
className='learnMoreButton light-blue-btn'
className='btn btn-tertiary btn-sm learnMoreButton'
onClick={getClickHandler('learn-more', learnMoreLink)}
>
{learnMoreText}

18
webapp/channels/src/components/announcement_bar/contact_sales/contact_us.scss
Просмотреть файл

@@ -1,18 +0,0 @@
@use 'utils/variables';
.contact-us {
display: block;
padding: 12px 20px;
border: 1px solid var(--sys-button-bg);
border-radius: 4px;
margin-top: 15px;
margin-left: 10px;
background-color: var(--sys-center-channel-bg);
color: var(--sys-button-bg);
span {
font-size: 14px;
font-weight: 600;
line-height: 14px;
}
}

4
webapp/channels/src/components/announcement_bar/contact_sales/contact_us.tsx
Просмотреть файл

@@ -8,8 +8,6 @@ import {trackEvent} from 'actions/telemetry_actions';
import useOpenSalesLink from 'components/common/hooks/useOpenSalesLink';
import './contact_us.scss';
export interface Props {
buttonTextElement?: JSX.Element;
eventID?: string;
@@ -27,7 +25,7 @@ const ContactUsButton: React.FC<Props> = (props: Props) => {
return (
<button
className={`contact-us ${props.customClass ? props.customClass : ''}`}
className={`btn contact-us ${props.customClass || 'btn-tertiary'}`}
onClick={(e) => handleContactUsLinkClick(e)}
>
{props.buttonTextElement || (

2
webapp/channels/src/components/announcement_bar/default_announcement_bar/announcement_bar.tsx
Просмотреть файл

@@ -174,6 +174,7 @@ export default class AnnouncementBar extends React.PureComponent<Props, State> {
<button
onClick={this.props.onButtonClick}
disabled={this.props.ctaDisabled}
className='btn btn-tertiary btn-xs btn-inverted'
>
<FormattedMessage
{...this.props.modalButtonText}
@@ -185,6 +186,7 @@ export default class AnnouncementBar extends React.PureComponent<Props, State> {
<button
onClick={this.props.onButtonClick}
disabled={this.props.ctaDisabled}
className='btn btn-tertiary btn-xs btn-inverted'
>
{this.props.ctaText}
</button>

8
webapp/channels/src/components/announcement_bar/notification_permission_bar/__snapshots__/index.test.tsx.snap
Просмотреть файл

@@ -14,7 +14,9 @@ exports[`NotificationPermissionBar should render the NotificationPermissionNever
<span>
We need your permission to show notifications in the browser.
</span>
<button>
<button
class="btn btn-tertiary btn-xs btn-inverted"
>
Manage notification preferences
</button>
</div>
@@ -42,7 +44,9 @@ exports[`NotificationPermissionBar should render the NotificationUnsupportedBar
<span>
Your browser does not support browser notifications.
</span>
<button>
<button
class="btn btn-tertiary btn-xs btn-inverted"
>
Update your browser
</button>
</div>

11
webapp/channels/src/components/announcement_bar/purchase_link/purchase_link.scss
Просмотреть файл

@@ -2,16 +2,5 @@
.annnouncementBar__purchaseNow {
display: block;
padding: 12px 20px;
border: none;
border-radius: 4px;
margin-top: 15px;
background: var(--sys-button-bg);
color: var(--sys-button-color);
span {
font-size: 14px;
font-weight: 600;
line-height: 14px;
}
}

2
webapp/channels/src/components/announcement_bar/purchase_link/purchase_link.tsx
Просмотреть файл

@@ -27,7 +27,7 @@ const PurchaseLink: React.FC<Props> = (props: Props) => {
return (
<button
id={props.eventID}
className={'annnouncementBar__purchaseNow'}
className={'btn btn-primary btn-lg announcementBar__purchaseNow'}
onClick={handlePurchaseLinkClick}
>
{props.buttonTextElement}

2
webapp/channels/src/components/copy_text.tsx
Просмотреть файл

@@ -33,7 +33,7 @@ const CopyText = ({
<WithTooltip title={label}>
<button
data-testid='copyText'
className='btn btn-link fa fa-copy ml-2'
className='btn btn-link icon-content-copy ml-2'
aria-label={intl.formatMessage(label)}
onClick={copyText}
/>

2
webapp/channels/src/components/emoji_picker/components/emoji_picker_custom_emoji_button.tsx
Просмотреть файл

@@ -28,7 +28,7 @@ function EmojiPickerCustomEmojiButton({customEmojisEnabled, currentTeamName, onC
<AnyTeamPermissionGate permissions={[Permissions.CREATE_EMOJIS]}>
<div className='emoji-picker__custom'>
<Link
className='btn btn-tertiary'
className='btn btn-tertiary btn-sm'
to={`/${currentTeamName}/emoji`}
onClick={onClick}
>

2
webapp/channels/src/components/start_trial_form_modal/__snapshots__/start_trial_form_modal.test.tsx.snap
Просмотреть файл

@@ -352,7 +352,7 @@ Object {
class="buttons"
>
<button
class="confirm-btn btn btn-default"
class="btn btn-primary btn btn-default"
disabled=""
type="button"
>

23
webapp/channels/src/components/start_trial_form_modal/air_gapped_modal.scss
Просмотреть файл

@@ -89,29 +89,6 @@
.buttons {
margin-top: 32px;
text-align: right;
.confirm-btn {
&:hover,
&:active,
&:focus,
&:active:focus {
background:
linear-gradient(0deg, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.16)),
var(--button-bg);
}
height: 40px;
flex: none;
padding: 12px 20px;
border: none;
border-radius: 4px;
margin-left: 8px;
background: var(--button-bg);
color: var(--sys-button-color);
font-size: 14px;
font-weight: 600;
line-height: 14px;
}
}
}
}

2
webapp/channels/src/components/start_trial_form_modal/air_gapped_modal.tsx
Просмотреть файл

@@ -62,7 +62,7 @@ function AirGappedModal({onClose}: Props) {
</div>
<div className='buttons'>
<Button
className='confirm-btn'
className='btn btn-primary'
onClick={() => onClose?.()}
>
{formatMessage({id: 'air_gapped_modal.close', defaultMessage: 'Close'})}

2
webapp/channels/src/components/start_trial_form_modal/index.tsx
Просмотреть файл

@@ -361,7 +361,7 @@ function StartTrialFormModal(props: Props): JSX.Element | null {
<div className='buttons'>
<Button
disabled={isSubmitDisabled}
className='confirm-btn'
className='btn btn-primary'
onClick={requestLicense}
>
{btnText(status)}

23
webapp/channels/src/components/start_trial_form_modal/start_trial_form_modal.scss
Просмотреть файл

@@ -141,29 +141,6 @@
.buttons {
margin-top: 32px;
text-align: right;
.confirm-btn {
&:hover,
&:active,
&:focus,
&:active:focus {
background:
linear-gradient(0deg, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.16)),
var(--button-bg);
}
height: 40px;
flex: none;
padding: 12px 20px;
border: none;
border-radius: 4px;
margin-left: 8px;
background: var(--button-bg);
color: var(--sys-button-color);
font-size: 14px;
font-weight: 600;
line-height: 14px;
}
}
}

61
webapp/channels/src/components/widgets/modals/components/save_changes_panel.scss
Просмотреть файл

@@ -74,7 +74,6 @@
display: flex;
flex: 1 1 auto;
justify-content: flex-end;
gap: 8px;
#panelCloseButton {
color: rgba(var(--button-color-rgb), 0.64);
@@ -83,52 +82,32 @@
}
&__cancel-btn {
display: flex;
min-width: 64px;
height: 32px;
align-items: center;
padding: 10px 16px;
border: none;
border-radius: 4px;
background: rgba(var(--button-bg-rgb), 0.08);
color: var(--button-bg);
font-family: inherit;
font-size: 12px;
font-weight: 600;
gap: 10px;
line-height: 10px;
&.btn {
&.error {
background: rgba(var(--button-color-rgb), 0.12);
color: var(--button-color);
&.error {
background: rgba(var(--button-color-rgb), 0.12);
color: var(--button-color);
&:hover {
background-color: rgba(var(--button-color-rgb), 0.16);
}
}
}
}
&__save-btn {
display: flex;
min-width: 59px;
height: 32px;
flex-direction: column;
align-items: center;
padding: 10px 16px;
border: none;
border-radius: 4px;
background: var(--button-bg);
color: var(--button-color);
font-family: inherit;
font-size: 12px;
font-weight: 600;
gap: 10px;
line-height: 10px;
&.btn {
&.error {
background-color: var(--button-color);
color: var(--dnd-indicator);
&.error {
background-color: var(--button-color);
color: var(--button-bg);
}
&:hover {
background-color: rgba(var(--button-color-rgb), 0.9);
}
&:disabled {
background: var(--center-channel-bg);
opacity: 0.32;
}
&:disabled {
background: rgba(var(--button-color-rgb), 0.16);
}
}
}
}
}

4
webapp/channels/src/components/widgets/modals/components/save_changes_panel.tsx
Просмотреть файл

@@ -35,8 +35,8 @@ function SaveChangesPanel({
}: Props) {
const panelClassName = classNames('SaveChangesPanel', {error: tabChangeError || state === 'error'}, {saved: state === 'saved'});
const messageClassName = classNames('SaveChangesPanel__message', {error: tabChangeError || state === 'error'}, {saved: state === 'saved'});
const cancelButtonClassName = classNames('SaveChangesPanel__cancel-btn', {error: tabChangeError || state === 'error'}, {saved: state === 'saved'});
const saveButtonClassName = classNames('SaveChangesPanel__save-btn', {error: tabChangeError || state === 'error'}, {saved: state === 'saved'});
const cancelButtonClassName = classNames('btn btn-tertiary btn-sm SaveChangesPanel__cancel-btn', {error: tabChangeError || state === 'error'}, {saved: state === 'saved'});
const saveButtonClassName = classNames('btn btn-primary btn-sm SaveChangesPanel__save-btn', {error: tabChangeError || state === 'error'}, {saved: state === 'saved'});
useEffect(() => {
let timeoutId: NodeJS.Timeout;

22
webapp/channels/src/sass/components/_announcement-bar.scss
Просмотреть файл

@@ -91,23 +91,13 @@
font-size: 16px;
}
button {
&:hover {
background-color: rgba(255, 255, 255, 0.08);
}
.btn.btn-tertiary.btn-xs.btn-inverted {
background-color: rgba(variables.$white, 0.16);
color: variables.$white;
height: 24px;
box-sizing: border-box;
padding: 4px 8px;
border: 1px solid #fff;
border-radius: 4px;
margin-left: 8px;
background-color: inherit !important;
font-family: Open Sans;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 14px;
&:hover {
background-color: rgba(variables.$white, 0.24);
}
}
}

2
webapp/channels/src/sass/components/_buttons.scss
Просмотреть файл

@@ -157,7 +157,7 @@ button {
&.btn-xs {
height: 24px;
padding: 0 10px;
font-size: 11px;
font-size: 12px;
gap: 6px;
i {

8
webapp/platform/components/src/tour_tip/tour_tip.scss
Просмотреть файл

@@ -80,10 +80,6 @@ $z-index-tour-tips-backdrop: 1250;
&:focus {
box-shadow: inset 0 0 0 2px var(--sidebar-text-active-border);
}
.icon-chevron-right::before {
margin-right: -7px;
}
}
&.btn-tertiary {
@@ -101,10 +97,6 @@ $z-index-tour-tips-backdrop: 1250;
&:focus {
box-shadow: inset 0 0 0 2px var(--sidebar-text-active-border);
}
.icon-chevron-left::before {
margin-left: -7px;
}
}
&.btn-icon {