diff --git a/src/Resources/assets/shop/scss/_carousel.scss b/src/Resources/assets/shop/scss/_carousel.scss index c6615c100..312bb1934 100644 --- a/src/Resources/assets/shop/scss/_carousel.scss +++ b/src/Resources/assets/shop/scss/_carousel.scss @@ -1,27 +1,27 @@ .carousel-wrapper { position: relative; - .carousel { + .products-carousel { margin: 0 -1em; } - .carousel-nav { - .carousel-left { + .products-carousel-nav { + .products-carousel-left { left: 30px; } - .carousel-right { + .products-carousel-right { right: 30px; } - .carousel-left, .carousel-right { + .products-carousel-left, .products-carousel-right { position: absolute; top: 50%; transform: translateY(-50%); } } - .carousel-item { + .products-carousel-item { padding: 5px 1em; } } diff --git a/tests/Application/Resources/fixtures/homepage_logo.png b/tests/Application/Resources/fixtures/homepage_logo.png index decba55dd..ced2d0f60 100644 Binary files a/tests/Application/Resources/fixtures/homepage_logo.png and b/tests/Application/Resources/fixtures/homepage_logo.png differ diff --git a/tests/Application/Resources/fixtures/sale_banner.jpg b/tests/Application/Resources/fixtures/sale_banner.jpg new file mode 100644 index 000000000..1a63d897c Binary files /dev/null and b/tests/Application/Resources/fixtures/sale_banner.jpg differ diff --git a/tests/Application/Resources/fixtures/sale_banner2.jpg b/tests/Application/Resources/fixtures/sale_banner2.jpg new file mode 100644 index 000000000..e4de79b3e Binary files /dev/null and b/tests/Application/Resources/fixtures/sale_banner2.jpg differ diff --git a/tests/Application/Resources/fixtures/specified_products_banner.jpg b/tests/Application/Resources/fixtures/specified_products_banner.jpg deleted file mode 100644 index 3e82f3aec..000000000 Binary files a/tests/Application/Resources/fixtures/specified_products_banner.jpg and /dev/null differ diff --git a/tests/Application/Resources/fixtures/specified_products_banner.png b/tests/Application/Resources/fixtures/specified_products_banner.png new file mode 100644 index 000000000..96912a83f Binary files /dev/null and b/tests/Application/Resources/fixtures/specified_products_banner.png differ diff --git a/tests/Application/Resources/fixtures/t_shirts_banner.jpg b/tests/Application/Resources/fixtures/t_shirts_banner.jpg deleted file mode 100644 index 391ff15df..000000000 Binary files a/tests/Application/Resources/fixtures/t_shirts_banner.jpg and /dev/null differ diff --git a/tests/Application/Resources/fixtures/t_shirts_banner.png b/tests/Application/Resources/fixtures/t_shirts_banner.png new file mode 100644 index 000000000..96912a83f Binary files /dev/null and b/tests/Application/Resources/fixtures/t_shirts_banner.png differ diff --git a/tests/Application/assets/shop/entry.js b/tests/Application/assets/shop/entry.js index aadc3174e..c9b2dfe26 100644 --- a/tests/Application/assets/shop/entry.js +++ b/tests/Application/assets/shop/entry.js @@ -1 +1,2 @@ import 'sylius/bundle/ShopBundle/Resources/private/entry'; +import './styles.scss'; diff --git a/tests/Application/assets/shop/styles.scss b/tests/Application/assets/shop/styles.scss new file mode 100644 index 000000000..26e3f1bc7 --- /dev/null +++ b/tests/Application/assets/shop/styles.scss @@ -0,0 +1,23 @@ +.homepage-logo { + border-radius: 6px; + overflow: hidden; +} + +.homepage-sale { + img { + width: 60% !important; + margin: auto !important; + border-radius: 20px; + } +} + +.cms_content_element__taxons-list { + .ui.column { + text-align: center; + + a { + font-size: 14pt; + font-weight: bold; + } + } +} diff --git a/tests/Application/config/packages/bitbag_sylius_cms_plugin.yaml b/tests/Application/config/packages/bitbag_sylius_cms_plugin.yaml index 0af634ef6..1721311e3 100644 --- a/tests/Application/config/packages/bitbag_sylius_cms_plugin.yaml +++ b/tests/Application/config/packages/bitbag_sylius_cms_plugin.yaml @@ -19,47 +19,61 @@ sylius_fixtures: type: "page" page_codes: - "lorem_ipsum" - general: - name: "General" - type: "block" - store: - name: "Store" - type: "block" homepage: name: "Homepage" type: "page" - products: - name: "Products" - type: "media" + black_friday: + name: "Black Friday" + type: "block" + products_details: + name: "Product details" + type: "block" block: options: custom: homepage_textarea: - name: "Homepage textarea" + name: "Homepage textarea example" channels: - "FASHION_WEB" locales: - "en_US" + collections: + - "homepage" content_elements: + spacer1: + type: "spacer" + data: + spacer: 12 heading: type: "heading" data: heading_type: "h1" - heading: "Textarea" + heading: "Welcome in SyliusCmsPlugin! 🤗" textarea: type: "textarea" data: textarea: | -

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In metus metus, pellentesque feugiat dictum vitae, viverra et purus. Etiam ornare arcu eget bibendum ornare. Donec at dictum odio, venenatis imperdiet tortor. Aenean aliquam mauris id massa commodo condimentum. Praesent sit amet feugiat justo, quis dictum nulla.

-

Fusce gravida orci eu lorem pharetra viverra. Ut non posuere arcu, pellentesque tristique massa. Donec sit amet efficitur risus, a mattis sem. Pellentesque id fringilla lorem, non finibus velit. -

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In metus metus, pellentesque feugiat dictum vitae, viverra et purus. Etiam ornare arcu eget bibendum ornare. Donec at dictum odio, venenatis imperdiet tortor. Aenean aliquam mauris id massa commodo condimentum. Praesent sit amet feugiat justo, quis dictum nulla.

-

Fusce gravida orci eu lorem pharetra viverra. Ut non posuere arcu, pellentesque tristique massa. Donec sit amet efficitur risus, a mattis sem. Pellentesque id fringilla lorem, non finibus velit.

+

+ Welcome to BitBagCmsPlugin, where style meets comfort! Explore our latest collection of trendy t-shirts, stylish dresses, and versatile caps, designed for both men and women. Whether you're dressing up or keeping it casual, our curated selection offers something for everyone. Elevate your wardrobe with pieces that reflect your unique personality and fit perfectly into your everyday life. Shop now and discover your new favorite look! +

+

+ Discover our latest collection: +

+

+ spacer2: + type: "spacer" + data: + spacer: 12 homepage_products_carousel: - name: "Homepage products carousel" + name: "Homepage products carousel example" channels: - "FASHION_WEB" collections: - - "products" + - "homepage" locales: - "en_US" content_elements: @@ -67,7 +81,14 @@ sylius_fixtures: type: "heading" data: heading_type: "h2" - heading: "Products carousel" + heading: "See our collection of brand new T-Shirts! 👕" + textarea: + type: "textarea" + data: + textarea: | +

+ Our T-Shirts collection offers a blend of comfort and style, featuring a variety of designs that cater to every taste. Whether you're looking for classic basics or bold statement pieces, you'll find the perfect fit to express your unique personality. +

products_carousel: type: "products_carousel" data: @@ -77,71 +98,175 @@ sylius_fixtures: - "Loose_white_designer_T_Shirt" - "Ribbed_copper_slim_fit_Tee" - "Sport_basic_white_T_Shirt" + - "Raglan_grey_black_Tee" + - "Oversize_white_cotton_T_Shirt" + homepage_sale_banner: + name: "Homepage single media example" + channels: + - "FASHION_WEB" + collections: + - "homepage" + taxons: + - "t_shirts" + content_elements: + spacer1: + type: "spacer" + data: + spacer: 20 + single_media: + type: "single_media" + data: + single_media: "sale_banner" + spacer2: + type: "spacer" + data: + spacer: 20 + homepage_sale_banner2: + name: "Homepage single media example" + channels: + - "FASHION_WEB" + collections: + - "homepage" + taxons: + - "t_shirts" + content_elements: + spacer1: + type: "spacer" + data: + spacer: 20 + single_media: + type: "single_media" + data: + single_media: "sale_banner2" homepage_products_carousel_by_taxon: - name: "Homepage products carousel by Taxon" + name: "Homepage products carousel by taxon example" channels: - "FASHION_WEB" collections: - - "products" + - "homepage" locales: - "en_US" content_elements: + spacer1: + type: "spacer" + data: + spacer: 30 heading: type: "heading" data: heading_type: "h2" - heading: "Products carousel by Taxon" + heading: "How about jeans? 👖" + textarea: + type: "textarea" + data: + textarea: | +

+ Discover our Jeans collection, where comfort meets timeless style. Whether you're looking for the perfect pair to wear every day or something more fashion-forward, our jeans are designed to fit seamlessly into your wardrobe. +

+

+ Key features of our Dresses collection: + +

+

+

+ Elevate your denim game with our collection and find your new favorite pair today! +

products_carousel_by_taxon: type: "products_carousel_by_taxon" data: - products_carousel_by_taxon: "t_shirts" + products_carousel_by_taxon: "jeans" homepage_products_grid: - name: "Homepage products grid" + name: "Homepage products grid example" channels: - "FASHION_WEB" collections: - - "products" + - "homepage" content_elements: heading: type: "heading" data: heading_type: "h2" - heading: "Products grid" + heading: "Meet our caps brand 🧢" + textarea: + type: "textarea" + data: + textarea: | +

+ Our Caps collection combines functionality with fashion, offering a range of designs that suit any style. Whether you need a sporty edge or a casual accessory, our caps are the perfect finishing touch for any outfit. +

products_grid: type: "products_grid" data: products_grid: products: - - "Raglan_grey_&_black_Tee" - - "Loose_white_designer_T_Shirt" - - "Sport_basic_white_T_Shirt" - - "Ribbed_copper_slim_fit_Tee" + - "Knitted_burgundy_winter_cap" + - "Knitted_wool_blend_green_cap" + - "Knitted_white_pompom_cap" + - "Cashmere_blend_violet_beanie" homepage_products_grid_by_taxon: - name: "Homepage products grid by Taxon" + name: "Homepage products grid by taxon example" channels: - "FASHION_WEB" collections: - - "products" + - "homepage" content_elements: heading: type: "heading" data: heading_type: "h2" - heading: "Products grid by Taxon" + heading: "See also our dress collection! 👗" + textarea: + type: "textarea" + data: + textarea: | +

+ Explore our Dresses collection, where style and sophistication come together in perfect harmony. Whether you're dressing for a special occasion or simply want to elevate your everyday look, our dresses offer something for every moment. +

+

+ Key features of our Dresses collection: + +

+

+

+ Find the perfect dress to match your style and make every day a little more special! +

products_grid_by_taxon: type: "products_grid_by_taxon" data: - products_grid_by_taxon: "caps" + products_grid_by_taxon: "dresses" homepage_taxons_list: - name: "Homepage taxons list" + name: "Homepage taxons list example" channels: - "FASHION_WEB" + collections: + - "homepage" content_elements: heading: type: "heading" data: heading_type: "h2" - heading: "Taxons list" + heading: "Not interested in caps? See all our brands:" + textarea: + type: "textarea" + data: + textarea: | +

+ Check out our other collections to complete your look! Explore our diverse range of T-Shirts, where comfort meets contemporary style, perfect for any occasion. Don't miss our Caps collection, offering the ideal blend of fashion and functionality to top off your outfit. And for those special moments, our Dresses collection features stylish options that will make you feel confident and elegant. Discover your new favorites today! +

+ spacer1: + type: "spacer" + data: + spacer: 30 taxons_list: type: "taxons_list" data: @@ -152,55 +277,66 @@ sylius_fixtures: - "dresses" - "jeans" taxon_t_shirts_banner: - name: "T-Shirts banner" + name: "Taxon single media example" channels: - "FASHION_WEB" + collections: + - "black_friday" taxons: - "t_shirts" + - "mens_t_shirts" + - "womens_t_shirts" content_elements: - heading: - type: "heading" - data: - heading_type: "h2" - heading: "Image block for specified category (T-Shirts)" single_media: type: "single_media" data: single_media: "t_shirts_banner" specified_products_banner: - name: "Specified products banner" + name: "Product single media example" channels: - "FASHION_WEB" + collections: + - "black_friday" products: - "Everyday_white_basic_T_Shirt" - "Loose_white_designer_T_Shirt" - "Ribbed_copper_slim_fit_Tee" content_elements: - heading: - type: "heading" - data: - heading_type: "h2" - heading: "Image block for specified products" single_media: type: "single_media" data: single_media: "specified_products_banner" + spacer1: + type: "spacer" + data: + spacer: 20 specified_products_in_taxons: - name: "Specified products in taxons" + name: "Product details products carousel by taxon example" channels: - "FASHION_WEB" + collections: + - "products_details" products_in_taxons: - "womens_t_shirts" content_elements: - heading: + spacer1: + type: "spacer" + data: + spacer: 20 + heading1: type: "heading" data: heading_type: "h2" - heading: "Block for products in specified taxons" + heading: "You may also like:" products_carousel_by_taxon: type: "products_carousel_by_taxon" data: products_carousel_by_taxon: "t_shirts" + heading2: + type: "heading" + data: + heading_type: "h2" + heading: "Our best sales:" products_grid_by_taxon: type: "products_grid_by_taxon" data: @@ -284,15 +420,33 @@ sylius_fixtures: type: image path: "%fixtures_dir%/sale.jpeg" original_name: "sale.jpeg" - collections: - - "products" t_shirts_banner: name: "T-Shirts banner" channels: - "FASHION_WEB" type: image - path: "%fixtures_dir%/t_shirts_banner.jpg" - original_name: "t_shirts_banner.jpg" + path: "%fixtures_dir%/t_shirts_banner.png" + original_name: "t_shirts_banner.png" + translations: + en_US: + alt: "T-Shirts banner" + sale_banner: + name: "Sale banner" + channels: + - "FASHION_WEB" + type: image + path: "%fixtures_dir%/sale_banner.jpg" + original_name: "sale_banner.jpg" + translations: + en_US: + alt: "Sale banner" + sale_banner2: + name: "Sale banner 2" + channels: + - "FASHION_WEB" + type: image + path: "%fixtures_dir%/sale_banner2.jpg" + original_name: "sale_banner2.jpg" translations: en_US: alt: "T-Shirts banner" @@ -301,8 +455,8 @@ sylius_fixtures: channels: - "FASHION_WEB" type: image - path: "%fixtures_dir%/specified_products_banner.jpg" - original_name: "specified_products_banner.jpg" + path: "%fixtures_dir%/specified_products_banner.png" + original_name: "specified_products_banner.png" translations: en_US: alt: "Specified products banner" @@ -343,47 +497,92 @@ sylius_fixtures: type: "heading" data: heading_type: "h3" - heading: "Lorem ipsum dolor sit amet, consectetur adipiscing elit?" + heading: "What sizes are available for your clothing items?" answer1: type: "textarea" data: - textarea: "

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

" + textarea: "

We are committed to sustainability and offer a selection of t-shirts and jeans made from eco-friendly materials. Look for our sustainability badge on the product pages for more information.>We offer a wide range of sizes for our t-shirts, caps, dresses, and jeans, from XS to XXL. Specific sizing information can be found on each product page.

" question2: type: "heading" data: heading_type: "h3" - heading: "Lorem ipsum dolor sit amet, consectetur adipiscing elit?" + heading: "Are your products unisex?" answer2: type: "textarea" data: - textarea: "

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

" + textarea: "

Yes, many of our t-shirts and caps are designed to be unisex, providing stylish options for both men and women. Our dresses are designed specifically for women, while our jeans come in both men’s and women’s fits.

" question3: type: "heading" data: heading_type: "h3" - heading: "Lorem ipsum dolor sit amet, consectetur adipiscing elit?" + heading: "What materials are your t-shirts and jeans made from?" answer3: type: "textarea" data: - textarea: "

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

" + textarea: "

Our t-shirts are crafted from soft, high-quality cotton blends, while our jeans are made from durable denim with just the right amount of stretch for comfort.

" question4: type: "heading" data: heading_type: "h3" - heading: "Lorem ipsum dolor sit amet, consectetur adipiscing elit?" + heading: "How should I care for my t-shirts and jeans to ensure they last?" answer4: type: "textarea" data: - textarea: "

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

" + textarea: "

We recommend washing your t-shirts and jeans in cold water and tumble drying on low heat to preserve their fit and color. Always check the care label for specific instructions.

" question5: type: "heading" data: heading_type: "h3" - heading: "Lorem ipsum dolor sit amet, consectetur adipiscing elit?" + heading: "Do you offer international shipping?" answer5: type: "textarea" data: - textarea: "

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

" + textarea: "

Yes, we offer international shipping to many countries. Shipping fees and delivery times will vary depending on your location.

" + question6: + type: "heading" + data: + heading_type: "h3" + heading: "Can I return or exchange an item if it doesn’t fit?" + answer6: + type: "textarea" + data: + textarea: "

Absolutely! We have a hassle-free return and exchange policy. If your item doesn’t fit, you can return it within 30 days for a full refund or exchange.

" + question7: + type: "heading" + data: + heading_type: "h3" + heading: "Do you offer any discounts for bulk purchases?" + answer7: + type: "textarea" + data: + textarea: "

Yes, we offer discounts on bulk orders. Please contact our customer service team for more information on bulk pricing and special offers.

" + question8: + type: "heading" + data: + heading_type: "h3" + heading: "How do I find the right size for your caps?" + answer8: + type: "textarea" + data: + textarea: "

Most of our caps are adjustable to fit a variety of head sizes. Each product page includes specific sizing information and instructions on how to adjust the fit.

" + question9: + type: "heading" + data: + heading_type: "h3" + heading: "Are your dresses suitable for formal occasions?" + answer9: + type: "textarea" + data: + textarea: "

Yes, our Dresses collection includes a variety of styles, from casual daywear to elegant dresses perfect for formal events.

" + question10: + type: "heading" + data: + heading_type: "h3" + heading: "Do you have any eco-friendly or sustainable options?" + answer10: + type: "textarea" + data: + textarea: "

We are committed to sustainability and offer a selection of t-shirts and jeans made from eco-friendly materials. Look for our sustainability badge on the product pages for more information.

" blog: name: "Blog" channels: @@ -586,9 +785,6 @@ sylius_fixtures: name: "About us page" channels: - "FASHION_WEB" - collections: - - "general" - - "store" translations: en_US: slug: "about" diff --git a/tests/Application/templates/bundles/BitBagSyliusCmsPlugin/Shop/ContentElement/_products_carousel.html.twig b/tests/Application/templates/bundles/BitBagSyliusCmsPlugin/Shop/ContentElement/_products_carousel.html.twig new file mode 100644 index 000000000..d4c807b86 --- /dev/null +++ b/tests/Application/templates/bundles/BitBagSyliusCmsPlugin/Shop/ContentElement/_products_carousel.html.twig @@ -0,0 +1,33 @@ +{% set tag = random(0, 1000) %} + + diff --git a/tests/Application/templates/bundles/BitBagSyliusCmsPlugin/Shop/ContentElement/_products_grid.html.twig b/tests/Application/templates/bundles/BitBagSyliusCmsPlugin/Shop/ContentElement/_products_grid.html.twig new file mode 100644 index 000000000..c243f99e1 --- /dev/null +++ b/tests/Application/templates/bundles/BitBagSyliusCmsPlugin/Shop/ContentElement/_products_grid.html.twig @@ -0,0 +1,7 @@ +
+
+ {% for product in products %} + {% include '@SyliusShop/Product/_box.html.twig' %} + {% endfor %} +
+
diff --git a/tests/Application/templates/bundles/BitBagSyliusCmsPlugin/Shop/ContentElement/_single_media.html.twig b/tests/Application/templates/bundles/BitBagSyliusCmsPlugin/Shop/ContentElement/_single_media.html.twig new file mode 100644 index 000000000..8b1834993 --- /dev/null +++ b/tests/Application/templates/bundles/BitBagSyliusCmsPlugin/Shop/ContentElement/_single_media.html.twig @@ -0,0 +1,5 @@ +
+
+ {{ media.renderedContent }} +
+
diff --git a/tests/Application/templates/bundles/SyliusShopBundle/Homepage/index.html.twig b/tests/Application/templates/bundles/SyliusShopBundle/Homepage/index.html.twig index f64bf32bd..b8e289c18 100755 --- a/tests/Application/templates/bundles/SyliusShopBundle/Homepage/index.html.twig +++ b/tests/Application/templates/bundles/SyliusShopBundle/Homepage/index.html.twig @@ -2,23 +2,18 @@ {% block content %}
- -
-
-
- Like it? We do a lot of Sylius projects & plugins.
- Perhaps there is something we can do for you. Visit our website for - more information. -
-
-
{% endblock %} diff --git a/tests/Application/templates/bundles/SyliusShopBundle/Product/show.html.twig b/tests/Application/templates/bundles/SyliusShopBundle/Product/show.html.twig index 5a041c8c7..f82c67e61 100755 --- a/tests/Application/templates/bundles/SyliusShopBundle/Product/show.html.twig +++ b/tests/Application/templates/bundles/SyliusShopBundle/Product/show.html.twig @@ -58,7 +58,5 @@ {{ sonata_block_render_event('sylius.shop.product.show.before_associations', {'product': product}) }} - {% include '@SyliusShop/Product/Show/_associations.html.twig' %} - {{ bitbag_cms_render_block('specified_products_in_taxons', null, product) }} {% endblock %}