fix(ui): horizontal overflow on application and service headings (#7970)

This commit is contained in:
Mailo
2026-01-19 19:27:19 +01:00
committed by GitHub
parent da53504282
commit 3a60561a34
6 changed files with 18 additions and 8 deletions

View File

@@ -96,7 +96,17 @@ body {
} }
body { body {
@apply min-h-screen text-sm antialiased scrollbar; @apply min-h-screen text-sm antialiased scrollbar overflow-x-hidden;
}
.coolify-monaco-editor {
@apply min-w-0 w-full;
overflow-x: hidden;
}
.coolify-monaco-editor .monaco-editor,
.coolify-monaco-editor .overflow-guard {
max-width: 100%;
} }
option { option {
@@ -196,4 +206,4 @@ section {
.dark .log-highlight { .dark .log-highlight {
background-color: rgba(234, 179, 8, 0.3); background-color: rgba(234, 179, 8, 0.3);
} }

View File

@@ -2,7 +2,7 @@
<h1>Notifications</h1> <h1>Notifications</h1>
<div class="subtitle">Get notified about your infrastructure.</div> <div class="subtitle">Get notified about your infrastructure.</div>
<div class="navbar-main"> <div class="navbar-main">
<nav class="flex items-center gap-6 min-h-10"> <nav class="flex items-center gap-3.5 min-h-10">
<a class="{{ request()->routeIs('notifications.email') ? 'dark:text-white' : '' }}" {{ wireNavigate() }} <a class="{{ request()->routeIs('notifications.email') ? 'dark:text-white' : '' }}" {{ wireNavigate() }}
href="{{ route('notifications.email') }}"> href="{{ route('notifications.email') }}">
<button>Email</button> <button>Email</button>

View File

@@ -1,7 +1,7 @@
<nav wire:poll.10000ms="checkStatus" class="pb-6"> <nav wire:poll.10000ms="checkStatus" class="pb-6">
<x-resources.breadcrumbs :resource="$application" :parameters="$parameters" :title="$lastDeploymentInfo" :lastDeploymentLink="$lastDeploymentLink" /> <x-resources.breadcrumbs :resource="$application" :parameters="$parameters" :title="$lastDeploymentInfo" :lastDeploymentLink="$lastDeploymentLink" />
<div class="navbar-main"> <div class="navbar-main">
<nav class="flex shrink-0 gap-6 items-center whitespace-nowrap scrollbar min-h-10"> <nav class="flex shrink-0 gap-4 items-center whitespace-nowrap scrollbar min-h-10">
<a class="{{ request()->routeIs('project.application.configuration') ? 'dark:text-white' : '' }}" {{ wireNavigate() }} <a class="{{ request()->routeIs('project.application.configuration') ? 'dark:text-white' : '' }}" {{ wireNavigate() }}
href="{{ route('project.application.configuration', $parameters) }}"> href="{{ route('project.application.configuration', $parameters) }}">
Configuration Configuration

View File

@@ -3,7 +3,7 @@
{{ data_get_str($project, 'name')->limit(10) }} > Resources | Coolify {{ data_get_str($project, 'name')->limit(10) }} > Resources | Coolify
</x-slot> </x-slot>
<div class="flex flex-col"> <div class="flex flex-col">
<div class="flex items-center gap-2"> <div class="flex min-w-0 flex-nowrap items-center gap-1">
<h1>Resources</h1> <h1>Resources</h1>
@if ($environment->isEmpty()) @if ($environment->isEmpty())
@can('createAnyResource') @can('createAnyResource')

View File

@@ -9,7 +9,7 @@
<h1>{{ $title }}</h1> <h1>{{ $title }}</h1>
<x-resources.breadcrumbs :resource="$service" :parameters="$parameters" /> <x-resources.breadcrumbs :resource="$service" :parameters="$parameters" />
<div class="navbar-main" x-data"> <div class="navbar-main" x-data">
<nav class="flex shrink-0 gap-6 items-center whitespace-nowrap scrollbar min-h-10"> <nav class="flex shrink-0 gap-4 items-center whitespace-nowrap scrollbar min-h-10">
<a class="{{ request()->routeIs('project.service.configuration') ? 'dark:text-white' : '' }}" {{ wireNavigate() }} <a class="{{ request()->routeIs('project.service.configuration') ? 'dark:text-white' : '' }}" {{ wireNavigate() }}
href="{{ route('project.service.configuration', $parameters) }}"> href="{{ route('project.service.configuration', $parameters) }}">
<button>Configuration</button> <button>Configuration</button>

View File

@@ -62,7 +62,7 @@
<div class="subtitle">{{ data_get($server, 'name') }}</div> <div class="subtitle">{{ data_get($server, 'name') }}</div>
<div class="navbar-main"> <div class="navbar-main">
<nav <nav
class="flex items-center gap-6 overflow-x-scroll sm:overflow-x-hidden scrollbar min-h-10 whitespace-nowrap pt-2"> class="flex items-center gap-4 overflow-x-scroll sm:overflow-x-hidden scrollbar min-h-10 whitespace-nowrap pt-2">
<a class="{{ request()->routeIs('server.show') ? 'dark:text-white' : '' }}" href="{{ route('server.show', [ <a class="{{ request()->routeIs('server.show') ? 'dark:text-white' : '' }}" href="{{ route('server.show', [
'server_uuid' => data_get($server, 'uuid'), 'server_uuid' => data_get($server, 'uuid'),
]) }}" {{ wireNavigate() }}> ]) }}" {{ wireNavigate() }}>
@@ -197,4 +197,4 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div>