diff --git a/projects/js-packages/base-styles/changelog/pr-47317 b/projects/js-packages/base-styles/changelog/pr-47317 new file mode 100644 index 000000000000..2fe493f1ed78 --- /dev/null +++ b/projects/js-packages/base-styles/changelog/pr-47317 @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Remove unused `--jp-highlight` CSS variable. diff --git a/projects/js-packages/base-styles/root-variables.scss b/projects/js-packages/base-styles/root-variables.scss index 87296cf870f5..b5278f187d3f 100644 --- a/projects/js-packages/base-styles/root-variables.scss +++ b/projects/js-packages/base-styles/root-variables.scss @@ -73,6 +73,4 @@ --jp-button-radius: 4px; --jp-gap: 16px; - - --jp-highlight: #3858e9; } diff --git a/projects/js-packages/components/changelog/pr-47317 b/projects/js-packages/components/changelog/pr-47317 new file mode 100644 index 000000000000..53ebadb2b948 --- /dev/null +++ b/projects/js-packages/components/changelog/pr-47317 @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Button, ToggleControl: Remove Jetpack color overrides on core WordPress components. diff --git a/projects/js-packages/components/components/button/style.module.scss b/projects/js-packages/components/components/button/style.module.scss index 5c0976a34a15..fc27753f89d0 100644 --- a/projects/js-packages/components/components/button/style.module.scss +++ b/projects/js-packages/components/components/button/style.module.scss @@ -1,11 +1,4 @@ .button { - --wp-admin-theme-color: var(--jp-black); - --wp-admin-theme-color-darker-10: var(--jp-black-80); - --wp-admin-theme-color-darker-20: var(--jp-black-80); - // 1.51px to avoid subpixel rendering issues on Firefox/Linux - --wp-admin-border-width-focus: 1.51px; - - border-radius: var(--jp-border-radius); justify-content: center; font-weight: 600; diff --git a/projects/js-packages/components/components/toggle-control/styles.module.scss b/projects/js-packages/components/components/toggle-control/styles.module.scss index eb51633d6b3c..1c95c7cc72e0 100644 --- a/projects/js-packages/components/components/toggle-control/styles.module.scss +++ b/projects/js-packages/components/components/toggle-control/styles.module.scss @@ -17,7 +17,6 @@ :global { .components-form-toggle { - --wp-admin-theme-color: var(--jp-green-40); height: calc(var(--base-width) * 3); diff --git a/projects/packages/my-jetpack/_inc/style.module.scss b/projects/packages/my-jetpack/_inc/style.module.scss index 784bd30ec7b4..2fdb9cf55aae 100644 --- a/projects/packages/my-jetpack/_inc/style.module.scss +++ b/projects/packages/my-jetpack/_inc/style.module.scss @@ -11,9 +11,6 @@ } #my-jetpack-container { - --wp-admin-theme-color: var(--jp-black); - --wp-admin-theme-color-darker-10: var(--jp-black-80); - --wp-admin-theme-color-darker-20: var(--jp-black-80); height: 100%; .jp-dashboard-footer__jetpack-symbol { diff --git a/projects/packages/my-jetpack/changelog/pr-47317 b/projects/packages/my-jetpack/changelog/pr-47317 new file mode 100644 index 000000000000..8659f45eedd3 --- /dev/null +++ b/projects/packages/my-jetpack/changelog/pr-47317 @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Remove Jetpack color overrides on core WordPress components. diff --git a/projects/packages/publicize/_inc/components/admin-page/toggles/social-notes-toggle/styles.module.scss b/projects/packages/publicize/_inc/components/admin-page/toggles/social-notes-toggle/styles.module.scss index ec2f23cfa1a9..9f61ef693778 100644 --- a/projects/packages/publicize/_inc/components/admin-page/toggles/social-notes-toggle/styles.module.scss +++ b/projects/packages/publicize/_inc/components/admin-page/toggles/social-notes-toggle/styles.module.scss @@ -35,10 +35,6 @@ .components-base-control { - &__field { - --wp-admin-theme-color: var(--jp-green-40); - } - label.components-input-control__label { text-transform: none; font-weight: inherit; diff --git a/projects/packages/publicize/_inc/components/admin-page/toggles/styles.module.scss b/projects/packages/publicize/_inc/components/admin-page/toggles/styles.module.scss index e040d34a834c..2097f4dd1fc3 100644 --- a/projects/packages/publicize/_inc/components/admin-page/toggles/styles.module.scss +++ b/projects/packages/publicize/_inc/components/admin-page/toggles/styles.module.scss @@ -55,7 +55,6 @@ :global { .components-base-control__field { - --wp-admin-theme-color: var(--jp-green-40); margin-bottom: 0; .components-form-toggle { diff --git a/projects/packages/publicize/changelog/pr-47317 b/projects/packages/publicize/changelog/pr-47317 new file mode 100644 index 000000000000..90740c1e61bd --- /dev/null +++ b/projects/packages/publicize/changelog/pr-47317 @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Remove Jetpack color overrides on core toggle components. diff --git a/projects/packages/search/changelog/pr-47317 b/projects/packages/search/changelog/pr-47317 new file mode 100644 index 000000000000..550854c2551a --- /dev/null +++ b/projects/packages/search/changelog/pr-47317 @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Remove custom toggle color overrides to use native WordPress admin theme colors. diff --git a/projects/packages/search/src/dashboard/components/module-control/style.scss b/projects/packages/search/src/dashboard/components/module-control/style.scss index 0593571267f1..c0d2f6b72b59 100644 --- a/projects/packages/search/src/dashboard/components/module-control/style.scss +++ b/projects/packages/search/src/dashboard/components/module-control/style.scss @@ -4,10 +4,6 @@ $color-button-background: variables.$black; $color-button-text: variables.$white; $color-button-background-disabled: #dcdcde; $color-button-text-disabled: #a7aaad; -$toggle-dot-radius: 0.9375em; -$toggle-dot-padding: 0.1875em; -$toggle-height: 1.5em; -$toggle-width: 3em; .jp-form-search-settings-group { width: 100%; @@ -19,10 +15,6 @@ $toggle-width: 3em; padding-top: 4em; } - .form-toggle__label { - margin: 0; - } - &.jp-form-search-settings-group--disabled { &::after { @@ -114,51 +106,6 @@ p.jp-form-search-settings-group__toggle-explanation { } } -.form-toggle.is-search-admin.is-compact { - - + .form-toggle__switch { - border-radius: calc(#{$toggle-height}/ 2); - width: $toggle-width; - height: $toggle-height; - - &::before, - &::after { - width: $toggle-dot-radius; - height: $toggle-dot-radius; - background-color: variables.$black; - } - background: variables.$white; - border: 2px solid variables.$black; - - &:focus { - box-shadow: 0 0 0 2px variables.$blue-medium; - } - } - - &:checked { - - + .form-toggle__switch { - background: variables.$color-plan; - border-color: variables.$color-plan; - - &::after { - left: $toggle-height; - background-color: variables.$white; - } - } - } - - &.is-toggling + .form-toggle__switch::before, - &.is-toggling + .form-toggle__switch::after { - left: $toggle-height; - } - - &.is-toggling:checked + .form-toggle__switch::before, - &.is-toggling:checked + .form-toggle__switch::after { - left: 0; - } -} - .jp-search-dashboard-cut { position: relative; display: block; diff --git a/projects/packages/videopress/changelog/pr-47317 b/projects/packages/videopress/changelog/pr-47317 new file mode 100644 index 000000000000..0a387c5cf315 --- /dev/null +++ b/projects/packages/videopress/changelog/pr-47317 @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Video Thumbnail: Remove Jetpack color override on loading spinner. diff --git a/projects/packages/videopress/src/client/admin/components/video-thumbnail/style.module.scss b/projects/packages/videopress/src/client/admin/components/video-thumbnail/style.module.scss index f1fd9b3da07c..ea1e5486face 100644 --- a/projects/packages/videopress/src/client/admin/components/video-thumbnail/style.module.scss +++ b/projects/packages/videopress/src/client/admin/components/video-thumbnail/style.module.scss @@ -87,9 +87,6 @@ } .custom-thumbnail { - // Change spinner color - --wp-admin-theme-color: var(--jp-green-50); - display: flex; justify-content: center; align-items: center; diff --git a/projects/plugins/boost/app/assets/src/css/admin-banner.scss b/projects/plugins/boost/app/assets/src/css/admin-banner.scss index eacd26a41ef9..691c86154960 100644 --- a/projects/plugins/boost/app/assets/src/css/admin-banner.scss +++ b/projects/plugins/boost/app/assets/src/css/admin-banner.scss @@ -80,11 +80,7 @@ } &__cta-button { - background: #000; - border: 1px solid #000; - border-radius: 4px; box-sizing: border-box; - color: #fff; cursor: pointer; display: inline-block; font-size: 0.875rem; @@ -97,18 +93,6 @@ text-overflow: ellipsis; transition: all 0.15s ease-in-out; vertical-align: top; - - &:hover { - color: #fff; - background-color: variables.$gray_80; - } - - &:focus { - color: #fff; - box-shadow: none; - outline: solid 1px variables.$primary-black; - outline-offset: 1px; - } } .notice-dismiss { diff --git a/projects/plugins/boost/app/assets/src/css/main/wp-admin.scss b/projects/plugins/boost/app/assets/src/css/main/wp-admin.scss index ed736c4dab95..c9354efc8393 100644 --- a/projects/plugins/boost/app/assets/src/css/main/wp-admin.scss +++ b/projects/plugins/boost/app/assets/src/css/main/wp-admin.scss @@ -11,11 +11,6 @@ p { } // Override WordPress component styles .jb-dashboard { - --wp-admin-theme-color: #{variables.$jetpack_green_50}; - --wp-admin-theme-link-color: #{variables.$gray_90}; - --wp-admin-theme-color-darker-10: #{variables.$jetpack_green_60}; - --wp-admin-theme-color-darker-20: #{variables.$jetpack_green_70}; - --font-headline-medium: 48px; --font-title-medium: 24px; --font-body-small: 14px; @@ -74,25 +69,6 @@ p { font-size: 24px; } - button.secondary, - a.button-secondary { - color: variables.$primary-black; - background: none; - border: 1px solid variables.$primary-black; - padding: 8px 24px; - border-radius: 3px; - font-weight: 600; - cursor: pointer; - font-size: 16px; - line-height: 24px; - - &:hover { - background: variables.$gray_0; - border-color: variables.$primary-black; - color: variables.$primary-black; - } - } - // Override WP styles for panel header. .components-panel__body-title .components-button:hover:not(:disabled,[aria-disabled="true"]), .components-panel__body-title .components-button[aria-expanded="true"] { diff --git a/projects/plugins/boost/changelog/pr-47317 b/projects/plugins/boost/changelog/pr-47317 new file mode 100644 index 000000000000..01d2807526cd --- /dev/null +++ b/projects/plugins/boost/changelog/pr-47317 @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Remove Jetpack color overrides on core components, allowing them to use native WordPress admin theme colors. diff --git a/projects/plugins/protect/changelog/pr-47317 b/projects/plugins/protect/changelog/pr-47317 new file mode 100644 index 000000000000..8659f45eedd3 --- /dev/null +++ b/projects/plugins/protect/changelog/pr-47317 @@ -0,0 +1,4 @@ +Significance: patch +Type: changed + +Remove Jetpack color overrides on core WordPress components. diff --git a/projects/plugins/protect/src/js/styles.module.scss b/projects/plugins/protect/src/js/styles.module.scss index 082f39b0488f..2dc53446cd5b 100644 --- a/projects/plugins/protect/src/js/styles.module.scss +++ b/projects/plugins/protect/src/js/styles.module.scss @@ -5,11 +5,6 @@ } #jetpack-protect-root { - --wp-admin-theme-color: var(--jp-black); - --wp-admin-theme-color-darker-10: var(--jp-black-80); - --wp-admin-theme-color-darker-20: var(--jp-black-80); - // 1.51px to avoid subpixel rendering issues on Firefox/Linux - --wp-admin-border-width-focus: 1.51px; --actions-size: 28px; } }