minor design update
This commit is contained in:
parent
815bd3c0cf
commit
f7abca8d10
8 changed files with 23 additions and 19 deletions
|
|
@ -313,3 +313,7 @@ hr {
|
|||
.is-justify-self-end {
|
||||
justify-self: end;
|
||||
}
|
||||
|
||||
.is-full-height {
|
||||
height: 100%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<main class="columns mt-2 is-multiline">
|
||||
<div class="column is-12">
|
||||
<form autocomplete="off" id="addForm" @submit.prevent="checkInfo()">
|
||||
<div class="card">
|
||||
<div class="card is-flex is-full-height is-flex-direction-column">
|
||||
<div class="card-header">
|
||||
<div class="card-header-title is-text-overflow is-block">
|
||||
<span class="icon-text">
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-content">
|
||||
<div class="card-content is-flex-grow-1">
|
||||
|
||||
<div class="columns is-multiline is-mobile">
|
||||
|
||||
|
|
@ -106,7 +106,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-footer">
|
||||
<div class="card-footer mt-auto">
|
||||
<div class="card-footer-item">
|
||||
<button class="button is-fullwidth is-primary" :disabled="addInProgress" type="submit"
|
||||
:class="{ 'is-loading': addInProgress }" form="addForm">
|
||||
|
|
|
|||
|
|
@ -190,7 +190,7 @@
|
|||
<div class="columns is-multiline" v-else>
|
||||
<LateLoader :unrender="true" :min-height="hideThumbnail ? 210 : 410" class="column is-6"
|
||||
v-for="item in sortCompleted" :key="item._id">
|
||||
<div class="card"
|
||||
<div class="card is-flex is-full-height is-flex-direction-column"
|
||||
:class="{ 'is-bordered-danger': item.status === 'error', 'is-bordered-info': item.live_in || item.is_live }">
|
||||
<header class="card-header has-tooltip">
|
||||
|
||||
|
|
@ -239,7 +239,7 @@
|
|||
</template>
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="card-content is-flex-grow-1">
|
||||
<div class="columns is-mobile is-multiline">
|
||||
<div class="column is-12" v-if="item.error">
|
||||
<div class="is-text-overflow is-pointer" @click="toggle_class($event)">
|
||||
|
|
|
|||
|
|
@ -118,7 +118,7 @@
|
|||
<div class="columns is-multiline" v-else>
|
||||
<LateLoader :unrender="true" :min-height="hideThumbnail ? 265 : 475" class="column is-6"
|
||||
v-for="item in stateStore.queue" :key="item._id">
|
||||
<div class="card">
|
||||
<div class="card is-flex is-full-height is-flex-direction-column">
|
||||
<header class="card-header">
|
||||
<div class="card-header-title is-text-overflow is-block" v-tooltip="item.title">
|
||||
<NuxtLink target="_blank" :href="item.url">{{ item.title }}</NuxtLink>
|
||||
|
|
@ -148,7 +148,7 @@
|
|||
</template>
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<div class="card-content is-flex-grow-1">
|
||||
<div class="columns is-multiline is-mobile">
|
||||
<div class="column is-12">
|
||||
<div class="progress-bar is-unselectable">
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@
|
|||
<div class="column is-12" v-if="!toggleForm">
|
||||
<div class="columns is-multiline" v-if="items.length > 0">
|
||||
<div class="column is-6" v-for="cond in items" :key="cond.id">
|
||||
<div class="card">
|
||||
<div class="card is-flex is-full-height is-flex-direction-column">
|
||||
<header class="card-header">
|
||||
<div class="card-header-title is-text-overflow is-block" v-text="cond.name" />
|
||||
<div class="card-header-icon">
|
||||
|
|
@ -52,7 +52,7 @@
|
|||
</button>
|
||||
</div>
|
||||
</header>
|
||||
<div class="card-content">
|
||||
<div class="card-content is-flex-grow-1">
|
||||
<div class="content">
|
||||
<p class="is-text-overflow">
|
||||
<span class="icon"><i class="fa-solid fa-filter" /></span>
|
||||
|
|
@ -69,7 +69,7 @@
|
|||
<pre><code>{{ filterItem(cond) }}</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<div class="card-footer mt-auto">
|
||||
<div class="card-footer-item">
|
||||
<button class="button is-warning is-fullwidth" @click="editItem(cond)">
|
||||
<span class="icon"><i class="fa-solid fa-cog" /></span>
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@ div.is-centered {
|
|||
<div class="column is-12" v-if="!toggleForm">
|
||||
<div class="columns is-multiline" v-if="notifications && notifications.length > 0">
|
||||
<div class="column is-6" v-for="item in notifications" :key="item.id">
|
||||
<div class="card">
|
||||
<div class="card is-flex is-full-height is-flex-direction-column">
|
||||
<header class="card-header">
|
||||
<div class="card-header-title is-text-overflow is-block">
|
||||
{{ item.request.method.toUpperCase() }}({{ ucFirst(item.request.type) }}) @
|
||||
|
|
@ -75,7 +75,7 @@ div.is-centered {
|
|||
</button>
|
||||
</div>
|
||||
</header>
|
||||
<div class="card-content">
|
||||
<div class="card-content is-flex-grow-1">
|
||||
<div class="content">
|
||||
<p>
|
||||
<span class="icon"><i class="fa-solid fa-list-ul" /></span>
|
||||
|
|
@ -92,7 +92,7 @@ div.is-centered {
|
|||
<pre><code>{{ filterItem(item) }}</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<div class="card-footer mt-auto">
|
||||
<div class="card-footer-item">
|
||||
<button class="button is-warning is-fullwidth" @click="editItem(item);">
|
||||
<span class="icon"><i class="fa-solid fa-trash-can" /></span>
|
||||
|
|
|
|||
|
|
@ -54,7 +54,7 @@ div.is-centered {
|
|||
<div class="column is-12" v-if="!toggleForm">
|
||||
<div class="columns is-multiline" v-if="presetsNoDefault && presetsNoDefault.length > 0">
|
||||
<div class="column is-6" v-for="item in presetsNoDefault" :key="item.id">
|
||||
<div class="card">
|
||||
<div class="card is-flex is-full-height is-flex-direction-column">
|
||||
<header class="card-header">
|
||||
<div class="card-header-title is-text-overflow is-block" v-text="item.name" />
|
||||
<div class="card-header-icon">
|
||||
|
|
@ -69,7 +69,7 @@ div.is-centered {
|
|||
</button>
|
||||
</div>
|
||||
</header>
|
||||
<div class="card-content">
|
||||
<div class="card-content is-flex-grow-1">
|
||||
<div class="content">
|
||||
<p class="is-text-overflow"
|
||||
v-if="item?.format && false === ['default', 'not_set'].includes(item.format)">
|
||||
|
|
@ -99,7 +99,7 @@ div.is-centered {
|
|||
<pre><code>{{ filterItem(item) }}</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<div class="card-footer mt-auto">
|
||||
<div class="card-footer-item">
|
||||
<button class="button is-warning is-fullwidth" @click="editItem(item)">
|
||||
<span class="icon"><i class="fa-solid fa-cog" /></span>
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@ div.is-centered {
|
|||
<div class="column is-12" v-if="!toggleForm">
|
||||
<div class="columns is-multiline" v-if="tasks && tasks.length > 0">
|
||||
<div class="column is-6" v-for="item in tasks" :key="item.id">
|
||||
<div class="card">
|
||||
<div class="card is-flex is-full-height is-flex-direction-column">
|
||||
<header class="card-header">
|
||||
<div class="card-header-title is-text-overflow is-block">
|
||||
<NuxtLink target="_blank" :href="item.url">{{ item.name }}</NuxtLink>
|
||||
|
|
@ -63,7 +63,7 @@ div.is-centered {
|
|||
</a>
|
||||
</div>
|
||||
</header>
|
||||
<div class="card-content">
|
||||
<div class="card-content is-flex-grow-1">
|
||||
<div class="content">
|
||||
<p class="is-text-overflow">
|
||||
<span class="icon"><i class="fa-solid fa-clock" /></span>
|
||||
|
|
@ -87,7 +87,7 @@ div.is-centered {
|
|||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<div class="card-footer mt-auto">
|
||||
<div class="card-footer-item">
|
||||
<button class="button is-warning is-fullwidth" @click="editItem(item);">
|
||||
<span class="icon"><i class="fa-solid fa-cog" /></span>
|
||||
|
|
|
|||
Loading…
Reference in a new issue