fix: constrain callout width with max-w-2xl and wrap text properly

Set explicit max-width constraint (max-w-2xl) on callout wrapper
and added whitespace-normal to ensure text wraps properly within
the modal instead of expanding it horizontally.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Andras Bacsai 2025-10-25 10:58:26 +02:00
parent c892a8ce44
commit 2f2ab6d775
2 changed files with 10 additions and 6 deletions

View file

@ -73,9 +73,11 @@ class="bg-transparent border-transparent hover:bg-transparent hover:border-trans
instantSave id="isSystemWide" /> instantSave id="isSystemWide" />
</div> </div>
@if ($isSystemWide) @if ($isSystemWide)
<div class="max-w-full"> <div class="w-full max-w-2xl">
<x-callout type="warning" title="Not Recommended" class="break-words"> <x-callout type="warning" title="Not Recommended">
System-wide GitHub Apps are shared across all teams on this Coolify instance. This means any team can use this GitHub App to deploy applications from your repositories. For better security and isolation, it's recommended to create team-specific GitHub Apps instead. <div class="whitespace-normal break-words">
System-wide GitHub Apps are shared across all teams on this Coolify instance. This means any team can use this GitHub App to deploy applications from your repositories. For better security and isolation, it's recommended to create team-specific GitHub Apps instead.
</div>
</x-callout> </x-callout>
</div> </div>
@endif @endif

View file

@ -14,9 +14,11 @@
<x-forms.checkbox id="is_system_wide" label="System Wide" <x-forms.checkbox id="is_system_wide" label="System Wide"
helper="If checked, this GitHub App will be available for everyone in this Coolify instance." /> helper="If checked, this GitHub App will be available for everyone in this Coolify instance." />
</div> </div>
<div x-show="showWarning" x-transition style="display: none;" class="max-w-full"> <div x-show="showWarning" x-transition style="display: none;" class="w-full max-w-2xl">
<x-callout type="warning" title="Not Recommended" class="break-words"> <x-callout type="warning" title="Not Recommended">
System-wide GitHub Apps are shared across all teams on this Coolify instance. This means any team can use this GitHub App to deploy applications from your repositories. For better security and isolation, it's recommended to create team-specific GitHub Apps instead. <div class="whitespace-normal break-words">
System-wide GitHub Apps are shared across all teams on this Coolify instance. This means any team can use this GitHub App to deploy applications from your repositories. For better security and isolation, it's recommended to create team-specific GitHub Apps instead.
</div>
</x-callout> </x-callout>
</div> </div>
</div> </div>