.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
\ No newline at end of file
+phpunit.xml
+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.10.67" installed="1.10.67" location="./tools/phpstan" copy="false"/>
+  <phar name="phpstan" version="1.11.8" installed="1.11.8" 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/Controls/WallpaperTextArrow.js

@@ -43,7 +43,7 @@ define('package/quiqqer/presentation-bricks/bin/Controls/WallpaperTextArrow', [
             this.$Arrow = this.$Brick.getElement('.wallpaperTextArrow-arrow-fa');
 
             this.$Arrow.addEvent('click', function () {
-                new Fx.Scroll(window).start(0, this.$Brick.getSize().y);
+                new Fx.Scroll(window).start(0, this.$Brick.offsetTop + this.$Brick.getSize().y);
             }.bind(this));
         }
     });

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

@@ -29,5 +29,47 @@
         "psr-4": {
             "QUI\\PresentationBricks\\": "src/QUI/PresentationBricks"
         }
+    },
+    "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)"
     }
 }
\ No newline at end of file

phpcs.xml.dist

+<?xml version="1.0"?>
+<ruleset>
+    <!-- Use PSR-12 ruleset -->
+    <rule ref="PSR12"/>
+
+    <!-- Only scan *.php files -->
+    <arg name="extensions" value="php"/>
+
+    <!-- Ignore warnings -->
+    <arg name="warning-severity" value="0"/>
+
+    <!-- Process 64 (or number of CPU cores) files in parallel -->
+    <arg name="parallel" value="64"/>
+
+    <!-- Output relative file paths, by setting the current folder as the basepath -->
+    <arg name="basepath" value="."/>
+
+    <!-- Show colored output -->
+    <arg name="colors"/>
+
+    <!-- Scan everything in the current folder -->
+    <file>.</file>
+</ruleset>

phpstan.dist.neon

@@ -2,7 +2,7 @@ includes:
     - phpstan-baseline.neon
 
 parameters:
-    level: 1
+    level: 5
     paths:
         - src
     bootstrapFiles:

phpunit.dist.xml

+<?xml version="1.0" encoding="UTF-8"?>
+<phpunit bootstrap="tests/phpunit-bootstrap.php">
+    <testsuites>
+        <testsuite name="Tests">
+            <directory>tests/</directory>
+        </testsuite>
+    </testsuites>
+</phpunit>

src/QUI/PresentationBricks/Controls/WallpaperText.css

 .wallpaperText {
     height: 100%;
     background-color: var(--qui-wallpaperText-bgColor, #eee);
-    background-position: var(--qui-wallpaperText-bgPos, center);
     background-size: cover;
     position: relative;
-    background-image: var(--qui-wallpaperText-bgImage, none);
+}
+
+.wallpaperText__imageWrapper {
+    position: absolute;
+    inset: 0;
+    z-index: 0;
+}
+
+.wallpaperText__image {
+    display: block;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    object-position: var(--qui-wallpaperText-bgPos, center);
 }
 
 .wallpaperText-container {
@@ -16,6 +28,8 @@
     justify-content: var(--qui-wallpaperText-contentPos, flex-start);
     min-height: var(--qui-wallpaperText-minHeight, initial);
     color: var(--qui-wallpaperText-fontColor, inherit);
+    position: relative;
+    z-index: 1;
 }
 
 .wallpaperText-container-content{
@@ -23,12 +37,15 @@
     max-width: 100%;
 }
 
-.wallpaperText.fixed {
-    background-attachment: fixed;
+/* image fixed */
+.wallpaperText.fixed .wallpaperText__imageWrapper {
+    clip-path: inset(0);
 }
 
-@media screen and (max-width: 1024px) {
-    .wallpaperText.fixed {
-        background-attachment: initial;
-    }
-}
\ No newline at end of file
+.wallpaperText.fixed picture {
+    position: fixed;
+    top: 0;
+    display: block;
+    width: 100%;
+    height: 100%;
+}

src/QUI/PresentationBricks/Controls/WallpaperText.html

@@ -6,10 +6,12 @@
              --qui-wallpaperText-minHeight: {$this->getAttribute('minHeight')};
              --qui-wallpaperText-contentMaxWidth: {$this->getAttribute('contentMaxWidth')}px;
              --qui-wallpaperText-fontColor: {$this->getAttribute('fontColor')};
-             {if $imageBackground}
-             --qui-wallpaperText-bgImage: url('{image src=$imageBackground onlysrc='true'}');
-             {/if}
              ">
+    {if $imageBackground}
+    <div class="wallpaperText__imageWrapper">
+        {image src=$imageBackground width=4000 class="wallpaperText__image"}
+    </div>
+    {/if}
     <div class="wallpaperText-container grid-container">
         <div class="wallpaperText-container-content">
             {if $this->getAttribute('showTitle') && $this->getAttribute('frontendTitle')}

tests/phpunit-bootstrap.php

+<?php
+
+if (!defined('QUIQQER_SYSTEM')) {
+    define('QUIQQER_SYSTEM', true);
+}
+
+if (!defined('QUIQQER_AJAX')) {
+    define('QUIQQER_AJAX', true);
+}
+
+require_once __DIR__ . '/../../../../bootstrap.php';