diff --git a/react/assets/forus-platform/scss/_common/blocks/block-announcements.scss b/react/assets/forus-platform/scss/_common/blocks/block-announcements.scss index bb37f747f..5170913bf 100644 --- a/react/assets/forus-platform/scss/_common/blocks/block-announcements.scss +++ b/react/assets/forus-platform/scss/_common/blocks/block-announcements.scss @@ -1,6 +1,9 @@ &.block-announcements { + display: flex; + flex-direction: column; + gap: 10px; + .announcement { - margin-bottom: 20px; position: relative; opacity: 1; transition: opacity 0.4s; @@ -10,19 +13,19 @@ .announcement-wrapper { background: #ffffff; - padding: 15px 20px; + padding: 12px 15px; border-radius: calc(var(--border-radius)); margin-left: -3.5px; } .title { - font: 600 13px/16px var(--base-font); + font: 600 14px/20px var(--base-font); color: #151b26; - margin-bottom: 7px; + margin-bottom: 6px; } .description { - font: 500 11px/16px var(--base-font); + font: 500 12px/18px var(--base-font); color: #646f79; .block.block-markdown { @@ -30,6 +33,8 @@ color: inherit; p { + margin-bottom: 6px; + &:last-child { margin-bottom: 0; } diff --git a/react/assets/forus-platform/scss/_common/components/forms.scss b/react/assets/forus-platform/scss/_common/components/forms.scss index 07a60c1f0..71a0516e4 100644 --- a/react/assets/forus-platform/scss/_common/components/forms.scss +++ b/react/assets/forus-platform/scss/_common/components/forms.scss @@ -220,7 +220,7 @@ border: 1px solid var(--border-color); background-color: #ffffff; padding: 4px 15px; - height: 36px; + min-height: 36px; color: var(--text-color); font: 500 13px/24px var(--base-font); transition: background-color 0.4s ease, border 0.4s ease; @@ -272,6 +272,7 @@ .form-group-info-control { display: flex; flex-grow: 1; + min-width: 0; .form-control { border-top-right-radius: 0; @@ -284,7 +285,7 @@ border-left: none; box-shadow: none; height: 100%; - align-items: center; + align-items: flex-start; margin: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; @@ -635,6 +636,8 @@ overflow: hidden; display: block; height: 100%; + white-space: nowrap; + text-overflow: ellipsis; } } @@ -732,6 +735,22 @@ } } + &.multiline-selected .select-control-search .select-control-search-placeholder { + height: auto; + overflow: visible; + white-space: initial; + text-overflow: initial; + word-break: break-word; + } + + &.multiline-options .select-control-options .select-control-option { + height: auto; + overflow: visible; + white-space: initial; + text-overflow: initial; + word-break: break-word; + } + &[disabled] { pointer-events: none; } diff --git a/react/assets/forus-platform/scss/_common/components/modals.scss b/react/assets/forus-platform/scss/_common/components/modals.scss index 0a69cc01c..a549c362b 100644 --- a/react/assets/forus-platform/scss/_common/components/modals.scss +++ b/react/assets/forus-platform/scss/_common/components/modals.scss @@ -229,12 +229,20 @@ } .modal-icon-rounded { - background: #fff; - display: inline-block; - padding: 23px; - border-radius: 50%; - margin: 20px 0; - box-shadow: 0 7px 15px rgba(#000, 0.1); + display: flex; + margin: 0 0 20px; + flex-direction: row; + justify-content: center; + + img { + background: #fff; + border-radius: 50%; + box-shadow: 0 7px 15px rgba(#000, 0.1); + flex: 0 0 30px; + padding: 15px; + display: flex; + width: 80px; + } } &.modal-body-visible { @@ -308,6 +316,7 @@ .modal-text { font: 500 14px/22px var(--base-font); color: #646f79; + text-align: center; margin: 0 0 20px; small { diff --git a/react/assets/forus-platform/scss/_common/dashboard.scss b/react/assets/forus-platform/scss/_common/dashboard.scss index 5c3ea66b0..7726510c4 100644 --- a/react/assets/forus-platform/scss/_common/dashboard.scss +++ b/react/assets/forus-platform/scss/_common/dashboard.scss @@ -205,14 +205,14 @@ body { @include webkit_scrollbar(#848588); &.app-header { - padding: 30px 0; + padding: 20px 0; position: relative; z-index: 2; width: 100%; max-width: 1470px; display: flex; flex-direction: column; - gap: 30px; + gap: 20px; margin: 0 auto; .app-header-row { @@ -233,6 +233,8 @@ body { .header-organization-switcher { width: 265px; + display: flex; + align-items: center; .select-control { width: 100%; @@ -623,12 +625,16 @@ body { &.app-sidebar { flex: 0 0 260px; padding-left: 8px; + position: relative; .sidebar-nav { display: flex; flex-direction: column; gap: 4px; - padding-bottom: 100px; + padding-bottom: 30px; + position: sticky; + left: 0; + top: 15px; .sidebar-nav-group { display: flex; @@ -771,6 +777,7 @@ body { display: flex; flex-direction: column; min-width: 0; + padding: 0 0 30px; } @media screen and (max-width: 1300px) { @@ -1579,10 +1586,12 @@ body { padding: 6px 0; font: 500 12px/20px var(--base-font); border-bottom: 1px solid var(--border-color); + word-break: break-word; color: #646f79; strong { color: #000; + display: contents; } &:last-child { @@ -3979,7 +3988,7 @@ body { background: #fff; display: flex; max-width: 100%; - width: calc(50% - 10px); + width: 100%; border: 1px solid #d4d9dd; flex-direction: row; padding: 5px 15px; @@ -4035,9 +4044,18 @@ body { } } } + } - &:nth-child(odd) { - margin-right: 20px; + &.block-attachments-list-half { + .block-attachments-inner { + margin: 0 0 -10px; + } + .attachment-item { + width: calc(50% - 10px); + + &:nth-child(odd) { + margin-right: 20px; + } } } } diff --git a/react/assets/forus-platform/scss/_common/select-controls/select-control-funds.scss b/react/assets/forus-platform/scss/_common/select-controls/select-control-funds.scss index d53042ec9..dfff9f6e2 100644 --- a/react/assets/forus-platform/scss/_common/select-controls/select-control-funds.scss +++ b/react/assets/forus-platform/scss/_common/select-controls/select-control-funds.scss @@ -24,11 +24,8 @@ .select-control-options { .select-control-option { - height: auto; min-width: var(--option-height); padding-left: 10px; - word-break: break-word; - white-space: wrap; } } diff --git a/react/assets/forus-webshop/scss/_common/components/_form.scss b/react/assets/forus-webshop/scss/_common/components/_form.scss index 5027b2b90..ef09e65ae 100644 --- a/react/assets/forus-webshop/scss/_common/components/_form.scss +++ b/react/assets/forus-webshop/scss/_common/components/_form.scss @@ -232,6 +232,9 @@ display: block; color: var(--form-control-color); line-height: 24px; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; } &:focus { @@ -311,7 +314,9 @@ line-height: 20px; color: var(--dropdown-item-color); background: var(--dropdown-item-background); - @include ellipsis(); + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; strong, b { @@ -339,6 +344,22 @@ border-bottom-left-radius: 0; } } + + &.multiline-selected .select-control-search .select-control-search-placeholder { + height: auto; + overflow: visible; + white-space: initial; + text-overflow: initial; + word-break: break-word; + } + + &.multiline-options .select-control-options .select-control-option { + height: auto; + overflow: visible; + white-space: initial; + text-overflow: initial; + word-break: break-word; + } } .select-control.select-control-country-codes { @@ -1165,8 +1186,8 @@ &.form-compact { .form-label { - font: 700 11px/26px var(--base-font); - margin: 0 0 0; + font: 700 11px/16px var(--base-font); + margin: 0 0 5px; } datepicker, diff --git a/react/assets/forus-webshop/scss/_common/components/table-pagination.scss b/react/assets/forus-webshop/scss/_common/components/table-pagination.scss index 7fc62c204..81ee22ada 100644 --- a/react/assets/forus-webshop/scss/_common/components/table-pagination.scss +++ b/react/assets/forus-webshop/scss/_common/components/table-pagination.scss @@ -7,7 +7,7 @@ .table-pagination-counter { color: #282b39; - font: 600 13px/36px var(--base-font); + font: 500 13px/36px var(--base-font); display: flex; flex-direction: row; gap: 10px; diff --git a/react/assets/forus-webshop/scss/_common/sections/blocks/block-key-value-list.scss b/react/assets/forus-webshop/scss/_common/sections/blocks/block-key-value-list.scss index 693ddbcad..e4aaf8bd0 100644 --- a/react/assets/forus-webshop/scss/_common/sections/blocks/block-key-value-list.scss +++ b/react/assets/forus-webshop/scss/_common/sections/blocks/block-key-value-list.scss @@ -84,9 +84,15 @@ border-bottom: 1px solid var(--border-color); color: #646f79; position: relative; + word-break: break-word; strong { color: #000; + display: contents; + } + + div { + display: contents; } .key-value-list-item-value-history-body-item-icon { @@ -148,6 +154,10 @@ .key-value-list-item-value-history-body-item { flex-direction: column; gap: 0; + + div { + display: block; + } } } } diff --git a/react/assets/forus-webshop/scss/_common/sections/blocks/block-profile.scss b/react/assets/forus-webshop/scss/_common/sections/blocks/block-profile.scss new file mode 100644 index 000000000..ac3ffb4ce --- /dev/null +++ b/react/assets/forus-webshop/scss/_common/sections/blocks/block-profile.scss @@ -0,0 +1,260 @@ +.block.block-profile { + @include cf(); + + .profile-aside { + width: 25%; + float: left; + position: relative; + z-index: 2; + + .profile-card { + background: #fff; + border-radius: 10px; + box-shadow: 0 5px 30px rgba(0, 0, 0, 0.05); + padding: 20px; + margin-bottom: 30px; + cursor: default; + + .profile-qr_code { + padding-top: 10px; + width: 100%; + margin-bottom: 25px; + + img { + display: block; + margin: 0 auto; + max-width: 100%; + width: 160px; + } + } + + .profile-details { + text-align: center; + + .profile-heading { + font: 700 18px var(--base-font); + color: #315efd; + margin-bottom: 5px; + } + + .profile-description { + font: 400 13px var(--base-font); + color: #646f79; + margin-bottom: 20px; + } + } + + .profile-address { + margin: 0 -20px; + padding: 20px; + border-top: 1px solid #e9ecee; + border-bottom: 1px solid #e9ecee; + + .profile-address-label { + font: 400 10px var(--base-font); + color: #646f79; + margin-bottom: 5px; + } + + .profile-address-value { + font: 700 16px var(--base-font); + color: #282b39; + @include ellipsis(); + } + } + + .profile-actions { + margin: 0 -20px -40px; + padding: 20px 20px 20px; + @include cf(); + + .profile-action { + font: 700 12px var(--base-font); + color: #2f5bf6; + float: left; + margin-right: 30px; + margin-bottom: 20px; + transition: color 0.4s; + cursor: pointer; + @include cf(); + + .mdi { + color: inherit; + float: left; + margin-right: 5px; + font-size: 1.6em; + line-height: initial; + margin-top: -0.25em; + } + + &:hover { + color: var(--color-primary-light); + } + } + } + } + + .profile-aside-block { + position: relative; + padding: 20px; + width: 100%; + background: #fff; + border-radius: var(--border-radius); + box-shadow: var(--box-shadow); + margin-bottom: 20px; + } + + .profile-menu { + .profile-menu-item { + padding: 14px 19px; + font: 700 13px/20px var(--base-font); + color: var(--profile-menu-item-color); + box-shadow: var(--profile-menu-item-shadow); + background-color: var(--profile-menu-item-background); + border: 1px solid var(--profile-menu-item-border-color); + border-radius: var(--profile-menu-item-border-radius); + margin-bottom: 15px; + display: block; + position: relative; + transition: + color 0.4s, + background 0.4s, + box-shadow 0.4s, + border 0.4s; + + .mdi { + color: var(--profile-menu-item-color); + position: absolute; + right: 15px; + top: 50%; + transform: translate(0, -50%); + font-size: 20px; + transition: color 0.4s; + } + + &.active, + &:hover { + color: var(--profile-menu-item-hover-color); + box-shadow: var(--profile-menu-item-hover-shadow); + background-color: var(--profile-menu-item-hover-background); + border: 1px solid var(--profile-menu-item-hover-border-color); + border-radius: var(--profile-menu-item-hover-border-radius); + + .mdi { + right: 10px; + color: var(--profile-menu-item-hover-color); + } + } + } + } + } + + .profile-content { + float: left; + position: relative; + z-index: 2; + width: 75%; + padding-left: 30px; + + .profile-content-header { + position: relative; + z-index: 1; + margin-bottom: 15px; + + .profile-content-title { + font: 700 22px/32px var(--hf); + color: var(--tc); + width: 100%; + margin: 0; + + .profile-content-header { + display: inline; + margin: 0; + font: inherit; + } + + .profile-content-title-count { + color: var(--showcase-title-count-color); + background: var(--showcase-title-count-background); + border-radius: var(--showcase-title-count-border-radius); + font: var(--showcase-title-font); + font-weight: 700; + font-size: 1rem; + float: right; + min-width: 30px; + height: 30px; + margin: 0 0 0 10px; + text-align: center; + padding: 0 5px; + } + + .block-label-tabs { + .label-tab { + font-weight: 700; + } + } + + &.profile-content-title-sm { + font: 700 18px/27px var(--hf); + } + } + + .profile-content-subtitle { + font: 400 14px/22px var(--base-font); + color: var(--tc); + width: 100%; + } + } + + &:first-child { + margin-left: 0; + padding-left: 0; + } + } + + @media screen and (max-width: 1000px) { + .profile-aside, + .profile-content { + width: 100%; + padding: 0; + margin: 0; + } + + .profile-aside { + display: none; + } + + .profile-content { + .profile-content-header { + display: flex; + flex-direction: column; + + .profile-content-subtitle { + font: 400 14px/22px var(--base-font); + padding: 10px 0; + } + + .block-label-tabs { + display: flex; + flex-direction: column; + padding: 10px 0 0; + + .label-tab-set { + margin: 0 0 10px; + display: flex; + flex-wrap: wrap; + + .label-tab { + flex-basis: 33.33%; + flex-grow: 1; + } + + &:last-child { + margin: 0 0 0; + } + } + } + } + } + } +} diff --git a/react/assets/forus-webshop/scss/_common/sections/blocks/block-reservation-address.scss b/react/assets/forus-webshop/scss/_common/sections/blocks/block-reservation-address.scss new file mode 100644 index 000000000..fa8fa86c2 --- /dev/null +++ b/react/assets/forus-webshop/scss/_common/sections/blocks/block-reservation-address.scss @@ -0,0 +1,129 @@ +.block.block-reservation-address { + border: 1px solid var(--border-color); + border-radius: var(--border-radius); + display: flex; + flex-direction: column; + background-color: #fff; + + .address-overview { + display: flex; + flex-direction: column; + padding: 15px; + border-bottom: 1px solid var(--border-color); + gap: 10px; + + .address-overview-row { + display: flex; + flex-direction: row; + gap: 10px; + width: 100%; + } + + .address-overview-icon { + flex: 0 0 42px; + display: flex; + background: var(--color-primary); + border: 1px solid var(--color-primary); + border-radius: var(--border-radius); + color: #fff; + line-height: 42px; + justify-content: center; + align-items: center; + font-size: 24px; + } + + .address-overview-details { + display: flex; + flex-direction: column; + flex: 1 1 auto; + + .address-overview-details-title { + font: 700 16px/22px var(--base-font); + margin: 0 0; + } + + .address-overview-details-subtitle { + font: 400 13px/20px var(--base-font); + margin: 0 0; + } + } + + .address-overview-actions { + display: flex; + flex-direction: column; + justify-content: center; + } + + &:last-child { + border-bottom: none; + } + + &.address-overview-edit { + .address-overview-icon { + background: #fbfbfb; + color: var(--text-color); + border: 1px solid var(--border-color); + } + } + } + + .address-form { + display: flex; + flex-direction: column; + padding: 15px; + border-bottom: 1px solid var(--border-color); + background: #fbfbfb; + + .address-form-title { + font: 600 16px/26px var(--base-font); + margin: 0 0 5px; + } + + &:first-child { + border-top-left-radius: inherit; + border-top-right-radius: inherit; + } + + &:last-child { + border-bottom: none; + border-bottom-left-radius: inherit; + border-bottom-right-radius: inherit; + } + } + + .address-actions { + display: flex; + flex-direction: row; + padding: 15px; + gap: 10px; + + .button { + margin-right: 0; + } + } + + @media screen and (max-width: 1000px) { + .address-overview { + flex-wrap: wrap; + align-items: flex-start; + + .address-overview-icon { + flex: 0 0 36px; + height: 36px; + line-height: 36px; + font-size: 20px; + } + + .address-overview-actions { + .button { + display: flex; + justify-content: center; + } + } + } + + .address-actions { + flex-direction: column; + } + } +} diff --git a/react/assets/forus-webshop/scss/_common/sections/blocks/profile.scss b/react/assets/forus-webshop/scss/_common/sections/blocks/profile.scss deleted file mode 100644 index b9ada78fd..000000000 --- a/react/assets/forus-webshop/scss/_common/sections/blocks/profile.scss +++ /dev/null @@ -1,309 +0,0 @@ -.block { - &.block-profile { - @include cf(); - - .profile-aside { - width: 25%; - float: left; - position: relative; - z-index: 2; - - .profile-card { - background: #fff; - border-radius: 10px; - box-shadow: 0 5px 30px rgba(0, 0, 0, 0.05); - padding: 20px; - margin-bottom: 30px; - cursor: default; - - .profile-qr_code { - padding-top: 10px; - width: 100%; - margin-bottom: 25px; - - img { - display: block; - margin: 0 auto; - max-width: 100%; - width: 160px; - } - } - - .profile-details { - text-align: center; - - .profile-heading { - font: 700 18px var(--base-font); - color: #315efd; - margin-bottom: 5px; - } - - .profile-description { - font: 400 13px var(--base-font); - color: #646f79; - margin-bottom: 20px; - } - } - - .profile-address { - margin: 0 -20px; - padding: 20px; - border-top: 1px solid #e9ecee; - border-bottom: 1px solid #e9ecee; - - .profile-address-label { - font: 400 10px var(--base-font); - color: #646f79; - margin-bottom: 5px; - } - - .profile-address-value { - font: 700 16px var(--base-font); - color: #282b39; - @include ellipsis(); - } - } - - .profile-actions { - margin: 0 -20px -40px; - padding: 20px 20px 20px; - @include cf(); - - .profile-action { - font: 700 12px var(--base-font); - color: #2f5bf6; - float: left; - margin-right: 30px; - margin-bottom: 20px; - transition: color .4s; - cursor: pointer; - @include cf(); - - .mdi { - color: inherit; - float: left; - margin-right: 5px; - font-size: 1.6em; - line-height: initial; - margin-top: -0.25em; - } - - &:hover { - color: var(--color-primary-light); - } - } - } - } - - .profile-aside-block { - position: relative; - padding: 20px; - width: 100%; - background: #fff; - border-radius: var(--border-radius); - box-shadow: var(--box-shadow); - margin-bottom: 20px; - } - - .profile-menu { - .profile-menu-item { - padding: 14px 19px; - font: 700 13px/20px var(--base-font); - color: var(--profile-menu-item-color); - box-shadow: var(--profile-menu-item-shadow); - background-color: var(--profile-menu-item-background); - border: 1px solid var(--profile-menu-item-border-color); - border-radius: var(--profile-menu-item-border-radius); - margin-bottom: 15px; - display: block; - position: relative; - transition: - color .4s, - background .4s, - box-shadow .4s, - border .4s; - - .mdi { - color: var(--profile-menu-item-color); - position: absolute; - right: 15px; - top: 50%; - transform: translate(0, -50%); - font-size: 20px; - transition: color .4s; - } - - &.active, - &:hover { - color: var(--profile-menu-item-hover-color); - box-shadow: var(--profile-menu-item-hover-shadow); - background-color: var(--profile-menu-item-hover-background); - border: 1px solid var(--profile-menu-item-hover-border-color); - border-radius: var(--profile-menu-item-hover-border-radius); - - .mdi { - right: 10px; - color: var(--profile-menu-item-hover-color); - } - } - } - } - } - - .profile-content { - float: left; - position: relative; - z-index: 2; - width: 75%; - padding-left: 30px; - - .profile-content-header { - position: relative; - z-index: 1; - margin-bottom: 15px; - - .profile-content-title { - font: 700 22px/32px var(--hf); - color: var(--tc); - width: 100%; - margin: 0; - - .profile-content-header { - display: inline; - margin: 0; - font: inherit; - } - - .profile-content-title-count { - color: var(--showcase-title-count-color); - background: var(--showcase-title-count-background); - border-radius: var(--showcase-title-count-border-radius); - font: var(--showcase-title-font); - font-weight: 700; - font-size: 1rem; - float: right; - min-width: 30px; - height: 30px; - margin: 0 0 0 10px; - text-align: center; - padding: 0 5px; - } - - .block-label-tabs { - .label-tab { - font-weight: 700; - } - } - - &.profile-content-title-sm { - font: 700 18px/27px var(--hf); - } - } - - .profile-content-subtitle { - font: 400 14px/22px var(--base-font); - color: var(--tc); - width: 100%; - } - } - - &:first-child { - margin-left: 0; - padding-left: 0; - } - } - } - - @media screen and (max-width: 1000px) { - &.block-profile { - .profile-aside, - .profile-content { - width: 100%; - padding: 0; - margin: 0; - } - - .profile-aside { - .profile-card { - margin: 0 0 20px; - - .profile-address { - text-align: center; - padding: 20px 40px; - } - - .profile-actions { - padding: 0; - margin-bottom: -20px; - - .profile-action { - margin: 0; - width: 50%; - text-align: center; - padding: 15px 20px; - border-right: 1px solid #e9ecee; - line-height: 27px; - - .mdi { - float: none; - margin: 0 5px 0 0; - transform: translate(0, 2px); - display: inline-block; - } - - &:last-child { - border-right: none; - } - } - } - } - - .profile-menu { - margin-bottom: 15px; - - .profile-menu-item { - padding: 12px 20px; - margin-bottom: 10px; - - &:last-child { - margin: 0; - } - } - } - } - - .profile-content { - .profile-content-header { - display: flex; - flex-direction: column; - - .profile-content-subtitle { - font: 400 14px/22px var(--base-font); - padding: 10px 0; - } - - .block-label-tabs { - display: flex; - flex-direction: column; - padding: 10px 0 0; - - .label-tab-set { - margin: 0 0 10px; - display: flex; - flex-wrap: wrap; - - .label-tab { - flex-basis: 33.33%; - flex-grow: 1; - } - - &:last-child { - margin: 0 0 0; - } - } - } - } - } - } - } -} diff --git a/react/assets/forus-webshop/scss/_common/sections/blocks/vouchers.scss b/react/assets/forus-webshop/scss/_common/sections/blocks/vouchers.scss index 3698dd37b..46b5cb9a3 100644 --- a/react/assets/forus-webshop/scss/_common/sections/blocks/vouchers.scss +++ b/react/assets/forus-webshop/scss/_common/sections/blocks/vouchers.scss @@ -59,6 +59,10 @@ font: 700 22px/26px var(--hf); color: #00122a; margin: 0 0 5px; + + .voucher-name-number { + display: none; + } } .voucher-organization { @@ -429,6 +433,10 @@ order: 2; word-break: break-word; word-wrap: break-word; + + .voucher-name-number { + display: contents; + } } .voucher-organization { diff --git a/react/assets/forus-webshop/scss/webshop.scss b/react/assets/forus-webshop/scss/webshop.scss index 87ed1f074..1c381f133 100644 --- a/react/assets/forus-webshop/scss/webshop.scss +++ b/react/assets/forus-webshop/scss/webshop.scss @@ -50,7 +50,6 @@ @import '_common/sections/blocks/map'; @import '_common/sections/blocks/phone-number'; @import '_common/sections/blocks/product'; -@import '_common/sections/blocks/profile'; @import '_common/sections/blocks/record_categories'; @import '_common/sections/blocks/records_create'; @import '_common/sections/blocks/records'; @@ -62,6 +61,7 @@ @import '_common/sections/blocks/voucher'; @import '_common/sections/blocks/vouchers'; @import '_common/sections/blocks/fund-add-records'; +@import '_common/sections/blocks/block-profile'; @import '_common/sections/blocks/block-preferences'; @import '_common/sections/blocks/block-file-uploader'; @import '_common/sections/blocks/block-auth-widget'; @@ -134,6 +134,7 @@ @import '_common/sections/blocks/block-payouts'; @import '_common/sections/blocks/block-cookie-banner'; @import '_common/sections/blocks/block-lang-control'; +@import '_common/sections/blocks/block-reservation-address'; @import '_common/modals/modal-file-preview'; @import '_common/modals/modal-photo-cropper'; diff --git a/react/src/dashboard/components/elements/select-control/SelectControl.tsx b/react/src/dashboard/components/elements/select-control/SelectControl.tsx index c4a029aa0..4a826f943 100644 --- a/react/src/dashboard/components/elements/select-control/SelectControl.tsx +++ b/react/src/dashboard/components/elements/select-control/SelectControl.tsx @@ -1,4 +1,11 @@ -import React, { FunctionComponent, UIEvent, useCallback, useEffect, useState } from 'react'; +import React, { + FunctionComponent, + HTMLInputAutoCompleteAttribute, + UIEvent, + useCallback, + useEffect, + useState, +} from 'react'; import './styles/ui-select.scss'; import { uniqueId } from 'lodash'; import SelectControlOptions from './templates/SelectControlOptions'; @@ -21,6 +28,8 @@ type SelectControlProps = { scrollSize?: number; dusk?: string; optionsComponent?: FunctionComponent>; + multiline?: boolean | { selected: boolean; options: boolean }; + searchAutoComplete?: HTMLInputAutoCompleteAttribute; }; export interface OptionType { @@ -40,7 +49,7 @@ export type SelectControlOptionsProp = { placeholderValue: string; placeholder: string; showOptions: boolean; - selectOption: (options: OptionType) => void; + selectOption: (option: OptionType) => void; allowSearch: boolean; visibleCount: number; setVisibleCount: (visibleCount: number) => void; @@ -50,11 +59,13 @@ export type SelectControlOptionsProp = { searchOption: (e: React.MouseEvent) => void; setShowOptions?: React.Dispatch>; searchInputChanged: () => void; + searchAutoComplete?: HTMLInputAutoCompleteAttribute; onOptionsScroll: (e: UIEvent) => void; disabled?: boolean; rawValue?: unknown; propKey?: string | null; propValue?: string | null; + multiline?: boolean | { selected: boolean; options: boolean }; }; export default function SelectControl({ @@ -73,7 +84,9 @@ export default function SelectControl({ className = null, scrollSize = 50, optionsComponent = SelectControlOptions, + searchAutoComplete = 'off', dusk = null, + multiline, }: SelectControlProps) { const [query, setQuery] = useState(''); const [modelValue, setModelValue] = useState(null); @@ -86,7 +99,7 @@ export default function SelectControl({ const [placeholderValue, setPlaceholderValue] = useState(''); const findValue = useCallback( - (value) => { + (value: T | string | number | boolean) => { return optionsPrepared.find((option) => { if (strict) { return propKey ? option.raw[propKey] === value : option.raw == value; @@ -142,7 +155,7 @@ export default function SelectControl({ }, [buildSearchedOptions]); const onInputClick = useCallback( - (e) => { + (e: React.MouseEvent) => { e.stopPropagation(); if (allowSearch && autoClear) { @@ -155,7 +168,7 @@ export default function SelectControl({ ); const searchOption = useCallback( - (e) => { + (e: React.MouseEvent) => { e.stopPropagation(); if (disabled || showOptions) { @@ -175,7 +188,7 @@ export default function SelectControl({ ); const selectOption = useCallback( - (option) => { + (option: OptionType) => { setModelValue(option); setQuery(''); onChange(propKey ? option.raw[propKey] : option.raw); @@ -253,5 +266,7 @@ export default function SelectControl({ disabled, propKey, propValue, + multiline, + searchAutoComplete, }); } diff --git a/react/src/dashboard/components/elements/select-control/templates/SelectControlOptions.tsx b/react/src/dashboard/components/elements/select-control/templates/SelectControlOptions.tsx index 864665249..3d75597af 100644 --- a/react/src/dashboard/components/elements/select-control/templates/SelectControlOptions.tsx +++ b/react/src/dashboard/components/elements/select-control/templates/SelectControlOptions.tsx @@ -1,4 +1,4 @@ -import React, { useRef, useState } from 'react'; +import React, { useMemo, useRef, useState } from 'react'; import ClickOutside from '../../click-outside/ClickOutside'; import { uniqueId } from 'lodash'; import { SelectControlOptionsProp } from '../SelectControl'; @@ -25,12 +25,21 @@ export default function SelectControlOptions({ searchInputChanged, onOptionsScroll, disabled, + multiline = { selected: false, options: true }, }: SelectControlOptionsProp) { const [controlId] = useState('select_control_' + uniqueId()); const input = useRef(null); const selectorRef = useRef(null); const placeholderRef = useRef(null); + const multilineSelected = useMemo(() => { + return multiline === true || (typeof multiline === 'object' && multiline?.selected === true); + }, [multiline]); + + const multilineOptions = useMemo(() => { + return multiline === true || (typeof multiline === 'object' && multiline?.options === true); + }, [multiline]); + const { onKeyDown, onBlur } = useSelectControlKeyEventHandlers( selectorRef, placeholderRef, @@ -52,7 +61,13 @@ export default function SelectControlOptions({ ref={selectorRef} onKeyDown={onKeyDown} onBlur={onBlur}> -
item).join(' ')}> +
{/* Placeholder */}
)} @@ -1154,10 +1161,13 @@ export default function ModalProductReserve({ {translate('modal_reserve_product.confirm_notes.labels.house_nr_addition')}
- {form.values.house_nr_addition || emptyText} + data-dusk="overviewValueHouseNrAddition" + className={classNames( + `overview-item-value`, + (!address?.house_nr_addition || skipAddress) && + 'overview-item-value-empty', + )}> + {(!skipAddress && address?.house_nr_addition) || emptyText}
)} @@ -1168,10 +1178,12 @@ export default function ModalProductReserve({ {translate('modal_reserve_product.confirm_notes.labels.postal_code')}
- {form.values.postal_code || emptyText} + data-dusk="overviewValuePostalCode" + className={classNames( + `overview-item-value`, + (!address?.postal_code || skipAddress) && 'overview-item-value-empty', + )}> + {(!skipAddress && address?.postal_code) || emptyText}
)} @@ -1182,10 +1194,12 @@ export default function ModalProductReserve({ {translate('modal_reserve_product.confirm_notes.labels.city')}
- {translate(form.values.city || emptyText)} + data-dusk="overviewValueCity" + className={classNames( + `overview-item-value`, + (!address?.city || skipAddress) && 'overview-item-value-empty', + )}> + {(!skipAddress && address?.city) || emptyText}
)} diff --git a/react/src/webshop/components/pages/fund-requests/FundRequests.tsx b/react/src/webshop/components/pages/fund-requests/FundRequests.tsx index 9ef606190..851811fe8 100644 --- a/react/src/webshop/components/pages/fund-requests/FundRequests.tsx +++ b/react/src/webshop/components/pages/fund-requests/FundRequests.tsx @@ -128,6 +128,7 @@ export default function FundRequests() { value={filterValues.fund_id} propKey={'id'} options={funds} + multiline={true} onChange={(fund_id?: number) => filterUpdate({ fund_id })} /> diff --git a/react/src/webshop/components/pages/funds-pre-check/FundsPreCheck.tsx b/react/src/webshop/components/pages/funds-pre-check/FundsPreCheck.tsx index 01c52de70..104a75788 100644 --- a/react/src/webshop/components/pages/funds-pre-check/FundsPreCheck.tsx +++ b/react/src/webshop/components/pages/funds-pre-check/FundsPreCheck.tsx @@ -455,6 +455,7 @@ export default function FundsPreCheck() { onChange={(organization_id: number) => filter.update({ organization_id }) } + multiline={true} /> @@ -468,6 +469,7 @@ export default function FundsPreCheck() { value={filter.values.tag_id} onChange={(tag_id: number) => filter.update({ tag_id })} options={tags} + multiline={true} /> @@ -531,6 +533,7 @@ export default function FundsPreCheck() { .options } placeholder={`Maak een keuze`} + multiline={true} /> )} diff --git a/react/src/webshop/components/pages/funds-request/elements/steps/FundRequestStepCriteria.tsx b/react/src/webshop/components/pages/funds-request/elements/steps/FundRequestStepCriteria.tsx index 513ec294a..a6ccd7a46 100644 --- a/react/src/webshop/components/pages/funds-request/elements/steps/FundRequestStepCriteria.tsx +++ b/react/src/webshop/components/pages/funds-request/elements/steps/FundRequestStepCriteria.tsx @@ -228,6 +228,7 @@ export default function FundRequestStepCriteria({ placeholder={translate( 'fund_request.sign_up.fund_request_step_criteria.make_a_choice', )} + multiline={true} /> )} diff --git a/react/src/webshop/components/pages/funds/Funds.tsx b/react/src/webshop/components/pages/funds/Funds.tsx index ad99b4ae9..a96ace29f 100644 --- a/react/src/webshop/components/pages/funds/Funds.tsx +++ b/react/src/webshop/components/pages/funds/Funds.tsx @@ -8,7 +8,6 @@ import Fund from '../../../props/models/Fund'; import Voucher from '../../../../dashboard/props/models/Voucher'; import Organization from '../../../../dashboard/props/models/Organization'; import SelectControl from '../../../../dashboard/components/elements/select-control/SelectControl'; -import SelectControlOptions from '../../../../dashboard/components/elements/select-control/templates/SelectControlOptions'; import { useFundService } from '../../../services/FundService'; import { useTagService } from '../../../../dashboard/services/TagService'; import useFilter from '../../../../dashboard/hooks/useFilter'; @@ -182,12 +181,12 @@ export default function Funds() { {translate('funds.labels.organization')} filter.update({ organization_id })} options={organizations || []} + multiline={true} />
@@ -195,12 +194,12 @@ export default function Funds() { {translate('funds.labels.category')} filter.update({ tag_id })} options={tags || []} + multiline={true} />
diff --git a/react/src/webshop/components/pages/identity-security/Security2FA.tsx b/react/src/webshop/components/pages/identity-security/Security2FA.tsx index cee17631b..c61270a6a 100644 --- a/react/src/webshop/components/pages/identity-security/Security2FA.tsx +++ b/react/src/webshop/components/pages/identity-security/Security2FA.tsx @@ -248,6 +248,7 @@ export default function Security2FA() { form.update({ auth_2fa_remember_ip }); }} options={auth2FARememberIpOptions} + multiline={true} /> ) : ( selectDismissTime('webshop', time)} @@ -199,6 +200,7 @@ export default function PushNotificationPreferencesCard({
selectDismissTime('bookmarks', time)} diff --git a/react/src/webshop/components/pages/products/Products.tsx b/react/src/webshop/components/pages/products/Products.tsx index 354a3fc98..6d353b690 100644 --- a/react/src/webshop/components/pages/products/Products.tsx +++ b/react/src/webshop/components/pages/products/Products.tsx @@ -11,7 +11,6 @@ import useProductCategoryService from '../../../../dashboard/services/ProductCat import Organization from '../../../../dashboard/props/models/Organization'; import useAuthIdentity from '../../../hooks/useAuthIdentity'; import SelectControl from '../../../../dashboard/components/elements/select-control/SelectControl'; -import SelectControlOptions from '../../../../dashboard/components/elements/select-control/templates/SelectControlOptions'; import FormError from '../../../../dashboard/components/elements/forms/errors/FormError'; import CmsBlocks from '../../elements/cms-blocks/CmsBlocks'; import useAppConfigs from '../../../hooks/useAppConfigs'; @@ -305,10 +304,10 @@ export default function Products({ fundType = 'budget' }: { fundType: 'budget' | id={'select_provider'} value={filterValues.organization_id} propKey={'id'} + multiline={true} allowSearch={true} onChange={(organization_id: number) => filterUpdate({ organization_id })} options={organizations || []} - optionsComponent={SelectControlOptions} />
@@ -320,11 +319,11 @@ export default function Products({ fundType = 'budget' }: { fundType: 'budget' | filterUpdate({ product_category_id: id })} options={productCategories || []} - optionsComponent={SelectControlOptions} /> @@ -339,9 +338,9 @@ export default function Products({ fundType = 'budget' }: { fundType: 'budget' | propKey={'id'} value={filterValues.product_sub_category_id} onChange={(id: number) => filterUpdate({ product_sub_category_id: id })} + multiline={true} allowSearch={true} options={productSubCategories || []} - optionsComponent={SelectControlOptions} /> )} @@ -355,10 +354,10 @@ export default function Products({ fundType = 'budget' }: { fundType: 'budget' | id={'select_fund'} propKey={'id'} value={filterValues.fund_id} + multiline={true} allowSearch={true} onChange={(fund_id: number) => filterUpdate({ fund_id })} options={funds || []} - optionsComponent={SelectControlOptions} /> )} @@ -388,10 +387,10 @@ export default function Products({ fundType = 'budget' }: { fundType: 'budget' | id={'distance'} propKey={'id'} value={filterValues.distance} + multiline={true} allowSearch={true} onChange={(distance: number) => filterUpdate({ distance })} options={distances || []} - optionsComponent={SelectControlOptions} /> @@ -436,7 +435,6 @@ export default function Products({ fundType = 'budget' }: { fundType: 'budget' | })?.value || {}, ); }} - optionsComponent={SelectControlOptions} />
diff --git a/react/src/webshop/components/pages/profile/cards/IdentityContactInformationCard.tsx b/react/src/webshop/components/pages/profile/cards/IdentityContactInformationCard.tsx index 8a8dedbe5..ddbd72a44 100644 --- a/react/src/webshop/components/pages/profile/cards/IdentityContactInformationCard.tsx +++ b/react/src/webshop/components/pages/profile/cards/IdentityContactInformationCard.tsx @@ -238,6 +238,10 @@ export default function IdentityContactInformationCard({ /> ), }, + { + label: recordTypesByKey?.postal_code?.name, + value: , + }, { label: recordTypesByKey?.neighborhood_name?.name, value: ( diff --git a/react/src/webshop/components/pages/profile/elements/IdentityRecordKeyValueListHistory.tsx b/react/src/webshop/components/pages/profile/elements/IdentityRecordKeyValueListHistory.tsx index 9e401e849..8fb1c6888 100644 --- a/react/src/webshop/components/pages/profile/elements/IdentityRecordKeyValueListHistory.tsx +++ b/react/src/webshop/components/pages/profile/elements/IdentityRecordKeyValueListHistory.tsx @@ -33,11 +33,12 @@ export default function IdentityRecordKeyValueListHistory({ records }: { records {' '}
{`${item.created_at_locale}`}
-
•
+
{' • '}
- {translate('profile.history.from')}{' '} + {' ' + translate('profile.history.from') + ' '} {`'${records[index + 1]?.value_locale || ''}'`} - {translate('profile.history.to')} {`'${item.value_locale || ''}'`} + {' ' + translate('profile.history.to') + ' '} + {`'${item.value_locale || ''}'`}
))} diff --git a/react/src/webshop/components/pages/providers/Providers.tsx b/react/src/webshop/components/pages/providers/Providers.tsx index adf3769a9..864c2c7e1 100644 --- a/react/src/webshop/components/pages/providers/Providers.tsx +++ b/react/src/webshop/components/pages/providers/Providers.tsx @@ -7,7 +7,6 @@ import ProductCategory from '../../../../dashboard/props/models/ProductCategory' import useProductCategoryService from '../../../../dashboard/services/ProductCategoryService'; import StateNavLink from '../../../modules/state_router/StateNavLink'; import SelectControl from '../../../../dashboard/components/elements/select-control/SelectControl'; -import SelectControlOptions from '../../../../dashboard/components/elements/select-control/templates/SelectControlOptions'; import FormError from '../../../../dashboard/components/elements/forms/errors/FormError'; import CmsBlocks from '../../elements/cms-blocks/CmsBlocks'; import useAppConfigs from '../../../hooks/useAppConfigs'; @@ -289,7 +288,8 @@ export default function Providers() { value={filterValues.business_type_id} onChange={(business_type_id?: number) => filterUpdate({ business_type_id })} id="business_type_id" - optionsComponent={SelectControlOptions} + multiline={true} + allowSearch={false} /> @@ -302,11 +302,11 @@ export default function Providers() { filterUpdate({ product_category_id: id })} options={productCategories || []} - optionsComponent={SelectControlOptions} /> @@ -321,9 +321,9 @@ export default function Providers() { propKey={'id'} value={filterValues.product_sub_category_id} onChange={(id: number) => filterUpdate({ product_sub_category_id: id })} + multiline={true} allowSearch={true} options={productSubCategories || []} - optionsComponent={SelectControlOptions} /> )} @@ -337,10 +337,10 @@ export default function Providers() { id={'select_fund'} propKey={'id'} value={filterValues.fund_id} + multiline={true} allowSearch={true} onChange={(fund_id: number) => filterUpdate({ fund_id })} options={funds || []} - optionsComponent={SelectControlOptions} /> )} @@ -371,10 +371,10 @@ export default function Providers() { id={'select_fund'} propKey={'id'} value={filterValues.distance} + multiline={true} allowSearch={true} onChange={(distance: number) => filterUpdate({ distance })} options={distances || []} - optionsComponent={SelectControlOptions} /> @@ -432,7 +432,6 @@ export default function Providers() { })?.value || {}, ); }} - optionsComponent={SelectControlOptions} /> {appConfigs?.show_providers_map && ( diff --git a/react/src/webshop/components/pages/reimbursements/Reimbursements.tsx b/react/src/webshop/components/pages/reimbursements/Reimbursements.tsx index a83abc487..c4b27cd9b 100644 --- a/react/src/webshop/components/pages/reimbursements/Reimbursements.tsx +++ b/react/src/webshop/components/pages/reimbursements/Reimbursements.tsx @@ -123,6 +123,8 @@ export default function Reimbursements() { propKey={'id'} value={filters.values.fund_id} options={funds} + multiline={true} + allowSearch={true} onChange={(fund_id?: number) => filters.update({ fund_id })} /> diff --git a/react/src/webshop/components/pages/reservations/Reservations.tsx b/react/src/webshop/components/pages/reservations/Reservations.tsx index 47334047f..05211dd7a 100644 --- a/react/src/webshop/components/pages/reservations/Reservations.tsx +++ b/react/src/webshop/components/pages/reservations/Reservations.tsx @@ -125,6 +125,8 @@ export default function Reservations() { propKey={'id'} value={filters.values.fund_id} options={funds} + multiline={true} + allowSearch={true} onChange={(fund_id?: number) => filters.update({ fund_id })} /> @@ -139,6 +141,8 @@ export default function Reservations() { propKey={'id'} options={organizations} onChange={(organization_id?: number) => filters.update({ organization_id })} + multiline={true} + allowSearch={true} />
@@ -152,6 +156,8 @@ export default function Reservations() { propKey={'value'} options={states} onChange={(state?: string) => filters.update({ state })} + multiline={true} + allowSearch={true} />
diff --git a/react/src/webshop/components/pages/search/Search.tsx b/react/src/webshop/components/pages/search/Search.tsx index f5371c1c6..42fbd2044 100644 --- a/react/src/webshop/components/pages/search/Search.tsx +++ b/react/src/webshop/components/pages/search/Search.tsx @@ -302,6 +302,7 @@ export default function Search() { filterUpdate({ product_category_id: id })} @@ -318,6 +319,7 @@ export default function Search() { filterUpdate({ fund_id: id })} @@ -334,6 +336,7 @@ export default function Search() { filterUpdate({ organization_id: id })} diff --git a/react/src/webshop/components/pages/vouchers/elements/VoucherCard.tsx b/react/src/webshop/components/pages/vouchers/elements/VoucherCard.tsx index eb6649aac..dc5f2b13b 100644 --- a/react/src/webshop/components/pages/vouchers/elements/VoucherCard.tsx +++ b/react/src/webshop/components/pages/vouchers/elements/VoucherCard.tsx @@ -62,7 +62,7 @@ export default function VoucherCard({

- #{voucherCard.number} {voucherCard.title} + #{voucherCard.number} {voucherCard.title}

diff --git a/react/src/webshop/i18n/nl/modals/modal_reserve_product.mjs b/react/src/webshop/i18n/nl/modals/modal_reserve_product.mjs index 8c0978c5a..e769ebe1e 100644 --- a/react/src/webshop/i18n/nl/modals/modal_reserve_product.mjs +++ b/react/src/webshop/i18n/nl/modals/modal_reserve_product.mjs @@ -114,6 +114,7 @@ export default { next: 'Volgende', confirm: 'Bevestigen', submit: 'Indienen', + skip: 'Overslaan', adjust: 'Terug', processing: 'Verwerken', go_to_reservation: 'Ga naar reservering', diff --git a/react/src/webshop/i18n/translated/ar.json b/react/src/webshop/i18n/translated/ar.json index 33f82edee..388d98bb3 100644 --- a/react/src/webshop/i18n/translated/ar.json +++ b/react/src/webshop/i18n/translated/ar.json @@ -2998,7 +2998,8 @@ "go_to_reservation": "الانتقال إلى الحجز", "next": "التالي", "processing": "العملية", - "submit": "إرسال" + "submit": "إرسال", + "skip": "تخطي" }, "cancel": "إلغاء", "choose_credit": "اختر الرصيد الذي ستدفع به", diff --git a/react/src/webshop/i18n/translated/de.json b/react/src/webshop/i18n/translated/de.json index baf7cb2b3..e98350f4b 100644 --- a/react/src/webshop/i18n/translated/de.json +++ b/react/src/webshop/i18n/translated/de.json @@ -1596,7 +1596,8 @@ "go_to_reservation": "Zur Buchung gehen", "next": "Weiter", "processing": "Prozess", - "submit": "Einreichen" + "submit": "Einreichen", + "skip": "Überspringen" }, "cancel": "Abbrechen", "choose_credit": "Wählen Sie das Guthaben, mit dem Sie bezahlen möchten", diff --git a/react/src/webshop/i18n/translated/en-US.json b/react/src/webshop/i18n/translated/en-US.json index dc944cd6e..ecfb6312b 100644 --- a/react/src/webshop/i18n/translated/en-US.json +++ b/react/src/webshop/i18n/translated/en-US.json @@ -3322,7 +3322,8 @@ "go_to_reservation": "Go to reservation", "processing": "Process", "submit": "Submit", - "next": "Next" + "next": "Next", + "skip": "Skip" }, "cancel": "Cancel", "choose_credit": "Choose the credit to pay with", diff --git a/react/src/webshop/i18n/translated/fr.json b/react/src/webshop/i18n/translated/fr.json index 43c232547..124c8a967 100644 --- a/react/src/webshop/i18n/translated/fr.json +++ b/react/src/webshop/i18n/translated/fr.json @@ -1596,7 +1596,8 @@ "go_to_reservation": "Aller à la réservation", "next": "Suivant", "processing": "Processus", - "submit": "Soumettre" + "submit": "Soumettre", + "skip": "Sauter" }, "cancel": "Annuler", "choose_credit": "Choisir le crédit pour payer", diff --git a/react/src/webshop/i18n/translated/pl.json b/react/src/webshop/i18n/translated/pl.json index 22133eca5..382e9b9f6 100644 --- a/react/src/webshop/i18n/translated/pl.json +++ b/react/src/webshop/i18n/translated/pl.json @@ -1596,7 +1596,8 @@ "go_to_reservation": "Przejdź do rezerwacji", "next": "Następny", "processing": "Proces", - "submit": "Prześlij" + "submit": "Prześlij", + "skip": "Pomiń" }, "cancel": "Anuluj", "choose_credit": "Wybierz kredyt, którym chcesz zapłacić", diff --git a/react/src/webshop/i18n/translated/ru.json b/react/src/webshop/i18n/translated/ru.json index 24a1b487c..aa0174ea1 100644 --- a/react/src/webshop/i18n/translated/ru.json +++ b/react/src/webshop/i18n/translated/ru.json @@ -1596,7 +1596,8 @@ "go_to_reservation": "Перейти к бронированию", "next": "Следующий", "processing": "Процесс", - "submit": "Отправить" + "submit": "Отправить", + "skip": "Скип" }, "cancel": "Отмена", "choose_credit": "Выберите кредит для оплаты", diff --git a/react/src/webshop/i18n/translated/tr.json b/react/src/webshop/i18n/translated/tr.json index 6ea56c1b6..53cfe18e7 100644 --- a/react/src/webshop/i18n/translated/tr.json +++ b/react/src/webshop/i18n/translated/tr.json @@ -2998,7 +2998,8 @@ "go_to_reservation": "Rezervasyona git", "next": "Sonraki", "processing": "Süreç", - "submit": "Gönder" + "submit": "Gönder", + "skip": "Atla" }, "cancel": "İptal", "choose_credit": "Ödeme yapacağınız krediyi seçin", diff --git a/react/src/webshop/i18n/translated/uk.json b/react/src/webshop/i18n/translated/uk.json index 961daf05d..2be84e912 100644 --- a/react/src/webshop/i18n/translated/uk.json +++ b/react/src/webshop/i18n/translated/uk.json @@ -1596,7 +1596,8 @@ "go_to_reservation": "Перейти до бронювання", "next": "Далі", "processing": "Процес", - "submit": "Надіслати" + "submit": "Надіслати", + "skip": "Пропустити." }, "cancel": "Скасувати", "choose_credit": "Виберіть кредит для оплати", diff --git a/react/src/webshop/props/models/Product.ts b/react/src/webshop/props/models/Product.ts index 92d4e4e9c..abc46645a 100644 --- a/react/src/webshop/props/models/Product.ts +++ b/react/src/webshop/props/models/Product.ts @@ -2,8 +2,8 @@ import BaseProduct from '../../../dashboard/props/models/Product'; export default interface Product extends BaseProduct { reservation?: { - address: 'no'; - birth_date: 'no'; + address: 'no' | 'optional' | 'required'; + birth_date: 'no' | 'optional' | 'required'; fields: Array<{ id?: number; type?: 'text' | 'number'; diff --git a/translations/cache/cache.json b/translations/cache/cache.json index 1949663fa..d2b52215b 100644 --- a/translations/cache/cache.json +++ b/translations/cache/cache.json @@ -4335,6 +4335,10 @@ "modal_reserve_product.buttons.processing", "Verwerken" ], + [ + "modal_reserve_product.buttons.skip", + "Overslaan" + ], [ "modal_reserve_product.buttons.submit", "Indienen"