Minor adjustments

Author: smnandre

ux.symfony.com/src/Twig/Components/Badge/GithubBadge.php

@@ -0,0 +1,34 @@
+<?php
+
+/*
+ * This file is part of the Symfony package.
+ *
+ * (c) Fabien Potencier <fabien@symfony.com>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+namespace App\Twig\Components\Badge;
+
+use Symfony\UX\TwigComponent\Attribute\AsTwigComponent;
+
+#[AsTwigComponent(
+    name: 'Badge:Github',
+    template: 'components/Badge.html.twig',
+    exposePublicProps: false,
+)]
+final class GithubBadge extends Badge
+{
+    public string $username;
+
+    public string $label = 'Github';
+
+    public string $icon = 'github';
+
+    public function mount(string $username): void
+    {
+        $this->value = $username;
+        $this->url = 'https://github.com/'.$username;
+    }
+}

ux.symfony.com/src/Twig/Components/Badge/PackageBadge.php

@@ -0,0 +1,31 @@
+<?php
+
+/*
+ * This file is part of the Symfony package.
+ *
+ * (c) Fabien Potencier <fabien@symfony.com>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+namespace App\Twig\Components\Badge;
+
+use Symfony\UX\TwigComponent\Attribute\AsTwigComponent;
+
+#[AsTwigComponent(
+    name: 'Badge:Package',
+    template: 'components/Badge.html.twig',
+    exposePublicProps: false,
+)]
+final class PackageBadge extends Badge
+{
+    public string $label = 'UX';
+
+    public string $icon = 'lucide:box';
+
+    public function mount(string $package): void
+    {
+        $this->value = $package;
+    }
+}

ux.symfony.com/templates/components/UploadFiles.html.twig

@@ -22,7 +22,7 @@
     </div>
     <div class="form-group mb-3">
         <label for="multiple-files" class="form-label">Multiple files:</label>
-        <input type="file" name="multiple[]" autocomplete="off" multiple="" id="multiple-files" class="form-control-file">
+        <input type="file" class="form-control-file" name="multiple[]" autocomplete="off" multiple="" id="multiple-files" >
         <div class="form-text text-muted">Current files:
         {% if multipleUploadFilenames %}
         <ul>

ux.symfony.com/templates/cookbook/show.html.twig

@@ -50,17 +50,13 @@
             </div>
         </div>
 
-        <div class="container container-xl x-4 pt-4 px-md-5 pt-md-5">
-            <div class="content"  style="max-width: 75ch;margin-inline: auto;font-size: 1.25rem;line-height: 1.75;font-weight: 300;">
-                {{ cookbook.content|raw|markdown_to_html }}
-            </div>
+        <div class="content"  style="max-width: 75ch;margin-inline: auto;font-size: 1.25rem;line-height: 1.75;font-weight: 300;">
+            {{ cookbook.content|raw|markdown_to_html }}
         </div>
 
-        <div class="container container-xl x-4 pt-4 px-md-5 pt-md-5">
-            <div class="cluster">
-                <twig:Badge:Author author="{{ cookbook.author }}" />
-                <twig:Badge:Date label="Published" date="{{ cookbook.publishedAt }}" />
-            </div>
+        <div class="cluster">
+            <twig:Badge:Author author="{{ cookbook.author }}" />
+            <twig:Badge:Date label="Published" date="{{ cookbook.publishedAt }}" />
         </div>
 
     </article>

ux.symfony.com/templates/main/homepage.html.twig

@@ -105,15 +105,21 @@
 
     <p class="eyebrows" style="margin: 111px 0 0;">Packages</p>
     <div class="d-md-flex justify-content-md-between text-center align-items-center text-md-start">
-        <h2 class="ubuntu pt-2 component-headlines">Install extra <em class="rainbow-emphasis">Packages</em></h2>
+        <h2 class="ubuntu pt-2 component-headlines">Install UX <em class="rainbow-emphasis">Components</em></h2>
+
+{#        <a class="Button Button--dark" href="{{ url('app_packages') }}">#}
+{#            Browse all Packages#}
+{#            <twig:ux:icon name="arrow-right" style="transform: rotate(-45deg);"/>#}
+{#        </a>#}
+
         <a style="height: 100%;" class="btn btn-md btn-outline-primary mt-3 mt-md-0"  href="{{ path('app_packages') }}">
             Browse all Packages
             <twig:ux:icon name="arrow-right" style="transform: rotate(-45deg);"/>
         </a>
     </div>
     <div class="row mt-3 mt-md-5">
-        <div style="display: grid; gap: 3rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));">
-            {% for package in packages %}
+        <div style="display: grid; gap: 2rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));">
+            {% for package in packages|slice(0, 12) %}
                 <twig:Package:PackageBox package="{{ package }}" titleTag="h3" />
             {% endfor %}
         </div>