General view of links (#284)

Signed-off-by: Alexander Platov <sas_lord@mail.ru>
This commit is contained in:
Alexander Platov 2021-10-24 22:38:32 +03:00 committed by GitHub
parent a6fa28cfde
commit 0d2949a415
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 25 additions and 14 deletions

View File

@ -16,10 +16,18 @@
/* CLEAR */ /* CLEAR */
a { a {
font: inherit; font: inherit;
color: var(--theme-content-color); font-weight: 500;
&:hover { color: var(--theme-caption-color); } text-decoration: none;
&:active { color: var(--theme-content-color); } color: var(--theme-caption-color);
&:visited { color: var(--theme-content-color); } &:hover {
color: var(--theme-caption-color);
text-decoration: underline;
}
&:active {
color: var(--theme-content-accent-color);
text-decoration: underline;
}
&:visited { color: var(--theme-caption-color); }
} }
button { button {
display: flex; display: flex;

View File

@ -58,14 +58,8 @@
transform: scale(.75); transform: scale(.75);
opacity: .6; opacity: .6;
} }
&:hover { &:hover .icon { opacity: 1; }
a { color: var(--theme-caption-color); } &:active .icon { opacity: .6; }
.icon { opacity: 1; }
}
&:active {
a { color: var(--theme-content-color); }
.icon { opacity: .6; }
}
} }
.disabled { .disabled {
cursor: not-allowed; cursor: not-allowed;

View File

@ -38,9 +38,9 @@
<div class="flex-center icon">{iconLabel(value.name)}</div> <div class="flex-center icon">{iconLabel(value.name)}</div>
<div class="flex-col"> <div class="flex-col">
{#if value.type === 'application/pdf'} {#if value.type === 'application/pdf'}
<div class="caption-color name" on:click={()=> { closeTooltip(); showPopup(PDFViewer, { file: value.file }, 'right') }}>{trimFilename(value.name)}</div> <div class="name" on:click={()=> { closeTooltip(); showPopup(PDFViewer, { file: value.file }, 'right') }}>{trimFilename(value.name)}</div>
{:else} {:else}
<div class="caption-color name"><a href={getFileUrl(value.file)} download={value.name}>{trimFilename(value.name)}</a></div> <div class="name"><a href={getFileUrl(value.file)} download={value.name}>{trimFilename(value.name)}</a></div>
{/if} {/if}
<div class="type">{filesize(value.size)}</div> <div class="type">{filesize(value.size)}</div>
</div> </div>
@ -60,7 +60,16 @@
border-radius: .5rem; border-radius: .5rem;
} }
.name { .name {
font-weight: 500;
color: var(--theme-caption-color);
white-space: nowrap; white-space: nowrap;
cursor: pointer;
&:hover { text-decoration: underline; }
&:active {
text-decoration: underline;
color: var(--theme-content-accent-color);
}
} }
.type { .type {
font-size: .75rem; font-size: .75rem;