kenaug74/Sylius
1
0
Fork 0
mirror of https://github.com/Sylius/Sylius.git synced 2026-07-14 09:02:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 7

performance, accessibility, best practices and seo improvements

Browse source
This commit is contained in:
Grzegorz Sadowski 2024-11-20 13:22:48 +01:00 • committed by damonsson
commit 70f05307ea
9 changed files with 21 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/Sylius/Bundle/ShopBundle/Resources/assets/styles/_utils.scss
View file

@ -39,3 +39,8 @@ $positions: 40px, 50px, 80px;
.w-full {
width: 100%;
}
// Contrast fix
.bg-success-subtle.text-success {
color: #157247 !important;
}

2
src/Sylius/Bundle/ShopBundle/templates/homepage/banner.html.twig
View file

@ -1,7 +1,7 @@
<div class="mb-6">
<div class="overflow-hidden">
<div class="d-flex justify-content-center align-items-center position-relative">
<img src="{{ asset('build/shop/images/homepage-banner.webp', 'shop') }}" class="img-fluid" alt="Home">
<img src="{{ asset('build/shop/images/homepage-banner.webp', 'shop') }}" width="1920" height="100%" class="img-fluid" alt="Home">
<img src="{{ asset('build/shop/images/homepage-banner-logo.webp', 'shop') }}" class="position-absolute" style="max-width: 40vw" alt="New collection">
</div>
</div>

4
src/Sylius/Bundle/ShopBundle/templates/shared/components/header/cart.html.twig
View file

@ -5,11 +5,11 @@
<div class="col-auto position-relative" {{ attributes }}>
<div data-loading>
<div class="sylius-shop-loader">
<img src="{{ asset('build/shop/images/loader.gif', 'shop') }}" alt="{{ 'sylius.ui.loading'|trans }}"/>
<img src="{{ asset('build/shop/images/loader.gif', 'shop') }}" alt="{{ 'sylius.ui.loading'|trans }}" loading="lazy"/>
</div>
</div>
<div {{ sylius_test_html_attribute('cart-button') }}>
<button class="btn btn-icon btn-transparent px-0 position-relative" data-bs-toggle="offcanvas" data-bs-target="#offcanvasCart">
<button class="btn btn-icon btn-transparent px-0 position-relative" data-bs-toggle="offcanvas" data-bs-target="#offcanvasCart" aria-label="cart button">
{{ ux_icon('tabler:shopping-bag') }}
<span class="d-none d-lg-block ps-1" {{ sylius_test_html_attribute('cart-total') }}>
{{- money.convertAndFormat(cart.itemsTotal) -}}

2
src/Sylius/Bundle/ShopBundle/templates/shared/components/main_image.html.twig
View file

@ -6,4 +6,4 @@
{% set path = asset('build/shop/images/200x200.png', 'shop') %}
{% endif %}
<img {{ attributes.defaults({ class: 'img-fluid' }) }} src="{{ path }}" {{ sylius_test_html_attribute('main-image') }} alt="{{ product.name }}" />
<img {{ attributes.defaults({ class: 'img-fluid' }) }} src="{{ path }}" {{ sylius_test_html_attribute('main-image') }} alt="Product {{ product.name }} picture" />

3
src/Sylius/Bundle/ShopBundle/templates/shared/layout/base.html.twig
View file

@ -10,7 +10,8 @@
<title>{% block title %}{{ sylius.channel.name }}{% endblock %}</title>
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<meta content="width=device-width, initial-scale=1, maximum-scale=5, user-scalable=yes" name="viewport">
<meta name="description" content="Explore the Sylius demo – a flexible e-commerce platform built on Symfony. Discover features to customize your online store and test its capabilities!"/>
{% block metatags %}
{% hook '#metatags' with { _prefixes: prefixes } %}

4
src/Sylius/Bundle/ShopBundle/templates/shared/layout/base/footer/content/copy.html.twig
View file

@ -1,5 +1,5 @@
<div class="col-12 text-center col-md-6 order-md-3 text-md-start col-lg-3 order-lg-1">
<a href="{{ path('sylius_shop_homepage') }}" class="d-inline-block mb-4">
<a href="{{ path('sylius_shop_homepage') }}" class="d-inline-block mb-4" aria-label="sylius logo">
<div style="width: 10rem">
{% include '@SyliusShop/shared/logo.html.twig'%}
</div>
@ -7,6 +7,6 @@
<div class="mb-3">
&copy; {{ 'sylius.ui.your_store'|trans }}, {{ 'sylius.ui.powered_by'|trans }}
<a href="https://sylius.com" target="_blank" style="color: #1abb9c;">Sylius</a>.
<a href="https://sylius.com" target="_blank" style="color: #18816c;">Sylius</a>
</div>
</div>

12
src/Sylius/Bundle/ShopBundle/templates/shared/layout/base/footer/content/payment_methods.html.twig
View file

@ -4,24 +4,24 @@
<div class="row g-2 mb-4">
<div class="col-4">
<a href="https://sylius.com/partner/paypal/" target="_blank" class="d-block border rounded p-2">
<img class="img-fluid" src="{{ asset('build/shop/images/paypal-logo.svg', 'shop') }}" alt="PayPal" />
<img class="img-fluid" src="{{ asset('build/shop/images/paypal-logo.svg', 'shop') }}" width="100%" height="100%" alt="PayPal" />
</a>
</div>
<div class="col-4">
<a href="https://sylius.com/partner/adyen/" target="_blank" class="d-block border rounded p-2">
<img class="img-fluid" src="{{ asset('build/shop/images/adyen-logo.svg', 'shop') }}" alt="Adyen" />
<img class="img-fluid" src="{{ asset('build/shop/images/adyen-logo.svg', 'shop') }}" width="100%" height="100%" alt="Adyen" />
</a>
</div>
<div class="col-4">
<a href="https://sylius.com/partner/mollie/" target="_blank" class="d-block border rounded p-2">
<img class="img-fluid" src="{{ asset('build/shop/images/mollie-logo.svg', 'shop') }}" alt="Mollie" />
<img class="img-fluid" src="{{ asset('build/shop/images/mollie-logo.svg', 'shop') }}" width="100%" height="100%" alt="Mollie" />
</a>
</div>
</div>
<div class="d-flex justify-content-center justify-content-md-start justify-content-lg-center gap-3 mb-5">
<a class="link-reset" href="#">{{ ux_icon('tabler:brand-instagram', { class: 'icon icon-md' }) }}</a>
<a class="link-reset" href="#">{{ ux_icon('tabler:brand-facebook', { class: 'icon icon-md' }) }}</a>
<a class="link-reset" href="#">{{ ux_icon('tabler:brand-x', { class: 'icon icon-md' }) }}</a>
<a class="link-reset" href="https://www.instagram.com/sylius.team/" aria-label="instagram logo">{{ ux_icon('tabler:brand-instagram', { class: 'icon icon-md' }) }}</a>
<a class="link-reset" href="https://www.facebook.com/SyliusEcommerce/" aria-label="facebook logo">{{ ux_icon('tabler:brand-facebook', { class: 'icon icon-md' }) }}</a>
<a class="link-reset" href="https://x.com/Sylius" aria-label="x logo">{{ ux_icon('tabler:brand-x', { class: 'icon icon-md' }) }}</a>
</div>
</div>

2
src/Sylius/Bundle/ShopBundle/templates/shared/layout/base/header/content/logo.html.twig
View file

@ -1,5 +1,5 @@
<div class="col">
<a href="{{ path('sylius_shop_homepage') }}" class="d-inline-block py-lg-2" style="width: 10rem">
<a href="{{ path('sylius_shop_homepage') }}" class="d-inline-block py-lg-2" style="width: 10rem" aria-label="sylius logo">
{% hook 'logo' %}
</a>
</div>

2
src/Sylius/Bundle/ShopBundle/templates/shared/layout/base/header/content/security/visitor/mobile.html.twig
View file

@ -1,5 +1,5 @@
<div class="d-lg-none">
<a href="{{ path('sylius_shop_login') }}" class="btn btn-icon btn-transparent px-0">
<a href="{{ path('sylius_shop_login') }}" class="btn btn-icon btn-transparent px-0" aria-label="account button">
{{ ux_icon('tabler:user') }}
</a>
</div>