From 4f56e75e889b66651168aaa69e2cb276c55e59a4 Mon Sep 17 00:00:00 2001 From: Ondrej Vlach Date: Tue, 16 Jan 2024 20:43:18 +0100 Subject: [PATCH] feat: use bootstrap layout for forms --- .gitignore | 5 + assets/app.js | 9 + assets/styles/app.css | 3 + composer.json | 9 +- composer.lock | 304 +++++++++++++++++++++++++++++- config/bundles.php | 1 + config/packages/asset_mapper.yaml | 5 + config/packages/twig.yaml | 2 +- importmap.php | 25 +++ symfony.lock | 18 ++ templates/base.html.twig | 1 + 11 files changed, 378 insertions(+), 4 deletions(-) create mode 100644 assets/app.js create mode 100644 assets/styles/app.css create mode 100644 config/packages/asset_mapper.yaml create mode 100644 importmap.php diff --git a/.gitignore b/.gitignore index c221560..83ef4d3 100644 --- a/.gitignore +++ b/.gitignore @@ -15,3 +15,8 @@ TODO.rs ###> phpstan/phpstan ### phpstan.neon ###< phpstan/phpstan ### + +###> symfony/asset-mapper ### +/public/assets/ +/assets/vendor +###< symfony/asset-mapper ### diff --git a/assets/app.js b/assets/app.js new file mode 100644 index 0000000..529dc9b --- /dev/null +++ b/assets/app.js @@ -0,0 +1,9 @@ +/* + * Welcome to your app's main JavaScript file! + * + * This file will be included onto the page via the importmap() Twig function, + * which should already be in your base.html.twig. + */ +import './styles/app.css'; + +import 'bootstrap/dist/css/bootstrap.min.css'; diff --git a/assets/styles/app.css b/assets/styles/app.css new file mode 100644 index 0000000..dd6181a --- /dev/null +++ b/assets/styles/app.css @@ -0,0 +1,3 @@ +body { + background-color: skyblue; +} diff --git a/composer.json b/composer.json index 7e53db2..13b3960 100644 --- a/composer.json +++ b/composer.json @@ -18,6 +18,8 @@ "open-telemetry/sdk": "^1.0", "open-telemetry/transport-grpc": "^1.0", "php-http/httplug": "*", + "symfony/asset": "7.0.*", + "symfony/asset-mapper": "7.0.*", "symfony/console": "7.0.*", "symfony/dotenv": "7.0.*", "symfony/flex": "^2", @@ -27,7 +29,9 @@ "symfony/options-resolver": "7.0.*", "symfony/runtime": "7.0.*", "symfony/twig-bundle": "7.0.*", - "symfony/yaml": "7.0.*" + "symfony/yaml": "7.0.*", + "twig/extra-bundle": "^2.12|^3.0", + "twig/twig": "^2.12|^3.0" }, "config": { "allow-plugins": { @@ -60,7 +64,8 @@ "scripts": { "auto-scripts": { "cache:clear": "symfony-cmd", - "assets:install %PUBLIC_DIR%": "symfony-cmd" + "assets:install %PUBLIC_DIR%": "symfony-cmd", + "importmap:install": "symfony-cmd" }, "post-install-cmd": [ "@auto-scripts" diff --git a/composer.lock b/composer.lock index cbb49b5..0b5b9f7 100644 --- a/composer.lock +++ b/composer.lock @@ -4,8 +4,89 @@ "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies", "This file is @generated automatically" ], - "content-hash": "418d8c52373fddc142475aa0b7767d82", + "content-hash": "8c2f1ce9580a0a469ab4556400b428ed", "packages": [ + { + "name": "composer/semver", + "version": "3.4.0", + "source": { + "type": "git", + "url": "https://github.com/composer/semver.git", + "reference": "35e8d0af4486141bc745f23a29cc2091eb624a32" + }, + "dist": { + "type": "zip", + "url": "https://api.github.com/repos/composer/semver/zipball/35e8d0af4486141bc745f23a29cc2091eb624a32", + "reference": "35e8d0af4486141bc745f23a29cc2091eb624a32", + "shasum": "" + }, + "require": { + "php": "^5.3.2 || ^7.0 || ^8.0" + }, + "require-dev": { + "phpstan/phpstan": "^1.4", + "symfony/phpunit-bridge": "^4.2 || ^5" + }, + "type": "library", + "extra": { + "branch-alias": { + "dev-main": "3.x-dev" + } + }, + "autoload": { + "psr-4": { + "Composer\\Semver\\": "src" + } + }, + "notification-url": "https://packagist.org/downloads/", + "license": [ + "MIT" + ], + "authors": [ + { + "name": "Nils Adermann", + "email": "naderman@naderman.de", + "homepage": "http://www.naderman.de" + }, + { + "name": "Jordi Boggiano", + "email": "j.boggiano@seld.be", + "homepage": "http://seld.be" + }, + { + "name": "Rob Bast", + "email": "rob.bast@gmail.com", + "homepage": "http://robbast.nl" + } + ], + "description": "Semver library that offers utilities, version constraint parsing and validation.", + "keywords": [ + "semantic", + "semver", + "validation", + "versioning" + ], + "support": { + "irc": "ircs://irc.libera.chat:6697/composer", + "issues": "https://github.com/composer/semver/issues", + "source": "https://github.com/composer/semver/tree/3.4.0" + }, + "funding": [ + { + "url": "https://packagist.com", + "type": "custom" + }, + { + "url": "https://github.com/composer", + "type": "github" + }, + { + "url": "https://tidelift.com/funding/github/packagist/composer/composer", + "type": "tidelift" + } + ], + "time": "2023-08-31T09:50:34+00:00" + }, { "name": "google/protobuf", "version": "v3.25.2", @@ -1443,6 +1524,153 @@ }, "time": "2021-07-14T16:46:02+00:00" }, + { + "name": "symfony/asset", + "version": "v7.0.0", + "source": { + "type": "git", + "url": "https://github.com/symfony/asset.git", + "reference": "82cd3961bc7fc1b3c3f85e8f2b9a287a1dfd6f2f" + }, + "dist": { + "type": "zip", + "url": "https://api.github.com/repos/symfony/asset/zipball/82cd3961bc7fc1b3c3f85e8f2b9a287a1dfd6f2f", + "reference": "82cd3961bc7fc1b3c3f85e8f2b9a287a1dfd6f2f", + "shasum": "" + }, + "require": { + "php": ">=8.2" + }, + "conflict": { + "symfony/http-foundation": "<6.4" + }, + "require-dev": { + "symfony/http-client": "^6.4|^7.0", + "symfony/http-foundation": "^6.4|^7.0", + "symfony/http-kernel": "^6.4|^7.0" + }, + "type": "library", + "autoload": { + "psr-4": { + "Symfony\\Component\\Asset\\": "" + }, + "exclude-from-classmap": [ + "/Tests/" + ] + }, + "notification-url": "https://packagist.org/downloads/", + "license": [ + "MIT" + ], + "authors": [ + { + "name": "Fabien Potencier", + "email": "fabien@symfony.com" + }, + { + "name": "Symfony Community", + "homepage": "https://symfony.com/contributors" + } + ], + "description": "Manages URL generation and versioning of web assets such as CSS stylesheets, JavaScript files and image files", + "homepage": "https://symfony.com", + "support": { + "source": "https://github.com/symfony/asset/tree/v7.0.0" + }, + "funding": [ + { + "url": "https://symfony.com/sponsor", + "type": "custom" + }, + { + "url": "https://github.com/fabpot", + "type": "github" + }, + { + "url": "https://tidelift.com/funding/github/packagist/symfony/symfony", + "type": "tidelift" + } + ], + "time": "2023-10-31T17:59:56+00:00" + }, + { + "name": "symfony/asset-mapper", + "version": "v7.0.2", + "source": { + "type": "git", + "url": "https://github.com/symfony/asset-mapper.git", + "reference": "e4e3a98dc279cb0d266f50c7c73bd42cb9c3a0c3" + }, + "dist": { + "type": "zip", + "url": "https://api.github.com/repos/symfony/asset-mapper/zipball/e4e3a98dc279cb0d266f50c7c73bd42cb9c3a0c3", + "reference": "e4e3a98dc279cb0d266f50c7c73bd42cb9c3a0c3", + "shasum": "" + }, + "require": { + "composer/semver": "^3.0", + "php": ">=8.2", + "symfony/filesystem": "^6.4|^7.0", + "symfony/http-client": "^6.4|^7.0" + }, + "conflict": { + "symfony/framework-bundle": "<6.4" + }, + "require-dev": { + "symfony/asset": "^6.4|^7.0", + "symfony/browser-kit": "^6.4|^7.0", + "symfony/console": "^6.4|^7.0", + "symfony/event-dispatcher-contracts": "^3.0", + "symfony/finder": "^6.4|^7.0", + "symfony/framework-bundle": "^6.4|^7.0", + "symfony/http-foundation": "^6.4|^7.0", + "symfony/http-kernel": "^6.4|^7.0", + "symfony/web-link": "^6.4|^7.0" + }, + "type": "library", + "autoload": { + "psr-4": { + "Symfony\\Component\\AssetMapper\\": "" + }, + "exclude-from-classmap": [ + "/Tests/" + ] + }, + "notification-url": "https://packagist.org/downloads/", + "license": [ + "MIT" + ], + "authors": [ + { + "name": "Fabien Potencier", + "email": "fabien@symfony.com" + }, + { + "name": "Symfony Community", + "homepage": "https://symfony.com/contributors" + } + ], + "description": "Maps directories of assets & makes them available in a public directory with versioned filenames.", + "homepage": "https://symfony.com", + "support": { + "source": "https://github.com/symfony/asset-mapper/tree/v7.0.2" + }, + "funding": [ + { + "url": "https://symfony.com/sponsor", + "type": "custom" + }, + { + "url": "https://github.com/fabpot", + "type": "github" + }, + { + "url": "https://tidelift.com/funding/github/packagist/symfony/symfony", + "type": "tidelift" + } + ], + "time": "2023-12-27T08:42:13+00:00" + }, { "name": "symfony/cache", "version": "v7.0.2", @@ -4495,6 +4723,80 @@ ], "time": "2023-11-07T10:26:03+00:00" }, + { + "name": "twig/extra-bundle", + "version": "v3.8.0", + "source": { + "type": "git", + "url": "https://github.com/twigphp/twig-extra-bundle.git", + "reference": "32807183753de0388c8e59f7ac2d13bb47311140" + }, + "dist": { + "type": "zip", + "url": "https://api.github.com/repos/twigphp/twig-extra-bundle/zipball/32807183753de0388c8e59f7ac2d13bb47311140", + "reference": "32807183753de0388c8e59f7ac2d13bb47311140", + "shasum": "" + }, + "require": { + "php": ">=7.2.5", + "symfony/framework-bundle": "^5.4|^6.0|^7.0", + "symfony/twig-bundle": "^5.4|^6.0|^7.0", + "twig/twig": "^3.0" + }, + "require-dev": { + "league/commonmark": "^1.0|^2.0", + "symfony/phpunit-bridge": "^6.4|^7.0", + "twig/cache-extra": "^3.0", + "twig/cssinliner-extra": "^2.12|^3.0", + "twig/html-extra": "^2.12|^3.0", + "twig/inky-extra": "^2.12|^3.0", + "twig/intl-extra": "^2.12|^3.0", + "twig/markdown-extra": "^2.12|^3.0", + "twig/string-extra": "^2.12|^3.0" + }, + "type": "symfony-bundle", + "autoload": { + "psr-4": { + "Twig\\Extra\\TwigExtraBundle\\": "" + }, + "exclude-from-classmap": [ + "/Tests/" + ] + }, + "notification-url": "https://packagist.org/downloads/", + "license": [ + "MIT" + ], + "authors": [ + { + "name": "Fabien Potencier", + "email": "fabien@symfony.com", + "homepage": "http://fabien.potencier.org", + "role": "Lead Developer" + } + ], + "description": "A Symfony bundle for extra Twig extensions", + "homepage": "https://twig.symfony.com", + "keywords": [ + "bundle", + "extra", + "twig" + ], + "support": { + "source": "https://github.com/twigphp/twig-extra-bundle/tree/v3.8.0" + }, + "funding": [ + { + "url": "https://github.com/fabpot", + "type": "github" + }, + { + "url": "https://tidelift.com/funding/github/packagist/twig/twig", + "type": "tidelift" + } + ], + "time": "2023-11-21T14:02:01+00:00" + }, { "name": "twig/twig", "version": "v3.8.0", diff --git a/config/bundles.php b/config/bundles.php index bdd37ac..4ce0d70 100644 --- a/config/bundles.php +++ b/config/bundles.php @@ -3,4 +3,5 @@ return [ Symfony\Bundle\FrameworkBundle\FrameworkBundle::class => ['all' => true], Symfony\Bundle\TwigBundle\TwigBundle::class => ['all' => true], + Twig\Extra\TwigExtraBundle\TwigExtraBundle::class => ['all' => true], ]; diff --git a/config/packages/asset_mapper.yaml b/config/packages/asset_mapper.yaml new file mode 100644 index 0000000..d1ac653 --- /dev/null +++ b/config/packages/asset_mapper.yaml @@ -0,0 +1,5 @@ +framework: + asset_mapper: + # The paths to make available to the asset mapper. + paths: + - assets/ diff --git a/config/packages/twig.yaml b/config/packages/twig.yaml index f9f4cc5..1bed476 100644 --- a/config/packages/twig.yaml +++ b/config/packages/twig.yaml @@ -1,6 +1,6 @@ twig: default_path: '%kernel.project_dir%/templates' - + form_themes: ['bootstrap_5_layout.html.twig'] when@test: twig: strict_variables: true diff --git a/importmap.php b/importmap.php new file mode 100644 index 0000000..60cfe33 --- /dev/null +++ b/importmap.php @@ -0,0 +1,25 @@ + [ + 'path' => './assets/app.js', + 'entrypoint' => true, + ], + 'bootstrap/dist/css/bootstrap.min.css' => [ + 'version' => '5.3.2', + 'type' => 'css', + ], +]; diff --git a/symfony.lock b/symfony.lock index f545ac4..271b8e8 100644 --- a/symfony.lock +++ b/symfony.lock @@ -35,6 +35,21 @@ "phpstan.dist.neon" ] }, + "symfony/asset-mapper": { + "version": "7.0", + "recipe": { + "repo": "github.com/symfony/recipes", + "branch": "main", + "version": "6.4", + "ref": "568d44f71388f41f49dc382768fee20d52569359" + }, + "files": [ + "assets/app.js", + "assets/styles/app.css", + "config/packages/asset_mapper.yaml", + "importmap.php" + ] + }, "symfony/console": { "version": "7.0", "recipe": { @@ -103,5 +118,8 @@ "config/packages/twig.yaml", "templates/base.html.twig" ] + }, + "twig/extra-bundle": { + "version": "v3.8.0" } } diff --git a/templates/base.html.twig b/templates/base.html.twig index 67598ac..2b4acd7 100644 --- a/templates/base.html.twig +++ b/templates/base.html.twig @@ -8,6 +8,7 @@ {% endblock %} {% block javascripts %} +{% block importmap %}{{ importmap('app') }}{% endblock %} {% endblock %}