mirrors/dozzle
1
0
Fork 0
mirror of https://github.com/amir20/dozzle.git synced 2025-12-24 06:28:42 +01:00
Code Issues Projects Releases Wiki Activity

chore: removes mobile-hidden (#3522)

Browse Source
This commit is contained in:
Amir Raminfar
2025-01-08 08:14:15 -08:00
committed by GitHub
parent 19ebbccc29
commit 2f0dd4f36f
13 changed files with 22 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
assets/components/ContainerViewer/ContainerLog.vue
View File

@@ -9,7 +9,7 @@
v-if="container.state === 'running'" v-if="container.state === 'running'"
/> />
<ContainerActionsToolbar @clear="viewer?.clear()" class="mobile-hidden" :container="container" /> <ContainerActionsToolbar @clear="viewer?.clear()" class="max-md:hidden" :container="container" />
<a class="btn btn-circle btn-xs" @click="close()" v-if="closable"> <a class="btn btn-circle btn-xs" @click="close()" v-if="closable">
<mdi:close /> <mdi:close />
</a> </a>

4
assets/components/ContainerViewer/ContainerTitle.vue
View File

@@ -8,7 +8,7 @@
<div class="inline-flex items-center text-sm"> <div class="inline-flex items-center text-sm">
<div class="breadcrumbs p-0"> <div class="breadcrumbs p-0">
<ul> <ul>
<li v-if="config.hosts.length > 1" class="mobile-hidden font-thin"> <li v-if="config.hosts.length > 1" class="font-thin max-md:hidden">
{{ container.hostLabel }} {{ container.hostLabel }}
</li> </li>
<li> <li>
@@ -38,7 +38,7 @@
</div> </div>
</div> </div>
<ContainerHealth :health="container.health" v-if="container.health" /> <ContainerHealth :health="container.health" v-if="container.health" />
<Tag class="mobile-hidden hidden font-mono @3xl:block" size="small"> <Tag class="hidden font-mono max-md:hidden @3xl:block" size="small">
{{ container.image.replace(/@sha.*/, "") }} {{ container.image.replace(/@sha.*/, "") }}
</Tag> </Tag>
</div> </div>

2
assets/components/GroupedViewer/GroupedLog.vue
View File

@@ -8,7 +8,7 @@
</div> </div>
</div> </div>
<MultiContainerStat class="ml-auto" :containers="group.containers" /> <MultiContainerStat class="ml-auto" :containers="group.containers" />
<MultiContainerActionToolbar class="mobile-hidden" @clear="viewer?.clear()" /> <MultiContainerActionToolbar class="max-md:hidden" @clear="viewer?.clear()" />
</div> </div>
</template> </template>
<template #default> <template #default>

4
assets/components/HostList.vue
View File

@@ -23,10 +23,10 @@
</span> </span>
</div> </div>
<ul class="flex flex-row gap-x-2 text-sm md:gap-3"> <ul class="flex flex-row gap-x-2 text-sm md:gap-3">
<li class="flex items-center gap-1"><ph:cpu /> {{ host.nCPU }} <span class="mobile-hidden">CPUs</span></li> <li class="flex items-center gap-1"><ph:cpu /> {{ host.nCPU }} <span class="max-md:hidden">CPUs</span></li>
<li class="flex items-center gap-1"> <li class="flex items-center gap-1">
<ph:memory /> {{ formatBytes(host.memTotal) }} <ph:memory /> {{ formatBytes(host.memTotal) }}
<span class="mobile-hidden">total</span> <span class="max-md:hidden">total</span>
</li> </li>
</ul> </ul>
<ul class="flex flex-row flex-wrap gap-x-2 text-sm md:gap-3"> <ul class="flex flex-row flex-wrap gap-x-2 text-sm md:gap-3">

4
assets/components/HostViewer/HostLog.vue
View File

@@ -7,12 +7,12 @@
<div class="inline-flex font-mono text-sm"> <div class="inline-flex font-mono text-sm">
<div class="font-semibold">{{ host.name }}</div> <div class="font-semibold">{{ host.name }}</div>
</div> </div>
<Tag class="mobile-hidden font-mono" size="small"> <Tag class="font-mono max-md:hidden" size="small">
{{ $t("label.container", containers.length) }} {{ $t("label.container", containers.length) }}
</Tag> </Tag>
</div> </div>
<MultiContainerStat class="ml-auto" :containers="containers" /> <MultiContainerStat class="ml-auto" :containers="containers" />
<MultiContainerActionToolbar class="mobile-hidden" @clear="viewer?.clear()" /> <MultiContainerActionToolbar class="max-md:hidden" @clear="viewer?.clear()" />
</div> </div>
</template> </template>
<template #default> <template #default>

2
assets/components/LogViewer/LogAnalytics.vue
View File

@@ -1,7 +1,7 @@
<template> <template>
<aside> <aside>
<header class="flex items-center gap-4"> <header class="flex items-center gap-4">
<h1 class="mobile-hidden text-2xl">{{ container.name }}</h1> <h1 class="text-2xl max-md:hidden">{{ container.name }}</h1>
<h2 class="text-sm"><DistanceTime :date="container.created" /></h2> <h2 class="text-sm"><DistanceTime :date="container.created" /></h2>
</header> </header>

6
assets/components/LogViewer/LogDetails.vue
View File

@@ -1,7 +1,7 @@
<template> <template>
<header class="flex items-center gap-4"> <header class="flex items-center gap-4">
<Tag :data-level="entry.level" class="text-white uppercase" v-if="entry.level">{{ entry.level }}</Tag> <Tag :data-level="entry.level" class="text-white uppercase" v-if="entry.level">{{ entry.level }}</Tag>
<h1 class="mobile-hidden text-lg"> <h1 class="text-lg max-md:hidden">
<DateTime :date="entry.date" /> <DateTime :date="entry.date" />
</h1> </h1>
<h2 class="text-sm"><DistanceTime :date="entry.date" /> on {{ entry.std }}</h2> <h2 class="text-sm"><DistanceTime :date="entry.date" /> on {{ entry.std }}</h2>
@@ -47,7 +47,7 @@
<thead class="text-lg"> <thead class="text-lg">
<tr> <tr>
<th class="w-60">Field</th> <th class="w-60">Field</th>
<th class="mobile-hidden">Value</th> <th class="max-md:hidden">Value</th>
<th class="w-20"> <th class="w-20">
<input type="checkbox" class="toggle toggle-primary" v-model="toggleAllFields" title="Toggle all" /> <input type="checkbox" class="toggle toggle-primary" v-model="toggleAllFields" title="Toggle all" />
</th> </th>
@@ -58,7 +58,7 @@
<td class="cursor-move font-mono break-all"> <td class="cursor-move font-mono break-all">
{{ key.join(".") }} {{ key.join(".") }}
</td> </td>
<td class="mobile-hidden truncate"> <td class="truncate max-md:hidden">
<code v-html="JSON.stringify(value)"></code> <code v-html="JSON.stringify(value)"></code>
</td> </td>
<td> <td>

6
assets/components/LogViewer/__snapshots__/EventSource.spec.ts.snap
View File

@@ -8,7 +8,7 @@ exports[`<ContainerEventSource /> > render html correctly > should render dates
<!--v-if--> <!--v-if-->
<!--v-if--> <!--v-if-->
<div class="tag bg-base-100 inline-flex items-center justify-center rounded-sm px-2 py-[0.2em] [[size='small']]:text-[0.8rem] items-start! shrink-0 select-none" size="small"> <div class="tag bg-base-100 inline-flex items-center justify-center rounded-sm px-2 py-[0.2em] [[size='small']]:text-[0.8rem] items-start! shrink-0 select-none" size="small">
<div class="inline-flex gap-2 text-blue whitespace-nowrap"><time datetime="2019-06-12T10:55:42.459Z" class="mobile-hidden">06/12/2019</time><time datetime="2019-06-12T10:55:42.459Z">10:55:42 AM</time></div> <div class="inline-flex gap-2 text-blue whitespace-nowrap"><time datetime="2019-06-12T10:55:42.459Z" class="max-md:hidden">06/12/2019</time><time datetime="2019-06-12T10:55:42.459Z">10:55:42 AM</time></div>
</div> </div>
<div data-v-e625cddd="" class="mt-1.5 size-2.5 flex-none rounded-lg flex select-none"></div> <div data-v-e625cddd="" class="mt-1.5 size-2.5 flex-none rounded-lg flex select-none"></div>
<div data-v-a49e52d4="" class="log-wrapper [word-break:break-word] whitespace-pre-wrap group-[.disable-wrap]:whitespace-nowrap">foo bar</div> <div data-v-a49e52d4="" class="log-wrapper [word-break:break-word] whitespace-pre-wrap group-[.disable-wrap]:whitespace-nowrap">foo bar</div>
@@ -28,7 +28,7 @@ exports[`<ContainerEventSource /> > render html correctly > should render dates
<!--v-if--> <!--v-if-->
<!--v-if--> <!--v-if-->
<div class="tag bg-base-100 inline-flex items-center justify-center rounded-sm px-2 py-[0.2em] [[size='small']]:text-[0.8rem] items-start! shrink-0 select-none" size="small"> <div class="tag bg-base-100 inline-flex items-center justify-center rounded-sm px-2 py-[0.2em] [[size='small']]:text-[0.8rem] items-start! shrink-0 select-none" size="small">
<div class="inline-flex gap-2 text-blue whitespace-nowrap"><time datetime="2019-06-12T10:55:42.459Z" class="mobile-hidden">06/12/2019</time><time datetime="2019-06-12T10:55:42.459Z">10:55:42</time></div> <div class="inline-flex gap-2 text-blue whitespace-nowrap"><time datetime="2019-06-12T10:55:42.459Z" class="max-md:hidden">06/12/2019</time><time datetime="2019-06-12T10:55:42.459Z">10:55:42</time></div>
</div> </div>
<div data-v-e625cddd="" class="mt-1.5 size-2.5 flex-none rounded-lg flex select-none"></div> <div data-v-e625cddd="" class="mt-1.5 size-2.5 flex-none rounded-lg flex select-none"></div>
<div data-v-a49e52d4="" class="log-wrapper [word-break:break-word] whitespace-pre-wrap group-[.disable-wrap]:whitespace-nowrap">foo bar</div> <div data-v-a49e52d4="" class="log-wrapper [word-break:break-word] whitespace-pre-wrap group-[.disable-wrap]:whitespace-nowrap">foo bar</div>
@@ -48,7 +48,7 @@ exports[`<ContainerEventSource /> > render html correctly > should render messag
<!--v-if--> <!--v-if-->
<!--v-if--> <!--v-if-->
<div class="tag bg-base-100 inline-flex items-center justify-center rounded-sm px-2 py-[0.2em] [[size='small']]:text-[0.8rem] items-start! shrink-0 select-none" size="small"> <div class="tag bg-base-100 inline-flex items-center justify-center rounded-sm px-2 py-[0.2em] [[size='small']]:text-[0.8rem] items-start! shrink-0 select-none" size="small">
<div class="inline-flex gap-2 text-blue whitespace-nowrap"><time datetime="2019-06-12T10:55:42.459Z" class="mobile-hidden">06/12/2019</time><time datetime="2019-06-12T10:55:42.459Z">10:55:42 AM</time></div> <div class="inline-flex gap-2 text-blue whitespace-nowrap"><time datetime="2019-06-12T10:55:42.459Z" class="max-md:hidden">06/12/2019</time><time datetime="2019-06-12T10:55:42.459Z">10:55:42 AM</time></div>
</div> </div>
<div data-v-e625cddd="" class="mt-1.5 size-2.5 flex-none rounded-lg flex select-none"></div> <div data-v-e625cddd="" class="mt-1.5 size-2.5 flex-none rounded-lg flex select-none"></div>
<div data-v-a49e52d4="" class="log-wrapper [word-break:break-word] whitespace-pre-wrap group-[.disable-wrap]:whitespace-nowrap">This is a message.</div> <div data-v-a49e52d4="" class="log-wrapper [word-break:break-word] whitespace-pre-wrap group-[.disable-wrap]:whitespace-nowrap">This is a message.</div>

2
assets/components/MultiContainerViewer/MultiContainerLog.vue
View File

@@ -9,7 +9,7 @@
</div> </div>
</div> </div>
<MultiContainerStat class="ml-auto" :containers="containers" /> <MultiContainerStat class="ml-auto" :containers="containers" />
<MultiContainerActionToolbar class="mobile-hidden" @clear="viewer?.clear()" /> <MultiContainerActionToolbar class="max-md:hidden" @clear="viewer?.clear()" />
</div> </div>
</template> </template>
<template #default> <template #default>

4
assets/components/ServiceViewer/ServiceLog.vue
View File

@@ -7,12 +7,12 @@
<div class="inline-flex font-mono text-sm"> <div class="inline-flex font-mono text-sm">
<div class="font-semibold">{{ service.name }}</div> <div class="font-semibold">{{ service.name }}</div>
</div> </div>
<Tag class="mobile-hidden hidden font-mono @3xl:block" size="small"> <Tag class="hidden font-mono max-md:hidden @3xl:block" size="small">
{{ $t("label.container", service.containers.length) }} {{ $t("label.container", service.containers.length) }}
</Tag> </Tag>
</div> </div>
<MultiContainerStat class="ml-auto" :containers="service.containers" /> <MultiContainerStat class="ml-auto" :containers="service.containers" />
<MultiContainerActionToolbar class="mobile-hidden" @clear="viewer?.clear()" /> <MultiContainerActionToolbar class="max-md:hidden" @clear="viewer?.clear()" />
</div> </div>
</template> </template>
<template #default> <template #default>

6
assets/components/StackViewer/StackLog.vue
View File

@@ -7,15 +7,15 @@
<div class="inline-flex font-mono text-sm"> <div class="inline-flex font-mono text-sm">
<div class="font-semibold">{{ stack.name }}</div> <div class="font-semibold">{{ stack.name }}</div>
</div> </div>
<Tag class="mobile-hidden hidden font-mono @3xl:block" size="small"> <Tag class="hidden font-mono max-md:hidden @3xl:block" size="small">
{{ $t("label.container", stack.containers.length) }} {{ $t("label.container", stack.containers.length) }}
</Tag> </Tag>
<Tag class="mobile-hidden hidden font-mono @3xl:block" size="small"> <Tag class="hidden font-mono max-md:hidden @3xl:block" size="small">
{{ $t("label.serivce", stack.services.length) }} {{ $t("label.serivce", stack.services.length) }}
</Tag> </Tag>
</div> </div>
<MultiContainerStat class="ml-auto" :containers="stack.containers" /> <MultiContainerStat class="ml-auto" :containers="stack.containers" />
<MultiContainerActionToolbar class="mobile-hidden" @clear="viewer?.clear()" /> <MultiContainerActionToolbar class="max-md:hidden" @clear="viewer?.clear()" />
</div> </div>
</template> </template>
<template #default> <template #default>

2
assets/components/common/DateTime.vue
View File

@@ -1,6 +1,6 @@
<template> <template>
<div class="inline-flex gap-2"> <div class="inline-flex gap-2">
<time :datetime="date.toISOString()" class="mobile-hidden">{{ dateStr }}</time> <time :datetime="date.toISOString()" class="max-md:hidden">{{ dateStr }}</time>
<time :datetime="date.toISOString()">{{ timeStr }}</time> <time :datetime="date.toISOString()">{{ timeStr }}</time>
</div> </div>
</template> </template>

6
assets/main.css
View File

@@ -104,12 +104,6 @@
} }
} }
@utility mobile-hidden {
@media (max-width: 768px) {
display: none;
}
}
@utility menu-active { @utility menu-active {
&, &,
&:active { &:active {