fix: tooltip colors

This commit is contained in:
Andras Bacsai 2022-08-10 12:02:47 +00:00
parent a9ef490988
commit 9eeadd5882
14 changed files with 42 additions and 40 deletions

View File

@ -18,6 +18,7 @@
</div>
<div
class:tooltip-right={dataTooltip}
class:tooltip-primary={dataTooltip}
class:tooltip={dataTooltip}
class:text-center={isCenter}
data-tip={dataTooltip}

View File

@ -82,7 +82,8 @@
<button
disabled={updateStatus.success === false}
on:click={update}
class="icons tooltip-right bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
class="icons tooltip tooltip-right tooltip-primary bg-gradient-to-r from-purple-500 via-pink-500 to-red-500 text-white duration-75 hover:scale-105"
data-tip="Update available!"
>
{#if updateStatus.loading}
<svg

View File

@ -126,7 +126,7 @@
<a
sveltekit:prefetch
href="/"
class="icons tooltip tooltip-right bg-coolgray-200 hover:text-white"
class="icons tooltip tooltip-right tooltip-primary bg-coolgray-200 hover:text-white"
class:text-white={$page.url.pathname === '/'}
class:bg-coolgray-500={$page.url.pathname === '/'}
data-tip="Dashboard"
@ -153,7 +153,7 @@
<a
sveltekit:prefetch
href="/applications"
class="icons tooltip tooltip-right bg-coolgray-200"
class="icons tooltip tooltip-primary tooltip-right bg-coolgray-200"
class:text-applications={$page.url.pathname.startsWith('/applications') ||
$page.url.pathname.startsWith('/new/application')}
class:bg-coolgray-500={$page.url.pathname.startsWith('/applications') ||
@ -181,7 +181,7 @@
<a
sveltekit:prefetch
href="/sources"
class="icons tooltip tooltip-right bg-coolgray-200"
class="icons tooltip tooltip-primary tooltip-right bg-coolgray-200"
class:text-sources={$page.url.pathname.startsWith('/sources') ||
$page.url.pathname.startsWith('/new/source')}
class:bg-coolgray-500={$page.url.pathname.startsWith('/sources') ||
@ -210,7 +210,7 @@
<a
sveltekit:prefetch
href="/destinations"
class="icons tooltip tooltip-right bg-coolgray-200"
class="icons tooltip tooltip-primary tooltip-right bg-coolgray-200"
class:text-destinations={$page.url.pathname.startsWith('/destinations') ||
$page.url.pathname.startsWith('/new/destination')}
class:bg-coolgray-500={$page.url.pathname.startsWith('/destinations') ||
@ -245,7 +245,7 @@
<a
sveltekit:prefetch
href="/databases"
class="icons tooltip tooltip-right bg-coolgray-200"
class="icons tooltip tooltip-primary tooltip-right bg-coolgray-200"
class:text-databases={$page.url.pathname.startsWith('/databases') ||
$page.url.pathname.startsWith('/new/database')}
class:bg-coolgray-500={$page.url.pathname.startsWith('/databases') ||
@ -271,7 +271,7 @@
<a
sveltekit:prefetch
href="/services"
class="icons tooltip tooltip-right bg-coolgray-200"
class="icons tooltip tooltip-primary tooltip-right bg-coolgray-200"
class:text-services={$page.url.pathname.startsWith('/services') ||
$page.url.pathname.startsWith('/new/service')}
class:bg-coolgray-500={$page.url.pathname.startsWith('/services') ||
@ -300,7 +300,7 @@
<a
sveltekit:prefetch
href="/iam"
class="icons tooltip tooltip-right bg-coolgray-200"
class="icons tooltip tooltip-primary tooltip-right bg-coolgray-200"
class:text-iam={$page.url.pathname.startsWith('/iam')}
class:bg-coolgray-500={$page.url.pathname.startsWith('/iam')}
data-tip="IAM"
@ -324,7 +324,7 @@
<a
sveltekit:prefetch
href={$appSession.teamId === '0' ? '/settings/global' : '/settings/ssh-keys'}
class="icons tooltip tooltip-right bg-coolgray-200"
class="icons tooltip tooltip-primary tooltip-right bg-coolgray-200"
class:text-settings={$page.url.pathname.startsWith('/settings')}
class:bg-coolgray-500={$page.url.pathname.startsWith('/settings')}
data-tip="Settings"
@ -348,7 +348,7 @@
</a>
<div
class="icons tooltip tooltip-right bg-coolgray-200 hover:text-error"
class="icons tooltip tooltip-primary tooltip-right bg-coolgray-200 hover:text-error"
data-tip="Logout"
on:click={logout}
>

View File

@ -179,7 +179,7 @@
{#if $status.application.isExited}
<a
href={!$disabledButton ? `/applications/${id}/logs` : null}
class="icons bg-transparent tooltip tooltip-bottom text-sm flex items-center text-error"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm flex items-center text-error"
data-tip="Application exited with an error!"
sveltekit:prefetch
>
@ -230,7 +230,7 @@
on:click={stopApplication}
type="submit"
disabled={$disabledButton}
class="icons bg-transparent tooltip tooltip-bottom text-sm flex items-center space-x-2 text-error"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm flex items-center space-x-2 text-error"
data-tip={$appSession.isAdmin
? $t('application.stop_application')
: $t('application.permission_denied_stop_application')}
@ -255,7 +255,7 @@
type="submit"
disabled={$disabledButton || !isQueueActive}
class:hover:text-green-500={isQueueActive}
class="icons bg-transparent tooltip tooltip-bottom text-sm flex items-center space-x-2"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm flex items-center space-x-2"
data-tip={$appSession.isAdmin
? isQueueActive
? 'Rebuild application'
@ -285,7 +285,7 @@
<button
type="submit"
disabled={$disabledButton}
class="icons bg-transparent tooltip tooltip-bottom text-sm flex items-center space-x-2 text-success"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm flex items-center space-x-2 text-success"
data-tip={$appSession.isAdmin
? 'Deploy'
: 'You do not have permission to deploy application.'}
@ -317,7 +317,7 @@
>
<button
disabled={$disabledButton}
class="icons bg-transparent tooltip tooltip-bottom text-sm"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm"
data-tip="Configurations"
>
<svg
@ -383,7 +383,7 @@
>
<button
disabled={$disabledButton}
class="icons bg-transparent tooltip tooltip-bottom text-sm"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm"
data-tip="Persistent Storages"
>
<svg
@ -412,7 +412,7 @@
>
<button
disabled={$disabledButton}
class="icons bg-transparent tooltip tooltip-bottom text-sm"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm"
data-tip="Previews"
>
<svg
@ -444,7 +444,7 @@
>
<button
disabled={$disabledButton || !$status.application.isRunning}
class="icons bg-transparent tooltip tooltip-bottom text-sm"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm"
data-tip={$t('application.logs')}
>
<svg
@ -475,7 +475,7 @@
>
<button
disabled={$disabledButton}
class="icons bg-transparent tooltip tooltip-bottom text-sm"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm"
data-tip="Build Logs"
>
<svg

View File

@ -109,7 +109,7 @@
<div class="flex justify-end sticky top-0 p-1 mx-1">
<button
on:click={followBuild}
class="bg-transparent tooltip tooltip-bottom hover:text-green-500 hover:bg-coolgray-500"
class="bg-transparent tooltip tooltip-primary tooltip-bottom hover:text-green-500 hover:bg-coolgray-500"
data-tip="Follow logs"
class:text-green-500={followingBuild}
>
@ -134,7 +134,7 @@
<button
on:click={cancelBuild}
class:animation-spin={cancelInprogress}
class="bg-transparent hover:text-red-500 hover:bg-coolgray-500 tooltip tooltip-bottom"
class="bg-transparent hover:text-red-500 hover:bg-coolgray-500 tooltip tooltip-primary tooltip-bottom"
data-tip="Cancel build"
>
{#if cancelInprogress}

View File

@ -143,7 +143,7 @@
on:click={() => loadBuild(build.id)}
class:rounded-tr={index === 0}
class:rounded-br={index === builds.length - 1}
class="tooltip tooltip-top flex cursor-pointer items-center justify-center border-l-2 py-4 no-underline transition-all duration-100 hover:bg-coolgray-400 hover:shadow-xl"
class="tooltip tooltip-primary tooltip-top flex cursor-pointer items-center justify-center border-l-2 py-4 no-underline transition-all duration-100 hover:bg-coolgray-400 hover:shadow-xl"
class:bg-coolgray-400={buildId === build.id}
class:border-red-500={build.status === 'failed'}
class:border-green-500={build.status === 'success'}

View File

@ -147,7 +147,7 @@
<div class="flex justify-end sticky top-0 p-1 mx-1">
<button
on:click={followBuild}
class="bg-transparent tooltip tooltip-bottom"
class="bg-transparent tooltip tooltip-primary tooltip-bottom"
data-tip="Follow logs"
class:text-green-500={followingLogs}
>

View File

@ -144,7 +144,7 @@
{#if $status.database.isExited}
<a
href={!$disabledButton ? `/databases/${id}/logs` : null}
class="icons bg-transparent tooltip tooltip-bottom text-sm flex items-center text-red-500 tooltip-error"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm flex items-center text-red-500 tooltip-error"
data-tip="Service exited with an error!"
sveltekit:prefetch
>
@ -220,7 +220,7 @@
on:click={startDatabase}
type="submit"
disabled={!$appSession.isAdmin}
class="icons bg-transparent tooltip tooltip-bottom text-sm flex items-center space-x-2 text-green-500"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm flex items-center space-x-2 text-green-500"
data-tip={$appSession.isAdmin
? $t('database.start_database')
: $t('database.permission_denied_start_database')}
@ -285,7 +285,7 @@
>
<button
disabled={!$status.database.isRunning}
class="icons bg-transparent tooltip tooltip-bottom text-sm"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm"
data-tip={$t('database.logs')}
>
<svg
@ -312,7 +312,7 @@
type="submit"
disabled={!$appSession.isAdmin}
class:hover:text-red-500={$appSession.isAdmin}
class="icons bg-transparent tooltip tooltip-bottom text-sm"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm"
data-tip={$appSession.isAdmin
? $t('database.delete_database')
: $t('database.permission_denied_delete_database')}><DeleteIcon /></button

View File

@ -130,7 +130,7 @@
<div class="flex justify-end sticky top-0 p-1 mx-1">
<button
on:click={followBuild}
class="bg-transparent tooltip tooltip-bottom"
class="bg-transparent tooltip tooltip-primary tooltip-bottom"
data-tip="Follow logs"
class:text-green-500={followingLogs}
>

View File

@ -91,7 +91,7 @@
type="submit"
disabled={!$appSession.isAdmin && isDestinationDeletable}
class:hover:text-red-500={$appSession.isAdmin && isDestinationDeletable}
class="icons tooltip tooltip-left bg-transparent text-sm"
class="icons tooltip tooltip-primary tooltip-left bg-transparent text-sm"
class:text-stone-600={!isDestinationDeletable}
data-tip={deletable()}><DeleteIcon /></button
>

View File

@ -52,7 +52,7 @@
type="submit"
disabled={!$appSession.isAdmin}
class:hover:text-red-500={$appSession.isAdmin}
class="icons tooltip tooltip-left bg-transparent text-sm"
class="icons tooltip tooltip-primary tooltip-left bg-transparent text-sm"
data-tip={$appSession.isAdmin
? 'Delete'
: $t('destination.permission_denied_delete_destination')}><DeleteIcon /></button

View File

@ -177,7 +177,7 @@
{#if $status.service.isExited}
<a
href={!$disabledButton ? `/services/${id}/logs` : null}
class="icons bg-transparent tooltip tooltip-bottom text-sm flex items-center text-red-500 tooltip-error"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm flex items-center text-red-500 tooltip-error"
data-tip="Service exited with an error!"
sveltekit:prefetch
>
@ -228,7 +228,7 @@
on:click={stopService}
type="submit"
disabled={$disabledButton}
class="icons bg-transparent tooltip tooltip-bottom text-sm flex items-center space-x-2 text-red-500"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm flex items-center space-x-2 text-red-500"
data-tip={$appSession.isAdmin
? $t('service.stop_service')
: $t('service.permission_denied_stop_service')}
@ -253,7 +253,7 @@
on:click={startService}
type="submit"
disabled={$disabledButton}
class="icons bg-transparent tooltip tooltip-bottom text-sm flex items-center space-x-2 text-green-500"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm flex items-center space-x-2 text-green-500"
data-tip={$appSession.isAdmin
? $t('service.start_service')
: $t('service.permission_denied_start_service')}
@ -283,7 +283,7 @@
class:bg-coolgray-500={$page.url.pathname === `/services/${id}`}
>
<button
class="icons bg-transparent tooltip tooltip-bottom text-sm disabled:text-red-500"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm disabled:text-red-500"
data-tip={$t('application.configurations')}
>
<svg
@ -317,7 +317,7 @@
class:bg-coolgray-500={$page.url.pathname === `/services/${id}/secrets`}
>
<button
class="icons bg-transparent tooltip tooltip-bottom text-sm disabled:text-red-500"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm disabled:text-red-500"
data-tip={$t('application.secret')}
>
<svg
@ -347,7 +347,7 @@
class:bg-coolgray-500={$page.url.pathname === `/services/${id}/storages`}
>
<button
class="icons bg-transparent tooltip tooltip-bottom text-sm disabled:text-red-500"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm disabled:text-red-500"
data-tip="Persistent Storage"
>
<svg
@ -377,7 +377,7 @@
>
<button
disabled={!$status.service.isRunning}
class="icons bg-transparent tooltip tooltip-bottom text-sm"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm"
data-tip={$t('service.logs')}
>
<svg
@ -405,7 +405,7 @@
type="submit"
disabled={!$appSession.isAdmin}
class:hover:text-red-500={$appSession.isAdmin}
class="icons bg-transparent tooltip tooltip-bottom text-sm"
class="icons bg-transparent tooltip tooltip-primary tooltip-bottom text-sm"
data-tip={$appSession.isAdmin
? $t('service.delete_service')
: $t('service.permission_denied_delete_service')}><DeleteIcon /></button

View File

@ -127,7 +127,7 @@
<div class="flex justify-end sticky top-0 p-1 mx-1">
<button
on:click={followBuild}
class="bg-transparent tooltip tooltip-bottom"
class="bg-transparent tooltip tooltip-primary tooltip-bottom"
data-tip="Follow logs"
class:text-green-500={followingLogs}
>

View File

@ -59,7 +59,7 @@
type="submit"
disabled={!$appSession.isAdmin}
class:hover:text-red-500={$appSession.isAdmin}
class="icons tooltip tooltip-bottom bg-transparent text-sm"
class="icons tooltip tooltip-primary tooltip-bottom bg-transparent text-sm"
data-tip={$appSession.isAdmin
? $t('source.delete_git_source')
: $t('source.permission_denied')}><DeleteIcon /></button