.gitattributes

+
+# Ignore developer files when exporting
+.gitattributes         export-ignore
+.gitignore             export-ignore
+.gitlab-ci.yml         export-ignore
+.phive                 export-ignore
+captainhook.json       export-ignore
+phpcs.xml.dist         export-ignore
+phpstan-baseline.neon  export-ignore
+phpstan.dist.neon      export-ignore
+phpunit.dist.xml       export-ignore
+tests                  export-ignore
+
+# Explicitly set file type and line endings for PHP files, improves git diff output
+*.php     text eol=lf diff=php
\ No newline at end of file

.gitignore

+
+tools/
+
+phpstan.neon
+
+.phpunit.result.cache
+
+phpunit.xml

.gitlab-ci.yml

 include:
-  - project: 'quiqqer/stabilization/semantic-release'
-    file: '/ci-templates/.gitlab-ci.yml'
+  - component: dev.quiqqer.com/quiqqer/stabilization/ci-cd-components/quiqqer-package-bundle/quiqqer-package-bundle@main
+
+# Remove the entire phpunit-php8.1 block, to allow PHPUnit to run on PHP 8.1 in your pipeline
+phpunit-php8.1:
+  rules:
+    - when: never
+
+# Remove the entire phpunit-php8.2 block, to allow PHPUnit to run on PHP 8.2 in your pipeline
+phpunit-php8.2:
+  rules:
+    - when: never
+
+# Remove the entire phpunit-php8.3 block, to allow PHPUnit to run on PHP 8.3 in your pipeline
+phpunit-php8.3:
+  rules:
+    - when: never
\ No newline at end of file

.phive/phars.xml

+<?xml version="1.0" encoding="UTF-8"?>
+<phive xmlns="https://phar.io/phive">
+  <phar name="phpstan" version="^1.11.5" installed="1.11.5" location="./tools/phpstan" copy="false"/>
+  <phar name="phpunit" version="^10.5.20" installed="10.5.20" location="./tools/phpunit" copy="false"/>
+  <phar name="phpcs" version="^3.10.1" installed="3.10.1" location="./tools/phpcs" copy="false"/>
+  <phar name="phpcbf" version="^3.10.1" installed="3.10.1" location="./tools/phpcbf" copy="false"/>
+  <phar name="captainhook" version="^5.23.3" installed="5.23.3" location="./tools/captainhook" copy="false"/>
+</phive>

CONTRIBUTING.md

+# Contributing
+
+This package follows the [QUIQQER contribution guidelines](https://dev.quiqqer.com/quiqqer/stabilization/documentation/-/wikis/home).
\ No newline at end of file

bin/css/buttons.css

@@ -28,16 +28,11 @@ a.qui-button,
     float: none; /* qui-button reset */
 }
 
-button > .fa,
-.btn > .fa {
+button > .fa:not(:only-child),
+.btn > .fa:not(:only-child) {
     margin-right: .75rem;
 }
 
-button.loading > .fa,
-.btn.loading > .fa {
-    margin-right: 0;
-}
-
 /*****************************/
 /* button primary & standard */
 /*****************************/

bin/css/form.css

@@ -21,7 +21,6 @@ select {
     background-image: url("../images/arrow-select.svg");
     background-position: calc(100% - 10px) center;
     background-repeat: no-repeat;
-    background-size: 20px auto;
     background-size: 8px;
     height: 40px;
     padding-bottom: 0;
@@ -58,6 +57,28 @@ textarea:focus {
     border-color: #a9a8a5;
 }
 
+/* disabled */
+:is(
+    input:where(:not([type])),
+    [type='text'],
+    [type='email'],
+    [type='url'],
+    [type='password'],
+    [type='number'],
+    [type='date'],
+    [type='datetime-local'],
+    [type='month'],
+    [type='search'],
+    [type='tel'],
+    [type='time'],
+    [type='week'],
+    [multiple],
+    textarea,
+    select
+):where([disabled]) {
+    opacity: 0.6;
+}
+
 /* iOs input search fix */
 input[type="search"] {
     -webkit-appearance: none;

bin/css/frontend-users.css

@@ -11,7 +11,7 @@
 /* simple user info */
 /********************/
 .quiqqer-fupc-userinfo {
-    border: 1px solid #ddd;
+    border: var(--_qui-cologne-theme-border-width) solid var(--_qui-cologne-theme-border-color);
     border-radius: 5px;
     margin-bottom: 1em;
     background: #fff;
@@ -21,67 +21,33 @@
     background: url("../images/brushed_alu.png");
 }
 
-.quiqqer-frontendUsers-profile-container {
-    display: flex;
-    margin-bottom: 2rem;
-    margin-top: 2rem;
-}
-
-.quiqqer-frontendUsers-controls-profile .quiqqer-frontendUsers-controls-profile-categories {
-    padding-right: 20px;
-}
-
-.quiqqer-frontendUsers-controls-profile .quiqqer-frontendUsers-controls-profile-categoryContent {
-    padding-left: 20px;
-}
-
-@media (max-width: 768px) {
-    .quiqqer-frontendUsers-controls-profile .quiqqer-frontendUsers-controls-profile-categories {
-        padding: 0;
-        width: 100%;
-    }
-
-    .quiqqer-frontendUsers-controls-profile .quiqqer-frontendUsers-controls-profile-categoryContent {
-        padding-left: 0;
-    }
+/***********/
+/* Profile */
+/***********/
+.quiqqer-frontendUsers-controls-profile {
+    --qui-frontend-users-profile__radius: 0;
+    --qui-frontend-users-profile__sidebar-width: 360px;
+    --qui-frontend-users-profile__content-maxWidth: 700px;
+    --qui-frontend-users-profile__sidebar-nav-item-outline--hover: none;
+    --qui-frontend-users-profile__sidebar-nav-item-bg-color--hover: transparent;
 }
 
 /*****************/
 /* category menu */
 /*****************/
 .quiqqer-fupc-category {
-    margin-bottom: 2em;
-}
-
-.quiqqer-fupc-category:last-child {
-    margin-bottom: 0;
+    /*margin-bottom: 2em;*/
 }
 
 .quiqqer-fupc-category-header {
     line-height: 30px;
 }
 
-.quiqqer-fupc-category .quiqqer-fupc-category-header {
-    border-bottom: 1px solid #ddd;
-    cursor: pointer;
-    font-size: 1.5em;
-    line-height: 30px;
-}
-
-.quiqqer-fu-profile-categories-category-items {
-    clear: both;
-    float: left;
-    width: 100%;
-}
-
 .quiqqer-fupc-category-items-item {
-    border: 1px solid #ddd;
-    border-bottom: none;
+    border-top: var(--_qui-cologne-theme-border-width) solid var(--_qui-cologne-theme-border-color);
+    border-left: var(--_qui-cologne-theme-border-width) solid var(--_qui-cologne-theme-border-color);
+    border-right: var(--_qui-cologne-theme-border-width) solid var(--_qui-cologne-theme-border-color);
     clear: both;
-    color: #333;
-    display: flex;
-    float: left;
-    line-height: 40px;
     overflow: hidden;
     padding: 5px 0;
     position: relative;
@@ -89,26 +55,13 @@
     width: 100%;
 }
 
-.quiqqer-fupc-category.quiqqer-fupc-category--open .quiqqer-fupc-category-header {
-    border-bottom: none !important;
-}
-
-.quiqqer-fupc-category--open .quiqqer-fupc-category-items-item {
-    background: #fff;
-}
-
-.quiqqer-fupc-category .quiqqer-fu-profile-categories-category-items .quiqqer-fupc-category-items-item--active,
-.quiqqer-fupc-category .quiqqer-fu-profile-categories-category-items .quiqqer-fupc-category-items-item:hover {
-    background: #fff;
-}
-
-.quiqqer-fupc-category--open .quiqqer-fupc-category-items-item:last-child {
-    border-bottom: 1px solid #ddd;
+.quiqqer-fupc-category-items-item:last-child {
+    border-bottom: var(--_qui-cologne-theme-border-width) solid var(--_qui-cologne-theme-border-color);
     border-bottom-left-radius: 5px;
     border-bottom-right-radius: 5px;
 }
 
-.quiqqer-fupc-category--open .quiqqer-fupc-category-items-item:first-child {
+.quiqqer-fupc-category-items-item:first-child {
     border-top-left-radius: 5px;
     border-top-right-radius: 5px;
 }
@@ -122,45 +75,21 @@
     width: 0;
 }
 
-.quiqqer-fu-profile-categories-category-items .quiqqer-fupc-category-items-item--active,
-.quiqqer-fu-profile-categories-category-items .quiqqer-fupc-category-items-item:hover {
-    background: none;
-}
-
-.quiqqer-fu-profile-categories-category-items .quiqqer-fupc-category-items-item--active:before,
-.quiqqer-fu-profile-categories-category-items .quiqqer-fupc-category-items-item:hover:before {
+.quiqqer-fupc-category-items-item[data-active]:before,
+.quiqqer-fupc-category-items-item:is(:hover, :focus):before {
     width: 4px;
 }
 
 .quiqqer-fupc-category-items-item .fa {
     line-height: 40px;
+    width: 40px;
 }
 
 /***********/
 /* address */
 /***********/
-.quiqqer-frontend-users-address header,
-.quiqqer-frontendUsers-userdata-section header {
-    padding: 20px 0;
-}
-
-.quiqqer-frontend-users-address header h2,
-.quiqqer-frontendUsers-userdata-section header h2 {
-    padding-bottom: 0;
-}
-
-.quiqqer-frontend-users-address-edit .qui-select,
-.quiqqer-frontend-users-address-edit .qui-select .drop-icon {
-    height: 40px;
-}
-
-.quiqqer-frontend-users-address-edit .qui-select .text {
-    line-height: 40px;
-}
-
 .quiqqer-frontendUsers-userdata-invoiceaddress {
     border-bottom: 1px solid rgba(0, 0, 0, 0.1);
-    float: left;
     margin-bottom: 20px;
     padding-bottom: 20px;
     width: 100%;
@@ -172,72 +101,10 @@
     margin-right: 10px;
 }
 
-.quiqqer-frontend-users-address-list-entry {
-    border: 1px solid #ddd;
-    background: #fff;
-}
-
-.quiqqer-frontendUsers-controls-profile-categoryContent .quiqqer-frontend-users-address-list-entry-buttons button {
-    width: inherit;
-    margin-bottom: 0;
-}
-
-.cologne-main .quiqqer-frontendUsers-userdata-address h2,
-.cologne-main .quiqqer-frontendUsers-userdata-invoiceaddress h2,
-.cologne-main .quiqqer-frontendUsers-userdata-invoiceaddress header,
-.cologne-main .quiqqer-frontendUsers-controls-profile-changepassword h2,
-.cologne-main .quiqqer-frontendUsers-controls-profile-deleteaccount h2 {
-    margin-top: 0;
-    padding-top: 0;
-}
-
-@media (max-width: 768px) {
-    .quiqqer-frontendUsers-controls-profile-categories-mobile {
-        margin-bottom: 2em;
-    }
-
-    .quiqqer-frontend-users-address-list .quiqqer-frontend-users-address-list-entry {
-        width: 100%;
-    }
-
-    .quiqqer-frontend-users-address-list .quiqqer-frontend-users-address-list-entry:nth-child(even) {
-        margin-left: 0;
-    }
-
-    .quiqqer-frontend-users-address-list .quiqqer-frontend-users-address-list-entry:nth-child(odd) {
-        margin-right: 0;
-    }
-}
-
-/* email */
-.quiqqer-frontendUsers-userdata-address-additional .quiqqer-frontendUsers-userdata-email input {
-    float: left;
-    width: calc(100% - 70px);
-    margin-right: 10px;
-}
-
-.quiqqer-frontendUsers-userdata-email .quiqqer-frontendUsers-userdata-email-edit {
-    line-height: 40px;
-    border-width: 1px;
-    border-radius: 0.25rem;
-}
-
-@media screen and (max-width: 767px) {
-    .cologne-main .quiqqer-frontendUsers-controls-profile-control label {
-        margin-bottom: 10px;
-    }
-}
-
-/**********/
-/* Avatar */
-/**********/
-.quiqqer-frontendUsers-userAvatar-gravatar {
-    margin: 1.5rem 0;
-}
-
 /******************/
 /* profile orders */
 /******************/
+/* hide top pagination */
 .quiqqer-order-profile-orders .quiqqer-order-profile-orders-pagination:first-child {
     display: none;
 }
@@ -245,20 +112,26 @@
 /*****************/
 /* Login control */
 /*****************/
-.quiqqer-fu-login-container,
-.quiqqer-fu-registrationSignUp {
+:where(.loginAndRegister) .quiqqer-fu-login-container,
+:where(.loginAndRegister) .quiqqer-fu-registrationSignUp {
     padding: 1.5rem 2rem;
 }
 
-.quiqqer-fu-login-container {
+:where(.loginAndRegister) .quiqqer-fu-login-container {
     background: #f8f8f8;
-    border: 1px solid #ddd;
+    border: var(--_qui-cologne-theme-border-width) solid var(--_qui-cologne-theme-border-color);
     max-width: 400px;
     position: relative;
     width: 100%;
 }
 
-.quiqqer-frontendUsers-login .quiqqer-fu-login-container {
+.loginAndRegister .quiqqer-fu-login-container-width {
+    width: 100%;
+    max-width: 400px;
+    margin-inline: auto;
+}
+
+:where(.loginAndRegister) .quiqqer-frontendUsers-login .quiqqer-fu-login-container {
     background: none;
     border: none;
     margin: 0 auto;
@@ -266,7 +139,7 @@
 }
 
 @media screen and (max-width: 767px) {
-    .quiqqer-fu-registrationSignUp {
+    :where(.loginAndRegister) .quiqqer-fu-registrationSignUp {
         padding: 0;
     }
 }
@@ -278,10 +151,11 @@
     background: none;
     border: none;
     color: inherit;
-    float: right;
     margin-top: 1rem;
     padding: 0;
     position: initial;
+    width: 100%;
+    text-align: right;
 }
 
 .quiqqer-fu-login-container .quiqqer-fu-login-forget-password-reset [type="submit"] {
@@ -317,8 +191,7 @@
 }
 
 .loginAndRegister .quiqqer-fu-login-forget-password-reset {
-    padding: 1.5rem 2rem;
-    background: #f8f8f8;
+    padding-inline: 2rem;
 }
 
 .quiqqer-fu-registrationSignUp-terms-text [name="decline"] {

bin/css/mini-basket.css

@@ -11,6 +11,7 @@
     max-height: calc(100vh - 130px); /* header height + top bar height */
     padding: 0 !important;
     width: 350px;
+    top: calc(var(--_qui-cologne-header-height, 100px) - 1px) !important; /* -1 because of border width */
 }
 
 .quiqqer-order-basket-small-container > .qui-control {

bin/css/order.css

@@ -8,6 +8,15 @@
     padding: 0;
 }
 
+/* bad button design in this template... */
+.quiqqer-order-ordering-nobody-tabs-main__item .quiqqer-fu-login-forget-password-reset [name="cancel"],
+.quiqqer-order-ordering-nobody-tabs-main__item .quiqqer-fu-login-forget-password-reset [name="cancel"]:is(:hover, :focus, :active) {
+    width: 100%;
+    background-color: transparent;
+    color: inherit;
+    border: none;
+}
+
 /****************/
 /* step: basket */
 /****************/
@@ -137,18 +146,28 @@ td.quiqqer-order-basket-articles-article-remove button:hover {
 
 .quiqqer-shoppingCart-basket-end,
 .quiqqer-order-basket-end {
+    --gap: 1.5rem;
+    
     background: #f8f8f8;
     border: 1px solid #ddd;
-    clear: both;
     margin-top: 20px;
-    min-height: 90px;
     padding: 20px;
     position: relative;
     width: 100%;
+    display: flex;
+    flex-direction: column;
+    gap: var(--gap);
+}
+
+.quiqqer-order-basket-end > *:not(:first-child, :only-child) {
+    border-top: var(--_qui-cologne-theme-border-width) solid var(--_qui-cologne-theme-border-color);
+    padding-top: var(--gap);
 }
 
 @media screen and (max-width: 767px) {
-    .quiqqer-shoppingCart-basket-end, .quiqqer-order-basket-end {
+    .quiqqer-shoppingCart-basket-end,
+    .quiqqer-order-basket-end {
+        --gap: 1rem;
         padding: 10px;
     }
 }
@@ -208,45 +227,7 @@ td.quiqqer-order-basket-articles-article-remove button:hover {
     border-bottom: 3px double #999999;
 }
 
-/* coupons */
-.quiqqer-coupons-couponcodeinput-title {
-    display: none;
-}
-
-input.quiqqer-coupons-couponcodeinput-input:hover,
-input.quiqqer-coupons-couponcodeinput-input:focus,
-input.quiqqer-coupons-couponcodeinput-input:active {
-    background: #fff;
-    border-color: #28a745;
-}
-
-.btn.quiqqer-coupons-couponcodeinput-btn {
-    background: #fff;
-    border-color: #28a745;
-    color: #28a745;
-}
-
-.btn.quiqqer-coupons-couponcodeinput-btn:hover,
-.btn.quiqqer-coupons-couponcodeinput-btn:active {
-    background: #28a745;
-    color: #fff;
-}
-
 @media screen and (max-width: 767px) {
-    .quiqqer-coupons-couponcodeinput {
-        flex-wrap: wrap;
-    }
-
-    .quiqqer-coupons-couponcodeinput label {
-        margin: 0 0 1rem 0;
-        width: 100%;
-    }
-
-    .quiqqer-coupons-couponcodeinput input,
-    .btn.quiqqer-coupons-couponcodeinput-btn {
-        width: 100%;
-    }
-
     .quiqqer-order-basket-articles-article td:before {
         font-weight: bold;
     }
@@ -363,43 +344,6 @@ input.quiqqer-coupons-couponcodeinput-input:active {
     .quiqqer-order-ordering-buttons a {
         width: 100%;
     }
-
-    .quiqqer-order-basket-end {
-        height: inherit;
-        padding: 1rem;
-        text-align: center;
-    }
-
-    .quiqqer-order-basket-end > * {
-        display: inline-block;
-        float: none !important;
-        margin: 0 !important;
-        width: 100%;
-    }
-
-    .quiqqer-order-basket-end > * + * {
-        margin-top: 20px !important;
-    }
-
-    .quiqqer-payment-paypal-express {
-        padding: 1rem 0;
-    }
-
-    .quiqqer-order-basket-end .quiqqer-coupons-couponcodeinput {
-        flex-direction: column;
-        padding: 0;
-        text-align: left;
-    }
-
-    .quiqqer-order-basket-end .quiqqer-coupons-couponcodeinput input {
-        margin-bottom: 1rem;
-        width: 100%;
-    }
-
-    .quiqqer-coupons-couponcodeinput label span {
-        display: block;
-        padding: 5px 10px;
-    }
 }
 
 /******************/
@@ -454,6 +398,17 @@ table.articles-article {
     vertical-align: top;
 }
 
+.articles-article-image {
+    width: var(--_qui-order-basket-articles-image-width);
+    text-align: center;
+}
+
+.articles-article-image__img {
+    width: var(--_qui-order-articles-image-width);
+    height: var(--_qui-order-articles-image-height);
+    object-fit: contain;
+}
+
 td.articles-article-information {
     text-align: left;
 }
@@ -529,7 +484,7 @@ th.articles-article-header-information {
     padding: 10px;
 }
 
-.articles-sum {
+:where(.quiqqer-order-step-checkout-article) .articles-sum {
     background: #f8f8f8;
     border: 1px solid #ddd;
     float: right;

bin/css/style.css

@@ -747,7 +747,7 @@ a.toTop:before {
     border-bottom: 1px solid #ddd;
     box-shadow: 0 0 20px 0 rgba(57, 57, 57, 0);
     display: flex;
-    height: 100px;
+    height: var(--_qui-cologne-header-height, 100px);
     justify-content: space-between;
     left: 0;
     position: relative;
@@ -758,8 +758,9 @@ a.toTop:before {
 }
 
 .cologne-header-fixed {
+    --_qui-cologne-header-height: 60px;
+
     box-shadow: 0 0 20px 0 rgba(57, 57, 57, 0.2);
-    height: 60px;
     position: fixed;
     z-index: 100; /* Because of the search dropdown */
 }
@@ -927,6 +928,7 @@ a.toTop:before {
 
 .cologne-main {
     margin-top: 1rem;
+    margin-bottom: 1rem;
     width: 100%;
 }
 
@@ -1522,6 +1524,12 @@ a.toTop:before {
 
 .cologne-login-dialog .qui-window-popup-content {
     padding: 20px 40px;
+    display: grid;
+    grid-template-areas:
+        'logo'
+        'body'
+        'reset';
+    grid-template-rows: auto 1fr;
 }
 
 .quiqqer-frontendUsers-loginWindow .quiqqer-frontendUsers-login {
@@ -1614,11 +1622,12 @@ a.toTop:before {
 
 /* sing up / registration in link */
 .login-popup-create-account-wrapper {
-    bottom: 10px;
-    left: 0;
-    position: absolute;
     text-align: center;
     width: 100%;
+    grid-area: reset;
+    margin-top: 1rem;
+    z-index: 1;
+    position: relative;
 }
 
 /*************************/

bin/css/user-orders.css

-section.quiqqer-order-profile-orders-order {
-    margin-bottom: 2em;
-}
-
-.quiqqer-order-profile-orders-order-header-orderId {
-    float: left;
-    position: relative;
-    width: 25%;
-}
-
-.quiqqer-order-profile-orders-order-header-date,
-.quiqqer-order-profile-orders-order-header-total,
-.quiqqer-order-profile-orders-order-header-addressInvoice,
-.quiqqer-order-profile-orders-order-header-addressDelivery,
-.quiqqer-order-profile-orders-order-header-orderId {
-    padding: 0 10px;
-}
-
-.quiqqer-order-profile-orders-order-header-date {
-    padding-left: 0;
-}
-
-.quiqqer-order-profile-orders-order-header-orderId {
-    padding-right: 0;
-}
-
-.quiqqer-order-profile-orders-order-header-date > span:first-child,
-.quiqqer-order-profile-orders-order-header-total > span:first-child,
-.quiqqer-order-profile-orders-order-header-addressInvoice > span:first-child,
-.quiqqer-order-profile-orders-order-header-addressDelivery > span:first-child,
-.quiqqer-order-profile-orders-order-header-orderId > span:first-child {
-    display: block;
-}
-
-/**
- 1. avoid !important and increase the specificity (not good)
- 2. set address position at the bottom line 100% height + 10px padding of "header"
- */
-.quiqqer-order-profile-orders-order-header-addressInvoice address:is(address) { /* 1 */
-    top: calc(100% + 10px); /* 2 */
-}
-
-.quiqqer-order-profile-orders-order-header-addressInvoice span {
-    align-items: center;
-    display: flex;
-    max-width: 100%;
-}
-
-.quiqqer-order-profile-orders-order-header-addressInvoice > span > span {
-    display: block;
-    max-width: 100%;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-}
-
-.quiqqer-order-profile-orders-order-header-addressInvoice .fa {
-    margin-left: 5px;
-}
-
-.quiqqer-order-profile-orders-order-articles {
-    background: #fff;
-}
-
-.quiqqer-order-profile-orders-order-articles-article {
-    border-bottom: 1px dashed #ddd;
-    padding: 2em 0;
-}
-
-.quiqqer-order-profile-orders-order-articles-article:last-child {
-    border-bottom: none;
-}
-
-.quiqqer-order-profile-orders-order-articles-article {
-    align-items: start;
-    border-bottom: 1px dashed #ddd;
-    display: grid;
-    grid-column-gap: 20px;
-    grid-template-columns: 25% auto;
-    grid-template-rows: auto;
-    justify-items: start;
-    padding: 2em 0;
-}
-
-.quiqqer-order-profile-orders-order-articles-image {
-    align-items: flex-start;
-    align-self: start;
-    border-right: 1px dashed #ddd;
-    display: flex;
-    grid-row: 1 / 5;
-    justify-content: center;
-    padding: 20px;
-    width: 100%;
-}
-
-.quiqqer-order-profile-orders-order-articles-information {
-    padding-top: 0 !important;
-}
-
-.quiqqer-order-profile-orders-order-articles-title {
-    color: inherit;
-    font-size: 1.75em;
-}
-
-.quiqqer-order-profile-orders-order-articles-description {
-    margin: 5px 0;
-    color: #9ba3ad;
-}
-
-.quiqqer-order-profile-orders-order-articles-price {
-    font-size: 1.2em;
-    font-weight: 500;
-    padding-bottom: 10px;
-}
-
-.quiqqer-order-profile-orders-order-articles-rebuy {
-    align-self: end;
-}
-
-/**********/
-/* footer */
-/**********/
-.quiqqer-order-profile-orders-order footer {
-    display: flex;
-    justify-content: space-between;
-}
-
-.quiqqer-order-profile-orders-order footer .quiqqer-order-profile-orders-order-footer-paymentType {
-    margin-top: 0;
-}
-
-.quiqqer-order-profile-orders-order-footer-rightWrapper {
-    display: flex;
-    align-items: center;
-}
-
-@media (max-width: 768px) {
-    /***********************/
-    /* article list header */
-    /***********************/
-    .quiqqer-order-profile-orders-order-header-date, .quiqqer-order-profile-orders-order-header-total, .quiqqer-order-profile-orders-order-header-addressInvoice, .quiqqer-order-profile-orders-order-header-addressDelivery, .quiqqer-order-profile-orders-order-header-orderId {
-        padding: 0;
-        margin-bottom: 10px;
-    }
-
-    .quiqqer-order-profile-orders-order-header-orderId {
-        margin: 0 !important;
-    }
-
-    .quiqqer-order-profile-orders-order-header-date > span:first-child, .quiqqer-order-profile-orders-order-header-total > span:first-child, .quiqqer-order-profile-orders-order-header-addressInvoice > span:first-child, .quiqqer-order-profile-orders-order-header-addressDelivery > span:first-child, .quiqqer-order-profile-orders-order-header-orderId > span:first-child {
-        padding-right: 5px;
-    }
-
-    /****************/
-    /* article list */
-    /****************/
-    .quiqqer-order-profile-orders-order-articles-article {
-        display: block;
-        padding: 3em 0;
-    }
-
-    .quiqqer-order-profile-orders-order-articles-image {
-        border-bottom: 1px dashed #ddd;
-        border-right: none;
-        float: none !important;
-        margin: 0 0 20px 0;
-    }
-
-    .quiqqer-order-profile-orders-order-articles-price {
-        padding-top: 10px;
-    }
-
-    .quiqqer-order-profile-orders-order-articles-rebuy{
-        display: block;
-        margin: 0 auto;
-        max-width: 340px;
-        width: 100%;
-    }
-
-    /**********/
-    /* footer */
-    /**********/
-    .quiqqer-order-profile-orders-order footer {
-        display: block;
-    }
-
-    .quiqqer-order-profile-orders-order footer .quiqqer-order-profile-orders-order-footer-rightWrapper .btn {
-        padding-left: 3px;
-        padding-right: 3px;
-    }
-}
-
-/****************/
-/* Invoice list */
-/****************/
-.quiqqer-invoice-profile-invoices-table-invoice {
-    background: #fff;
-}
\ No newline at end of file

bin/css/variables.css

@@ -17,8 +17,16 @@
     --bg-primary: #ddd;
     --bg-secondary: #f5f5f5;
 
+    --_qui-cologne-header-height: 100px;
+    --_qui-template-scrollMarginTop: var(--qui-template-scrollMarginTop, var(--_qui-cologne-header-height));
+
+    --_qui-cologne-theme-border-color: var(--qui-cologne-theme-border-color, #ddd);
+    --_qui-cologne-theme-border-width: var(--qui-cologne-theme-border-width, 1px);
 
     /* ecoyn / ecommerce */
     --_qui-order-basket-articles-image-width: var(--qui-order-basket-articles-image-width, 100px);
     --_qui-order-basket-articles-image-height: var(--qui-order-basket-articles-image-height, 100px);
+
+    --_qui-order-articles-image-width: var(--qui-order-articles-image-width, 100px);
+    --_qui-order-articles-image-height: var(--qui-order-articles-image-height, 100px);
 }
\ No newline at end of file

bin/javascript/init.js

@@ -343,7 +343,7 @@ window.addEvent('domready', function () {
                 'package/quiqqer/order/bin/frontend/controls/basket/Button'
             ], function (Basket) {
                 new Basket({
-                    open  : BASKET_OPEN.toInt(),
+                    action  : BASKET_ACTION,
                     events: {
                         onCreate: function (Basket) {
                             var BasketNode     = Basket.getElm(),
@@ -364,7 +364,7 @@ window.addEvent('domready', function () {
 
                             new Element('span', {
                                 'class': 'quiqqer-order-basketButton-quantity quiqqer-order-basketButton-batch-custom',
-                                html   : '0'
+                                html   : '<span class="fa fa-spinner fa-spin"></span>'
                             }).inject(BasketNode);
 
                             if (BASKET_STYLE && BASKET_STYLE === 'full') {

captainhook.json

+{
+    "pre-commit": {
+        "enabled": true,
+        "actions": [
+            {
+                "action": "\\CaptainHook\\App\\Hook\\PHP\\Action\\Linting"
+            },
+            {
+                "action": "composer test"
+            }
+        ]
+    }
+}
\ No newline at end of file

composer.json

 {
-  "name": "quiqqer/template-cologne",
-  "type": "quiqqer-template",
-  "description": "The QUIQQER Cologne E-Commerce Template",
-  "license": "GPLv3",
-  "authors": [
-    {
-      "name": "Henning Leutz",
-      "email": "support@pcsg.de",
-      "homepage": "https://www.pcsg.de",
-      "role": "Developer"
+    "name": "quiqqer/template-cologne",
+    "type": "quiqqer-template",
+    "description": "The QUIQQER Cologne E-Commerce Template",
+    "license": "GPLv3",
+    "authors": [
+        {
+            "name": "Henning Leutz",
+            "email": "support@pcsg.de",
+            "homepage": "https://www.pcsg.de",
+            "role": "Developer"
+        }
+    ],
+    "support": {
+        "email": "support@pcsg.de",
+        "url": "https://www.pcsg.de"
+    },
+    "require": {
+        "php": "^8.1",
+        "quiqqer/core": "^2",
+        "quiqqer/erp": "^3",
+        "quiqqer/products": "^2",
+        "quiqqer/order": "^2.7.24",
+        "quiqqer/product-bricks": "^2",
+        "quiqqer/frontend-users": "^2",
+        "quiqqer/menu": "^3",
+        "quiqqer/sitetypes": "^2",
+        "quiqqer/unsemantic": "^2",
+        "quiqqer-asset/fastclick": "^1",
+        "quiqqer/tooltips": "^2",
+        "quiqqer/currency": "^2",
+        "quiqqer/smarty4": "^2.0.7"
+    },
+    "autoload": {
+        "psr-4": {
+            "QUI\\TemplateCologne\\": "src/QUI/TemplateCologne"
+        }
+    },
+    "scripts": {
+        "test": [
+            "@dev:lint",
+            "@dev:phpunit"
+        ],
+        "dev:phpunit": "./tools/phpunit",
+        "dev:lint": [
+            "@dev:lint:phpstan",
+            "@dev:lint:style"
+        ],
+        "dev:lint:phpstan": "./tools/phpstan",
+        "dev:lint:style": "./tools/phpcs",
+        "dev:lint:style:fix": "./tools/phpcbf",
+        "dev:init": [
+            "@dev:init:check-requirements",
+            "@dev:init:tools",
+            "@dev:init:git-hooks"
+        ],
+        "dev:init:check-requirements": [
+            "which composer > /dev/null || (echo 'Error: composer has to be globally installed'; exit 1)",
+            "which phive > /dev/null || (echo 'Error: PHIVE has to be globally installed'; exit 1)"
+        ],
+        "dev:init:tools": "phive install --temporary",
+        "dev:init:git-hooks": "./tools/captainhook install --only-enabled --force"
+    },
+    "scripts-aliases": {
+        "test": [
+            "dev:test"
+        ]
+    },
+    "scripts-descriptions": {
+        "test": "Runs linting, static analysis, and unit tests.",
+        "dev:phpunit": "Run PHPUnit test suites",
+        "dev:lint": "Run PHPStan and code style check",
+        "dev:lint:phpstan": "Run PHPStan",
+        "dev:lint:style": "Run code style check (PHP_CodeSniffer)",
+        "dev:lint:style:fix": "Try to fix code style errors automatically",
+        "dev:init": "Initialize the developer tooling (tools and git hooks)",
+        "dev:init:check-requirements": "Check if the necessary requirements are met",
+        "dev:init:tools": "Install all developer tools (requires PHIVE)",
+        "dev:init:git-hooks": "Install all git hooks (may require tools to be installed)"
     }
-  ],
-  "support": {
-    "email": "support@pcsg.de",
-    "url": "https://www.pcsg.de"
-  },
-  "require": {
-    "php": "^8.1",
-    "quiqqer/core": "^2",
-    "quiqqer/erp": "^3",
-    "quiqqer/products": "^2",
-    "quiqqer/order": "^2",
-    "quiqqer/product-bricks": "^2",
-    "quiqqer/frontend-users": "^2",
-    "quiqqer/menu": "^3",
-    "quiqqer/sitetypes": "^2",
-    "quiqqer/unsemantic": "^2",
-    "quiqqer-asset/fastclick": "^1",
-    "quiqqer/tooltips": "^2",
-    "quiqqer/currency": "^2"
-  },
-  "autoload": {
-    "psr-4": {
-      "QUI\\TemplateCologne\\": "src/QUI/TemplateCologne"
-    }
-  }
-}
+}
\ No newline at end of file

events.xml

 <?xml version="1.0" encoding="UTF-8"?>
 <events>
+    <event on="onSmartyInit" fire="\QUI\TemplateCologne\EventHandler::onSmartyInit"/>
     <event on="onProjectConfigSave" fire="\QUI\TemplateCologne\EventHandler::onProjectConfigSave"/>
     <event on="onSiteSave" fire="\QUI\TemplateCologne\EventHandler::onSiteSave"/>
     <event on="onQuiqqer::products::product::buttons::end"

index.html

@@ -10,16 +10,16 @@
     {$Template->getHeader()}
 
     <script>
-        var BASKET_STYLE               = "{$basketStyle}";
-        var BASKET_OPEN                = "{$basketOpen}";
-        var INITAL_BASKET_PRICE        = "{$initialBasketPrice}";
-        var COUNT_LANGUAGES            = "{$countLanguages}";
-        var SHOW_CATEGORY_MENU         = "{$showCategoryMenu}";
-        var REGISTER_URL               = "{$registerSiteUrl}";
-        var SHOW_MENU_AFTER_SCROLL_POS = "{$showNavAfterScroll}"; // The number of pixels from top which the menu will be displayed.
-        var SHOW_MENU_SMOOTH           = "{$showMenuSmooth}"; // if true menu slides from top (animation)
-        var SET_MENU_POS_BACK_ON_INIT  = !!"{$setMenuPosBackOnInit}"; // if true menu slides from top (animation)
-        var SCROLL_OFFSET              = 80;
+        const BASKET_STYLE = "{$basketStyle}";
+        const BASKET_ACTION = "{$basketAction}";
+        const INITAL_BASKET_PRICE = "{$initialBasketPrice}";
+        const COUNT_LANGUAGES = "{$countLanguages}";
+        const SHOW_CATEGORY_MENU = "{$showCategoryMenu}";
+        const REGISTER_URL = "{$registerSiteUrl}";
+        const SHOW_MENU_AFTER_SCROLL_POS = "{$showNavAfterScroll}"; // The number of pixels from top which the menu will be displayed.
+        const SHOW_MENU_SMOOTH = "{$showMenuSmooth}"; // if true menu slides from top (animation)
+        const SET_MENU_POS_BACK_ON_INIT = !!"{$setMenuPosBackOnInit}"; // if true menu slides from top (animation)
+        const SCROLL_OFFSET = 80;
     </script>
 
     {fetch template="template/head/styles.html" Template=$Template}

index.php

 <?php
 
+/**
+ * cologne template file
+ *
+ * @var QUI\Projects\Project $Project
+ * @var QUI\Projects\Site $Site
+ * @var QUI\Interfaces\Template\EngineInterface $Engine
+ * @var QUI\Template $Template
+ **/
+
 /**
  * Emotion
  */
@@ -13,7 +22,7 @@
 $templateSettings = QUI\TemplateCologne\Utils::getConfig([
     'Project' => $Project,
     'Template' => $Template,
-    'Site'    => $Site
+    'Site' => $Site
 ]);
 
 /**
@@ -37,7 +46,7 @@
 $independentMenuId = $Project->getConfig('templateCologne.settings.menuId');
 
 if ($enableIndependentMenu && $independentMenuId) {
-    $menuParams['menuId'] = $enableIndependentMenu;
+    $menuParams['menuId'] = $independentMenuId;
     $menuParams['showFirstLevelIcons'] = $Project->getConfig('templateCologne.settings.showFirstLevelIcons');
     $menuParams['showStart'] = false;
 }
@@ -93,7 +102,7 @@
 /* user avatar */
 $Avatar = new QUI\FrontendUsers\Controls\UserIcon([
     'showLogout' => false, // template cologne use own logout popup (see bin/javascript/init.js)
-    'User'       => QUI::getUserBySession()
+    'User' => QUI::getUserBySession()
 ]);
 
 /* product page - for layouts */
@@ -134,7 +143,7 @@
 $registerSite = $Project->getSites([
     'where' => [
         'type' => [
-            'type'  => 'IN',
+            'type' => 'IN',
             'value' => $registerSiteTypes
         ]
     ],

layout/leftSidebar.html

@@ -9,7 +9,7 @@
 
         {if !empty( $prefixContentBricks )}
             {foreach from=$prefixContentBricks item=Brick}
-                {assign var=classes value=\QUI\TemplateCologne\Utils::convertBrickCSSClass($Brick->getAttribute('classes'))}
+                {assign var=classes value=QUI\TemplateCologne\Utils::convertBrickCSSClass($Brick->getAttribute('classes'))}
 
                 <section
                         class="template-brick-container template-brick-contentPrefix brick-id-{$Brick->getAttribute('id')} {$classes}">
@@ -63,7 +63,7 @@
 
         {if !empty( $suffixContentBricks )}
             {foreach from=$suffixContentBricks item=Brick}
-                {assign var=classes value=\QUI\TemplateCologne\Utils::convertBrickCSSClass($Brick->getAttribute('classes'))}
+                {assign var=classes value=QUI\TemplateCologne\Utils::convertBrickCSSClass($Brick->getAttribute('classes'))}
 
                 <section class="template-brick-container template-brick-contentSuffix brick-id-{$Brick->getAttribute('id')} {$classes}">
                     <div class="template-grid-row">