Commit Graph

59 Commits

Author SHA1 Message Date
Tom Cafferkey 16ef869587
CYS: Revert Zoom Feature (#50535)
* Revert "CYS: E2E Tests for device and zoom toolbar (#50436)"

This reverts commit 94f6ec5ccc.

* Revert "CYS: Fix DeviceToolbar animation (#50411)"

This reverts commit f01e945204.

* Revert "CYS: Add Zoomed Out feature (#50070)"

This reverts commit a579e866b7.
2024-08-09 16:15:06 +01:00
Alba Rincón a5dba829c9
CYS - Update icon and text colors in the assembler (#50478)
* Customer Account - Maintain the size of the icon in smaller screens

* Hide overflow text

* Update logo and buttons color

* Add changefile(s) from automation for the following project(s): woocommerce

* Fix lint error

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-08-08 17:18:30 +02:00
Tom Cafferkey a579e866b7
CYS: Add Zoomed Out feature (#50070)
* useZoomOut hook

* Update iframe with logic with zoomed out feature

* Add back in styling code for margins

* Spaces to tabs

* Device size toolbar

* Move zoom out state to context

* Rename variable

* Fork iframe component from Gutenberg

* Add getCompatibilityStyles needed for forked iframe

* Update usePopoverHandler iframe selector

* Remove zoom out context as its not needed

* Revert "Remove zoom out context as its not needed"

This reverts commit b29780d805.

* Add Zoom Out toggle to icons WIP

* Fix icon fill

* Update selectors to fix toolbar and sidebar pattern bugs

* Add comment to get getCompatibilityStyles file

* Update iframe comment

* Move device toolbar into its own component

* Resize and device changes

* Add prop to disable the resize handler

* Update toolbar to work with Zoom Out

* Hide changes behind feature gate so they dont impact design with AI flow

* Toolbar account for top device bar

* Add body class for with/without AI flow

* Adds changelog

* Fix typo

* Change TS comment to expect error

* Cleanup iframe with unneeded code

* Remove getcompatibilitystyles

* Remove device code from resizable frame

* Add ? operator

* Remove keydown code from iframe

* Fix toolbar scroll

* Pass deviceType as a prop to resizable frame

* Disable devicetoolbar whilst editor is loading

* Disable focus state

* Remove comment

* not disabled selector for button hover states

* Fix linting

* Remove unused fn

* Focus specific styles
2024-08-06 14:29:21 +01:00
Luigi Teschio 2e54b88c26
CYS: Fix border width pattern preview (#49753)
* CYS: Fix border width pattern preview

* Add changefile(s) from automation for the following project(s): woocommerce

* format CSS

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-07-22 15:46:11 +02:00
Luigi Teschio 824bf8e218
CYS: fix drag to resize bar (#49657)
* CYS: fix drag to resize bar

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-07-18 10:57:17 +02:00
Luigi Teschio f583fb142a
CYS: fix arrow welcome tour (#49607)
* CYS: fix arrow welcome tour

* Add changefile(s) from automation for the following project(s): woocommerce

* use hex color

* format file

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-07-17 07:52:20 +00:00
Alba Rincón 45486bc1c7
CYS - Update the full composability layout to match designs (#49303)
* Update the full composability layout to match designs

* Add changefile(s) from automation for the following project(s): woocommerce

* Fix lint errors

* Remove unnecessary important

* Update colors

* Fix empty logo color

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-07-12 09:53:10 +02:00
Alba Rincón fb421397be
CYS - Bring back footer and header borders on hover and selected patterns (#49299)
* Bring back footer and header borders on hover and selected patterns

* Add changefile(s) from automation for the following project(s): woocommerce

* Fix the selected pattern color

* Fix lint errors

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-07-10 09:14:23 +02:00
Luigi Teschio fcb7f6798f
CYS: Fix pattern preview border color (#49206)
* CYS: Fix pattern preview border color when the user hovers the preview; fix pattern preview border color when the pattern is present in the site preview

* Remove the is-added class to avoid marking patterns that are already removed

* Add changefile(s) from automation for the following project(s): woocommerce

* Fix lint errors

* Fix lint error

---------

Co-authored-by: Alba Rincón <alba.rincon@automattic.com>
Co-authored-by: github-actions <github-actions@github.com>
2024-07-09 09:12:33 +02:00
Alba Rincón a93343dd90
CYS - Fix size of the "no logo" title to match the "logo" title size (#49231)
* Fix size of the no logo title to match the logo title size

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-07-08 17:36:37 +02:00
Alba Rincón cecfecdf1f
CYS - Fix assembler styling issues (#49232)
* Fix sidebar bg color

* Fix spacing and title size on patterns section

* Increase space between the section description and the list of patterns

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-07-08 16:47:30 +02:00
Luigi Teschio fe4141f663
CYS: Remove iframe animation (#48941)
* CYS: Remove animation

* Add changefile(s) from automation for the following project(s): woocommerce

* lint CSS

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-07-02 08:08:38 +00:00
Luigi Teschio fb1c2b9936
CYS: Revisit sidebar layout (#48803)
* WIP

* improve layout

* improve CSS

* fix import

* Add changefile(s) from automation for the following project(s): woocommerce

* lint scss

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-07-02 10:03:56 +02:00
Luigi Teschio 2d14a6fb38
CYS: hide button to resize the image (#48714)
* CYS: hide button to resize the image

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-06-21 13:18:54 +00:00
Luigi Teschio 388a5131b5
CYS: add badge that informs how many patterns have been inserted from each category (#48668)
* add badge

* Add changefile(s) from automation for the following project(s): woocommerce

* no show 0

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-06-20 11:35:42 +00:00
Luigi Teschio 408af71b27
CYS: Show Patterns from PTK (#48207)
* WIP

* CYS: Refactor routing approach

* fix type

* Add changefile(s) from automation for the following project(s): woocommerce

* remove focus logic

* remove routekey prop

* fix scroll after insert pattern

* pass onNavigateBackClick callback as prop

* fix scroll

* Add changefile(s) from automation for the following project(s): woocommerce

* fix back arrow click

* fix css

* fix tooltip position

* create dedicated CSS class

* lint css

* restore change

* improve css class name

* remove not necessary class

* add github link to the todo

* lint css

* add want more pattern section

* remove not used import

* fix logic after merge trunk

* CYS: fix tooltip position

* Add changefile(s) from automation for the following project(s): woocommerce

* trigger CI

* improve logic

* use Optional Chaining

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-06-18 12:16:16 +00:00
Daniel W. Robert a203823d62
Add CYS Fiverr Logo Maker CTA (#48486)
* Add markup for Fiverr logo maker.

Add text CTA with link to WooCommerce landing page for Fiverr logo
maker in sidebar navigation on the logo view.

* Adjust styles for Fiverr logo maker CTA.

* Update string output to use interpolateComponents

The text in this addition is mixed with string and markup.

This segmentation can lead to translation issues because
different languages have different syntactic structures.

Here, we utilize interpolateComponents to remedy these potential issues.

See
https://github.com/woocommerce/woocommerce/pull/48486#discussion_r1639637477
for context.

* Add changefile(s) from automation for the following project(s): woocommerce

* Add changefile(s) from automation for the following project(s): woocommerce

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-06-17 09:12:56 -04:00
Luigi Teschio dada673fac
CYS: fix tooltip position (#48495)
* CYS: fix tooltip position

* Add changefile(s) from automation for the following project(s): woocommerce

* trigger CI

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-06-14 10:43:07 +00:00
Luigi Teschio 2c754bb667
CYS: Fix CSS header (#48389)
* CYS: fix css header

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-06-12 11:38:10 +02:00
Luigi Teschio af2946aa34
CYS: Refactor routing approach (#48312)
* CYS: Refactor routing approach

* Add changefile(s) from automation for the following project(s): woocommerce

* remove focus logic

* remove routekey prop

* pass onNavigateBackClick callback as prop

* create dedicated CSS class

* lint css

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-06-11 15:26:04 +02:00
Alba Rincón 7a3cbcded3
CYS > Patterns Migration: Ensure a message is displayed if the user did not allow fetching patterns via API and/or they are unavailable (#48095)
* Add the `Want more patterns` opt in message when tracking is not allowed

* Add notice for offline user

* Add new internal endpoint to fetch patterns

* Introduce a new step in the state machine to synchronously fetch patterns in the flow

* Remove unnecessary initialization

* Add new endpoint to check the patterns PTK availability

* Add `isPTKPatternsAPIAvailable` to context

* Add patterns opt in tracking message to homepage section

* Add tests

* Fix linting errors

* Add changefile(s) from automation for the following project(s): woocommerce

* Fix typo

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-06-05 15:09:35 +02:00
Luigi Teschio 50b29d20f7
[Experimental] [CYS - Full Composability]: Add tooltip when user clicks on pattern (#47583)
* CYS: Show popover when the user clicks on the pattern

* Add changefile(s) from automation for the following project(s): woocommerce

* fix errors

* add documentation

* fix calculation

* improve performance

* remove not necessary else branch

* restore pnpm-lock

* improve function naming

* fix label

* improve logic

* remove dispatch

* remove console.log

* fix setLogoBlockIds

* fix build

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-06-05 12:27:35 +00:00
Luigi Teschio 8c1173c94b
Highlight main block at hover (#47415)
* CYS: allow to the user to move the pattern

* add feature flag

* Add changefile(s) from automation for the following project(s): woocommerce

* CYS: Add shuffle button

* CYS - add shuffle feature

* Add changefile(s) from automation for the following project(s): woocommerce

* use WooCommerce feature flag approach

* fix lint error

* Highlight the pattern when the user hovers it

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-05-28 08:16:25 +00:00
Luigi Teschio f12d6e4726
CYS: allow to the user to move the pattern (#47322)
* CYS: allow to the user to move the pattern

* add feature flag

* Add changefile(s) from automation for the following project(s): woocommerce

* use WooCommerce feature flag approach

* hide scrollbar on the body

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-05-28 08:55:14 +02:00
Alba Rincón 5bc0a2c8b1
[CYS] Fix logo position after saving on the assembler (#46833)
* Fix logo position after saving on the assembler

* Add changefile(s) from automation for the following project(s): woocommerce

* Fix lint error

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-04-24 09:34:09 +02:00
Alba Rincón 41e1da5033
[CYS] Redirect to transitional page to the intro page if the CYS task was not completed (#45933)
* Redirect to intro page when accessing the transitional page if no customized

* Remove only

* Add changefile(s) from automation for the following project(s): woocommerce

* Check if the task is completed

* Add transition screen class

* Remove unused import

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-03-27 14:13:52 +01:00
Paul Sealock 619804cff3
Stylelint: Update config to double quotes (#45607)
* Add eslint override

* bump versions stylelint config

* re pnpm install

* fix config

* move to double quotes in scss

* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce

* lint fix new scss files

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-03-26 10:41:34 -03:00
Alba Rincón 87bfa48638
[CYS] Fix the border of the toggle control in the assembler (#45744)
* Fix the color of the toggle control in the assembler

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-03-20 19:03:31 +01:00
Alba Rincón 7e50f670b7
Fix intro CYS logo and site title (#45216)
* Fix intro CYS logo and site title

* Add changefile(s) from automation for the following project(s): woocommerce

* Improve format

* Fix logo motion

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-03-04 12:34:47 +01:00
Alba Rincón 27ee0fd9d1
[CYS] Update path to intro when exiting the assembler (#44771)
* Update path to intro when exiting the assembler

* Add changefile(s) from automation for the following project(s): woocommerce

* Fix styling

* Fix linting error

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-02-27 09:28:24 +01:00
Patricia Hillebrandt fe0b918058
[CYS on Core] Conditionally change the default fonts available based on user consent (#44532)
* Add upgrade notice for the fonts feature whenever WP is outdateed or the user did not grant us consent.

* Add styles for the woocommerce-customize-store_sidebar-typography-upgrade-notice class.

* Update the upgrade conditionals.

* Introduce the new modal for the user to opt in to usage tracking.

* Add the CSS for the woocommerce-customize-store__opt-in-usage-tracking-modal

* Implement the sendEvent to OptInDataSharing

* Fix typo.

* Make sure the opt in button is disabled if the opt in checkbox is unchecked.

* Update the styles for the woocommerce-customize-store__opt-in-usage-tracking-modal

* Update the styles to allow changes to the link

* Set Cardo + System Sans-serif as the default fonts if the usage tracking wasn't allowed.

* Set Cardo + System Sans-serif as the default fonts if the Font Library is unavailable.

* Add the Jost + Instrument Sans font pairing.

* Update copy for the upgrade notice to remove mentions to Gutenberg.

* Replace the Link component with the Button component.

* Ensure the woocommerce_allow_tracking option is properly updated whenever the user opts in.

* Add the new Inter + Cardo font pairing.

* Redirect user to the loading screen so all relevant fonts can be installed for them.

* Render the FontPairing component only if the isFontLibraryAvailable. Update the link to download the latest version of the core of WordPress.

* update the fontPairings constant.

* Update styles for buttons and links.

* Add changefile(s) from automation for the following project(s): woocommerce

* Make sure the dispatch for updating the option is async so the page redirect is not triggered before the option is saved to the database.

* Fix lint error

---------

Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Alba Rincón <alba.rincon@automattic.com>
2024-02-26 16:01:43 +01:00
Alba Rincón af00debc02
[CYS] Use outline instead of border, so the border width does not affect the card size (#44851)
* Use outline instead of border, so the border width does not affect the card size

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
2024-02-26 10:14:47 +01:00
Moon 212c5bca3e
CYS - AI Offline flow (#41656) 2023-12-06 20:49:28 +08:00
Chi-Hsuan Huang 1c4f91ebd3
[CYS] Add the possibility to remove the logo (#41393)
* Add the possibility to remove the logo

* Add changelog
2023-11-15 09:20:42 +08:00
Chi-Hsuan Huang 415fa2004a Fix color panel style 2023-11-03 14:04:49 +08:00
Adrian Duffell 62a833e834
Update Pattern Thumbnail Shadow (#41157)
* Update pattern thumbnail shadow

* Remove whitespace

* Add changelog

* Remove specific container class

* Include new gutenberg class

* Add border for selected homepage option, lint

* Fix jumpy borders in pattern assembler menu items

---------

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>
2023-11-01 23:41:57 +08:00
Chi-Hsuan Huang f7012536cc
Fix CYS pattern thumbnail size (#41126)
* Fix pattern thumbnail size

* Add changelog and doc

* Remove unused import
2023-11-01 19:03:04 +08:00
Chi-Hsuan Huang 23e8324163
[CYS] Fix "Drag to resize" styling when spotlight tour is present (#41150)
* Add changelog

* Update "Drag to resize" styling when spotlight tour is present
2023-11-01 19:01:51 +08:00
Moon 79138bf13c
CYS - Hide theme and default palettes (#41103)
* Hide theme and default palette

* Add changefile(s) from automation for the following project(s): woocommerce

* Lint fix

---------

Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Adrian Duffell <9312929+adrianduffell@users.noreply.github.com>
2023-11-01 14:40:55 +08:00
Chi-Hsuan Huang 391aa15e79
[CYS] Remove disproportionate spacing above and below logo preview (#41151)
* Remove disproportionate spacing above and below logo

* Add changelog
2023-11-01 13:32:33 +08:00
Chi-Hsuan Huang 75114728f0
[CYS] Reduce the logo preview to a maximum width of 250px (#41122)
* Reduce the logo preview to a maximum width of 60px

* Add changelog

* Set max height and width to 250px

60px was too small!

---------

Co-authored-by: Adrian Duffell <9312929+adrianduffell@users.noreply.github.com>
2023-11-01 12:34:54 +08:00
Chi-Hsuan Huang 7b00687a38
Fix CYS assembler hub UI issues (#41036)
* Set default logo size to 60px and max to 200px

* Hide homepage template label

* Scroll to position when selecting a pattern

* Fix preview opacity issue

* Update sidebar scrollbar style

* Fix onboarding tour resize handle

* Add changelog
2023-10-26 18:15:30 +08:00
Moon 8687986e79
Customize your store - Link site icon to Woo Home (#40888)
* Link site icon to Woo Home

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
2023-10-25 13:09:05 +08:00
Chi-Hsuan Huang 6503da23aa
Increase sidebar back button z-index to 2 (#40970) 2023-10-25 12:21:48 +08:00
Chi-Hsuan Huang 64260d987d
Update thumbnail border radius to 4px in CYS assembler (#40967) 2023-10-25 12:20:23 +08:00
Ilyas Foo d8d896741b
CYS: Remove spotlight tour modal shadow (#40861)
* Tweak css for spotlight tour modal shadow

* Changelog

* Lint
2023-10-21 07:34:18 +08:00
Ilyas Foo c87aae495f
CYS: Update save and done button loading indicator to use spinner (#40840)
* Update save and done button loading indicator to use spinner

* Set Done button to disabled while it's resolving

* Changelog
2023-10-19 22:12:53 +08:00
Chi-Hsuan Huang 532bb3056e
Replace font ai suggestion with pre-defined rule-based approach (#40696) 2023-10-12 01:35:46 -05:00
Chi-Hsuan Huang de1fe1bf96
Fix Customize Your Store UI bugs (#40456)
* Add woocommerce_customize_store_ai_suggestions option to allowed list

* Add z-index=1 to tour-kit close btn to ensure it's clickable

* Fix cys container classname

* Fix color palette border style and frame spinner position

* Fix janky ai loader

* Add changelog

* Fix classname and section header spacing

* Fix cannot save cys logo changes

* Add use-selected-pattern hoook to add selected style to pattern

* Fix opacity preview issue

* Revert interval change

* Add test

* Fix findPatternByBlock

* Fix range input focus style

* Fix lint
2023-10-02 16:28:13 +08:00
RJ ceb5f942ea
fix: cys assembler font loading optimisations (#40458)
* fix: cys assembler font loading optimisations

* lint
2023-09-29 13:20:29 +08:00