Skip to content

Commit

Permalink
フロント側アラートメッセージが長い場合の崩れ修正
Browse files Browse the repository at this point in the history
  • Loading branch information
@tatsuishi
tatsuishi committed Feb 26, 2024
1 parent 8e96ee9 commit ecfeed9
Show file tree
Hide file tree
Showing 5 changed files with 94 additions and 33 deletions.
10 changes: 10 additions & 0 deletions html/template/default/assets/css/style.css
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

11 changes: 11 additions & 0 deletions html/template/default/assets/scss/project/_15.1.cart.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -407,6 +407,15 @@ Styleguide 15.1.6
background: #F99;
margin-bottom: 20px;

& &__inner {
display: inline-block;

&__item {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
}

& &__icon {
display: inline-block;
Expand All @@ -423,6 +432,8 @@ Styleguide 15.1.6
font-weight: bold;
color: #fff;
position: relative;
flex: 1;
word-break: break-all;
}
}

Expand Down
64 changes: 44 additions & 20 deletions src/Eccube/Resource/template/default/Cart/index.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,23 +63,31 @@ file that was distributed with this source code.
{% set idx = loop.index0 %}
<div class="ec-cartRole__error">
<div class="ec-alert-warning">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
<div class="ec-alert-warning__text">
{% if productStr[idx] is defined %}
{{ error|trans({'%product%':productStr[idx]})|nl2br }}
{% else %}
{{ error|trans|nl2br }}
{% endif %}
<div class="ec-alert-warning__inner">
<div class="ec-alert-warning__inner__item">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
<div class="ec-alert-warning__text">
{% if productStr[idx] is defined %}
{{ error|trans({'%product%':productStr[idx]})|nl2br }}
{% else %}
{{ error|trans|nl2br }}
{% endif %}
</div>
</div>
</div>
</div>
</div>
{% endfor %}
{% for error in app.session.flashbag.get('eccube.front.cart.error') %}
<div class="ec-cartRole__error">
<div class="ec-alert-warning">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
<div class="ec-alert-warning__text">
{{ error|trans|nl2br }}
<div class="ec-alert-warning__inner">
<div class="ec-alert-warning__inner__item">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
<div class="ec-alert-warning__text">
{{ error|trans|nl2br }}
</div>
</div>
</div>
</div>
</div>
Expand All @@ -93,8 +101,12 @@ file that was distributed with this source code.
{% if Carts|length > 1 %}
<div class="ec-cartRole__error">
<div class="ec-alert-warning">
<div class="ec-alert-warning__text">
{{ 'front.cart.divide_cart'|trans|nl2br }}
<div class="ec-alert-warning__inner">
<div class="ec-alert-warning__inner__item">
<div class="ec-alert-warning__text">
{{ 'front.cart.divide_cart'|trans|nl2br }}
</div>
</div>
</div>
</div>
</div>
Expand All @@ -107,9 +119,13 @@ file that was distributed with this source code.
{% for error in app.session.flashbag.get('eccube.front.cart.' ~ cartKey ~ '.request.error') %}
<div class="ec-cartRole__error">
<div class="ec-alert-warning">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
<div class="ec-alert-warning__text">
{{ error|trans|nl2br }}
<div class="ec-alert-warning__inner">
<div class="ec-alert-warning__inner__item">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
<div class="ec-alert-warning__text">
{{ error|trans|nl2br }}
</div>
</div>
</div>
</div>
</div>
Expand Down Expand Up @@ -217,9 +233,13 @@ file that was distributed with this source code.
{% for error in app.session.flashbag.get('eccube.front.cart.' ~ cartKey ~ '.request.error') %}
<div class="ec-cartRole__error">
<div class="ec-alert-warning">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
<div class="ec-alert-warning__text">
{{ error|trans|nl2br }}
<div class="ec-alert-warning__inner">
<div class="ec-alert-warning__inner__item">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
<div class="ec-alert-warning__text">
{{ error|trans|nl2br }}
</div>
</div>
</div>
</div>
</div>
Expand All @@ -229,8 +249,12 @@ file that was distributed with this source code.
<div class="ec-off3Grid">
<div class="ec-off3Grid__cell">
<div class="ec-alert-warning">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
<div class="ec-alert-warning__text">{{ 'front.cart.no_items'|trans }}</div>
<div class="ec-alert-warning__inner">
<div class="ec-alert-warning__inner__item">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
<div class="ec-alert-warning__text">{{ 'front.cart.no_items'|trans }}</div>
</div>
</div>
</div>
</div>
</div>
Expand Down
22 changes: 15 additions & 7 deletions src/Eccube/Resource/template/default/Shopping/alert.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,13 @@
{% for error in app.session.flashbag.get('eccube.front.error') %}
<div class="ec-cartRole__error">
<div class="ec-alert-warning">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
<div class="ec-alert-warning__text">
{{ error|trans|nl2br }}
<div class="ec-alert-warning__inner">
<div class="ec-alert-warning__inner__item">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
<div class="ec-alert-warning__text">
{{ error|trans|nl2br }}
</div>
</div>
</div>
</div>
</div>
Expand All @@ -15,10 +19,14 @@
{% for error in app.session.flashbag.get('eccube.front.warning') %}
<div class="ec-cartRole__error">
<div class="ec-alert-warning">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}">
</div>
<div class="ec-alert-warning__text">
{{ error|trans|nl2br }}
<div class="ec-alert-warning__inner">
<div class="ec-alert-warning__inner__item">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}">
</div>
<div class="ec-alert-warning__text">
{{ error|trans|nl2br }}
</div>
</div>
</div>
</div>
</div>
Expand Down
20 changes: 14 additions & 6 deletions src/Eccube/Resource/template/default/Shopping/shipping.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,17 +25,25 @@ file that was distributed with this source code.
<div class="ec-addressRole__actions"><a class="ec-inlineBtn" href="{{ url('shopping_shipping_edit', {'id': shippingId}) }}">{{ 'front.shopping.shipping_add_new_shipping'|trans }}</a></div>
{% else %}
<div class="ec-alert-warning">
<div class="ec-alert-warning__text">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"/></div>
{{ 'common.customer_address_count_is_over'|trans({ '%count%': eccube_config.eccube_deliv_addr_max }) }}
<div class="ec-alert-warning__inner">
<div class="ec-alert-warning__inner__item">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"/></div>
<div class="ec-alert-warning__text">
{{ 'common.customer_address_count_is_over'|trans({ '%count%': eccube_config.eccube_deliv_addr_max }) }}
</div>
</div>
</div>
</div>
{% endif %}
{% if has_errors(form.addresses) %}
<div class="ec-alert-warning">
<div class="ec-alert-warning__text">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"/></div>
{{ 'front.shopping.shipping_unselected'|trans }}
<div class="ec-alert-warning__inner">
<div class="ec-alert-warning__inner__item">
<div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"/></div>
<div class="ec-alert-warning__text">
{{ 'front.shopping.shipping_unselected'|trans }}
</div>
</div>
</div>
</div>
{% endif %}
Expand Down

0 comments on commit ecfeed9

Please sign in to comment.