{% set content_w_aside_props = {
aside: true,
variant: "reverse"
} %}
{% set alert_content %}
{{ "Víte, že se můžete vrátit k vaší konfiguraci tisku? Ty aktivní naleznete ve srovnávači tisku" }}
{% include "@Components/icon/icon.twig" with {props: {
src: "@Images/svg/compare.svg",
color: "text",
size: "sm",
extra_class: "mx-1"
}} %}
{{ ". Naleznete je také zde, po kliknutí na " }}
<span>{% include "@Components/icon/icon.twig" with {props: {
src: "@Images/svg/arrow-down-right.svg",
size: "sm",
extra_class: "mx-1"
}} %}</span>
<span>{{ ". Naleznete je také zde, po kliknutí na a i expirovaná konfigurace se automaticky zobrazí ve srovnávači konfigurací, kde si jí můžete dále editovat." }}</span>
{% endset %}
{% set configurations_section = {
title: "Moje konfigurace",
alert: alert_content,
headers: [
{
title: "Konfigurace",
sort: "asc",
url: "#",
},
{
title: "Stav",
sort: "asc",
url: "#",
},
{
title: "Založení",
sort: "asc",
url: "#",
},
{
title: "Expirace",
sort: "asc",
url: "#",
},
],
items: [
{
id: "PP23-00481",
title: "Vánoční tašky Petr",
title_color: "support-orange-400",
expiration_date: "14.06.2023",
created_date: "14.06.2023",
status: {
text: "Aktivní",
value: "active"
},
has_print: true,
order_id: "id2452345",
url: "#"
},
{
id: "PP23-00482",
title: "Vánoční tašky Lenka",
title_color: "support-pink-400",
expiration_date: "24.06.2023",
created_date: "24.06.2023",
status: {
text: "Expirace",
value: "expired"
},
order_id: "id2452345",
url: "#"
},
{
id: "PP23-00483",
expiration_date: "14.07.2023",
created_date: "14.07.2023",
title: "Vánoční tašky pro všechny kamarády",
title_color: "support-blue-400",
status: {
text: "Expirace",
value: "expired"
},
order_id: "id2452345",
url: "#"
},
{
id: "PP23-00484",
expiration_date: "13.03.2023",
created_date: "13.03.2023",
status: {
text: "Aktivní",
value: "active"
},
has_print: true,
order_id: "id2452345",
url: "#"
},
],
pagination: pagination_sample,
search: {
vars: {
action: "",
method: "POST",
multipart: false,
id: "register_form-id",
full_name: "register-form"
},
searchPhrase: {
vars: {
full_name: "searchPhrase",
placeholder: "Vyhledat konfiguraci",
id: "searchPhrase-id"
}
},
submit: {
vars: {
label: "Vyhledat",
full_name: "submit",
id: "submit-id",
value: "Search"
}
},
_token: {
vars: {
value: "asdasdasdasdasjhdasdadasd",
full_name: "contact[_token]",
id: "contact[_token]"
}
}
}
} %}
{% embed "@Components/content-w-aside/content-w-aside.twig" with {props: content_w_aside_props} %}
{% block content %}
{% include "@Components/sections/user-configurations-section/user-configurations-section.twig" with {props: configurations_section} %}
{% endblock %}
{% endembed %}
<div class="content-w-aside --reverse --columns-3">
<div class="container content-w-aside__container">
<div class="content-w-aside__row">
<div class="content-w-aside__content">
<section class="base-section --top-0 s-user-configurations">
<div class="base-section__container false">
<header class="s-user-configurations__header mb-7 d-flex gap-3 flex-wrap flex-column flex-sm-row">
<h2 class="base-heading mb-0 u-fw-700 u-h1 flex-grow-1 align-items-center gap-3">
Moje konfigurace
</h2>
</header>
<div class="i-section-alert w-100 u-bg-tertiary-300 p-2 d-flex justify-content-center gap-1 mb-7 --compact align-items-start">
<span class="icon d-flex align-items-center justify-content-center --colored --text --sm">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8 16a7.995 7.995 0 0 1-7.391-4.94 8.005 8.005 0 0 1 1.734-8.717A8.005 8.005 0 0 1 11.06.609a7.995 7.995 0 0 1 2.593 13.045A8.005 8.005 0 0 1 8 16ZM8 1.824A6.177 6.177 0 1 0 14.176 8 6.183 6.183 0 0 0 8 1.824Z"/><path fill="currentColor" d="M7.732 12.779V8.268H6.444V6.444H8A1.558 1.558 0 0 1 9.556 8v4.779H7.732ZM8 5.69a1.235 1.235 0 1 1 0-2.469 1.235 1.235 0 0 1 0 2.47Z"/></svg> </span>
<div class="i-section-alert__content u-lh-24"> Víte, že se můžete vrátit k vaší konfiguraci tisku? Ty aktivní naleznete ve srovnávači tisku
<span class="icon d-flex align-items-center justify-content-center --colored --text --sm mx-1">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#23846F" d="M18.842 3.667h-6.009V2h-1.666v1.667H5.158L2 12.692v.558A3.755 3.755 0 0 0 5.75 17a3.755 3.755 0 0 0 3.75-3.75v-.558L6.924 5.333h4.243v15H5.333V22h13.334v-1.667h-5.834v-15h4.243L14.5 12.692v.558A3.755 3.755 0 0 0 18.25 17 3.755 3.755 0 0 0 22 13.25v-.558l-3.158-9.025ZM5.75 15.333a2.085 2.085 0 0 1-2.04-1.666h4.08a2.086 2.086 0 0 1-2.04 1.666ZM7.492 12H4.008L5.75 7.022 7.492 12ZM18.25 7.022 19.992 12h-3.484l1.742-4.978Zm0 8.311a2.085 2.085 0 0 1-2.04-1.666h4.082a2.087 2.087 0 0 1-2.042 1.666Z"/></svg> </span>
. Naleznete je také zde, po kliknutí na
<span>
<span class="icon d-flex align-items-center justify-content-center --sm mx-1">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M15 12.317V5h-1.789v6.907L2.264 1 1 2.265 11.983 13.21H4.814V15h7.502A2.69 2.69 0 0 0 15 12.317Z"/></svg> </span>
</span>
<span>. Naleznete je také zde, po kliknutí na a i expirovaná konfigurace se automaticky zobrazí ve srovnávači konfigurací, kde si jí můžete dále editovat.</span>
</div>
</div>
<div class="s-user-configurations__search mb-5 d-flex gap-2 row-gap-4 flex-wrap flex-column flex-sm-row">
<div class="flex-grow-1">
<form class="base-form c-order-search d-flex align-items-center" id="register_form-id" action="" method="POST">
<div class="f-text d-flex flex-column gap-1 u-posr c-order-search__input --active">
<div class="f-text__wrap d-flex align-items-center u-posr">
<input class="f-base f-text__input" type="text" id="searchPhrase-id" placeholder="Vyhledat konfiguraci" name=searchPhrase>
<span class="icon d-flex align-items-center justify-content-center --colored --danger f-text__invalid-icon">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="currentColor" d="M8.026 15A7.034 7.034 0 0 1 1 7.974c.33-9.3 13.724-9.297 14.053 0A7.034 7.034 0 0 1 8.026 15Zm0-12.296c-6.964.221-6.963 10.319 0 10.54 6.964-.222 6.964-10.32 0-10.54Zm.879 1.756H7.148v4.392h1.757V4.46Zm0 5.27H7.148v1.757h1.757V9.73Z"/></svg> </span>
</div>
<span class="f-error u-fz-sm gap-1 d-none">
<span class="f-error__icon d-flex align-items-center justify-content-center">
<span class="icon d-flex align-items-center justify-content-center --colored --danger --sm">
<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 512 512"><path d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24v112c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zm-32 224a32 32 0 1 1 64 0 32 32 0 1 1-64 0z"/></svg> </span>
</span>
<span class="f-error__title"></span>
</span>
</div>
<button class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --transparent --sm --icon-only submit c-order-search__btn" id="submit-id" type="submit" aria-label="Vyhledat" name=submit>
<span class="btn__icon d-flex align-items-center justify-content-center">
<span class="icon d-flex align-items-center justify-content-center --colored --conversion --lg">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="#23846F" d="m22 20.823-5.211-5.211a8.336 8.336 0 1 0-1.177 1.177L20.823 22 22 20.823Zm-11.651-3.816a6.658 6.658 0 1 1 6.658-6.658 6.665 6.665 0 0 1-6.658 6.658Z"/></svg> </span>
</span>
</button>
</form>
</div>
</div>
<div>
<div class="g-user-configurations u-scrollbar pb-2" data-scrollbar-x>
<div class="g-user-configurations__headers i-user-configuration d-grid align-items-center gap-2 gap-xxl-6 mb-2 justify-content-between">
<div class="g-user-configurations__header">
<a class="i-sort-header u-fw-600 u-fz-sm d-flex gap-1 align-items-center u-cursor-pointer text-decoration-none --asc" href="#">
Konfigurace
<span class="icon d-flex align-items-center justify-content-center --colored --text --sm i-sort-header__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="none" viewBox="0 0 18 18"><path fill="#23846F" fill-rule="evenodd" d="m9 12.5 6-5.735L13.677 5.5 9 9.97 4.323 5.5 3 6.765 9 12.5Z" clip-rule="evenodd"/></svg> </span>
</a>
</div>
<div class="g-user-configurations__header">
<a class="i-sort-header u-fw-600 u-fz-sm d-flex gap-1 align-items-center u-cursor-pointer text-decoration-none --asc" href="#">
Stav
<span class="icon d-flex align-items-center justify-content-center --colored --text --sm i-sort-header__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="none" viewBox="0 0 18 18"><path fill="#23846F" fill-rule="evenodd" d="m9 12.5 6-5.735L13.677 5.5 9 9.97 4.323 5.5 3 6.765 9 12.5Z" clip-rule="evenodd"/></svg> </span>
</a>
</div>
<div class="g-user-configurations__header">
<a class="i-sort-header u-fw-600 u-fz-sm d-flex gap-1 align-items-center u-cursor-pointer text-decoration-none --asc" href="#">
Založení
<span class="icon d-flex align-items-center justify-content-center --colored --text --sm i-sort-header__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="none" viewBox="0 0 18 18"><path fill="#23846F" fill-rule="evenodd" d="m9 12.5 6-5.735L13.677 5.5 9 9.97 4.323 5.5 3 6.765 9 12.5Z" clip-rule="evenodd"/></svg> </span>
</a>
</div>
<div class="g-user-configurations__header">
<a class="i-sort-header u-fw-600 u-fz-sm d-flex gap-1 align-items-center u-cursor-pointer text-decoration-none --asc" href="#">
Expirace
<span class="icon d-flex align-items-center justify-content-center --colored --text --sm i-sort-header__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="none" viewBox="0 0 18 18"><path fill="#23846F" fill-rule="evenodd" d="m9 12.5 6-5.735L13.677 5.5 9 9.97 4.323 5.5 3 6.765 9 12.5Z" clip-rule="evenodd"/></svg> </span>
</a>
</div>
</div>
<div class="g-user-configurations__items d-flex flex-column gap-1 w-100">
<div class="i-user-configuration d-grid align-items-center gap-2 gap-xxl-6 mb-2 justify-content-between">
<div class="i-user-configuration__item d-flex flex-column gap-1 align-items-start">
<a class="link d-inline-flex u-fw-600 align-items-center --conversion --underline-initial u-fw-700 u-clamp" href="#" title="PP23-00481">
<span class="link__title">PP23-00481</span>
</a>
<span class="u-fw-500 u-fz-sm px-1 flex-shrink-0 u-clamp u-clamp-1 text-break u-bg-support-orange-400">Vánoční tašky Petr</span>
</div>
<div class="i-user-configuration__state text-nowrap d-flex align-items-center">
<div class="i-order-state u-rounded-3 py-1 px-2 u-fw-500 text-nowrap --active d-inline u-fz-sm u-lh-14">
Aktivní
</div>
</div>
<div class="i-user-configuration__created-date text-nowrap d-flex align-items-center">
<span class="u-fz-sm text-nowrap u-fw-500">14.06.2023</span>
</div>
<div class="i-user-configuration__expiration-date text-nowrap d-flex align-items-center">
<span class="u-fz-sm text-nowrap u-fw-500">14.06.2023</span>
</div>
<div class="d-flex align-items-center justify-content-end">
<a class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm --icon-only i-user-configuration__action_button" href='#' title="konfigurace č. PP23-00481">
<span class="btn__icon d-flex align-items-center justify-content-center">
<span class="icon d-flex align-items-center justify-content-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#15324F" d="M14 11.7V5.429h-1.533v5.92L3.083 2 2 3.084l9.414 9.382H5.27V14h6.43A2.305 2.305 0 0 0 14 11.7Z"/></svg> </span>
</span>
</a>
</div>
</div>
<div class="i-user-configuration d-grid align-items-center gap-2 gap-xxl-6 mb-2 justify-content-between">
<div class="i-user-configuration__item d-flex flex-column gap-1 align-items-start">
<a class="link d-inline-flex u-fw-600 align-items-center --conversion --underline-initial u-fw-700 u-clamp" href="#" title="PP23-00482">
<span class="link__title">PP23-00482</span>
</a>
<span class="u-fw-500 u-fz-sm px-1 flex-shrink-0 u-clamp u-clamp-1 text-break u-bg-support-pink-400">Vánoční tašky Lenka</span>
</div>
<div class="i-user-configuration__state text-nowrap d-flex align-items-center">
<div class="i-order-state u-rounded-3 py-1 px-2 u-fw-500 text-nowrap --expired d-inline u-fz-sm u-lh-14">
Expirace
</div>
</div>
<div class="i-user-configuration__created-date text-nowrap d-flex align-items-center">
<span class="u-fz-sm text-nowrap u-fw-500">24.06.2023</span>
</div>
<div class="i-user-configuration__expiration-date text-nowrap d-flex align-items-center">
<span class="u-fz-sm text-nowrap u-fw-500">24.06.2023</span>
</div>
<div class="d-flex align-items-center justify-content-end">
<a class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm --icon-only i-user-configuration__action_button" href='#' title="konfigurace č. PP23-00482">
<span class="btn__icon d-flex align-items-center justify-content-center">
<span class="icon d-flex align-items-center justify-content-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#15324F" d="M14 11.7V5.429h-1.533v5.92L3.083 2 2 3.084l9.414 9.382H5.27V14h6.43A2.305 2.305 0 0 0 14 11.7Z"/></svg> </span>
</span>
</a>
</div>
</div>
<div class="i-user-configuration d-grid align-items-center gap-2 gap-xxl-6 mb-2 justify-content-between">
<div class="i-user-configuration__item d-flex flex-column gap-1 align-items-start">
<a class="link d-inline-flex u-fw-600 align-items-center --conversion --underline-initial u-fw-700 u-clamp" href="#" title="PP23-00483">
<span class="link__title">PP23-00483</span>
</a>
<span class="u-fw-500 u-fz-sm px-1 flex-shrink-0 u-clamp u-clamp-1 text-break u-bg-support-blue-400">Vánoční tašky pro všechny kamarády</span>
</div>
<div class="i-user-configuration__state text-nowrap d-flex align-items-center">
<div class="i-order-state u-rounded-3 py-1 px-2 u-fw-500 text-nowrap --expired d-inline u-fz-sm u-lh-14">
Expirace
</div>
</div>
<div class="i-user-configuration__created-date text-nowrap d-flex align-items-center">
<span class="u-fz-sm text-nowrap u-fw-500">14.07.2023</span>
</div>
<div class="i-user-configuration__expiration-date text-nowrap d-flex align-items-center">
<span class="u-fz-sm text-nowrap u-fw-500">14.07.2023</span>
</div>
<div class="d-flex align-items-center justify-content-end">
<a class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm --icon-only i-user-configuration__action_button" href='#' title="konfigurace č. PP23-00483">
<span class="btn__icon d-flex align-items-center justify-content-center">
<span class="icon d-flex align-items-center justify-content-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#15324F" d="M14 11.7V5.429h-1.533v5.92L3.083 2 2 3.084l9.414 9.382H5.27V14h6.43A2.305 2.305 0 0 0 14 11.7Z"/></svg> </span>
</span>
</a>
</div>
</div>
<div class="i-user-configuration d-grid align-items-center gap-2 gap-xxl-6 mb-2 justify-content-between">
<div class="i-user-configuration__item d-flex flex-column gap-1 align-items-start">
<a class="link d-inline-flex u-fw-600 align-items-center --conversion --underline-initial u-fw-700 u-clamp" href="#" title="PP23-00484">
<span class="link__title">PP23-00484</span>
</a>
</div>
<div class="i-user-configuration__state text-nowrap d-flex align-items-center">
<div class="i-order-state u-rounded-3 py-1 px-2 u-fw-500 text-nowrap --active d-inline u-fz-sm u-lh-14">
Aktivní
</div>
</div>
<div class="i-user-configuration__created-date text-nowrap d-flex align-items-center">
<span class="u-fz-sm text-nowrap u-fw-500">13.03.2023</span>
</div>
<div class="i-user-configuration__expiration-date text-nowrap d-flex align-items-center">
<span class="u-fz-sm text-nowrap u-fw-500">13.03.2023</span>
</div>
<div class="d-flex align-items-center justify-content-end">
<a class="btn u-posr u-cursor-pointer d-inline-flex gap-1 align-items-center justify-content-center flex-nowrap flex-shrink-0 --outline --sm --icon-only i-user-configuration__action_button" href='#' title="konfigurace č. PP23-00484">
<span class="btn__icon d-flex align-items-center justify-content-center">
<span class="icon d-flex align-items-center justify-content-center">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 16 16"><path fill="#15324F" d="M14 11.7V5.429h-1.533v5.92L3.083 2 2 3.084l9.414 9.382H5.27V14h6.43A2.305 2.305 0 0 0 14 11.7Z"/></svg> </span>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="s-user-configurations__pagination d-flex justify-content-end mt-5 u-empty:none"><div class="c-pagination d-flex align-items-center flex-wrap justify-content-center justify-content-xxl-end">
<a class="link d-inline-flex u-fw-600 align-items-center --icon-before c-pagination__link --prev" href="#prev" title="Předchozí" data-page="" data-loading-target="" data-scroll-target="">
<span class="link__title">Předchozí</span>
<span class="link__icon d-flex align-items-center justify-content-center flex-shrink-0">
<span class="icon d-flex align-items-center justify-content-center --colored --text --xs">
<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512"><path d="M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z"/></svg> </span>
</span>
</a>
<div class="c-pagination__items d-flex gap-1 align-items-center">
<a class="link d-inline-flex u-fw-600 align-items-center c-pagination__link --page-number justify-content-center" href="#1" title="1" data-page="" data-loading-target="" data-scroll-target="">
<span class="link__title">1</span>
</a>
<a class="link d-inline-flex u-fw-600 align-items-center c-pagination__link --page-number justify-content-center" href="#2" title="2" data-page="" data-loading-target="" data-scroll-target="">
<span class="link__title">2</span>
</a>
<a class="link d-inline-flex u-fw-600 align-items-center --active c-pagination__link --page-number justify-content-center" href="#" title="3" data-page="" data-loading-target="" data-scroll-target="">
<span class="link__title">3</span>
</a>
<a class="link d-inline-flex u-fw-600 align-items-center --blank c-pagination__link --page-number justify-content-center" href="#" title="..." data-page="" data-loading-target="" data-scroll-target="">
<span class="link__title">...</span>
</a>
<a class="link d-inline-flex u-fw-600 align-items-center c-pagination__link --page-number justify-content-center" href="#6" title="6" data-page="" data-loading-target="" data-scroll-target="">
<span class="link__title">6</span>
</a>
</div>
<a class="link d-inline-flex u-fw-600 align-items-center c-pagination__link --next" href="#next" title="Další" data-page="" data-loading-target="" data-scroll-target="">
<span class="link__title">Další</span>
<span class="link__icon d-flex align-items-center justify-content-center flex-shrink-0">
<span class="icon d-flex align-items-center justify-content-center --colored --text --xs">
<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512"><path d="M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z"/></svg> </span>
</span>
</a>
</div>
</div>
</div>
</section>
</div>
<div class="content-w-aside__aside d-flex flex-column row-gap-4 h-100">
</div>
</div>
</div>
</div>