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 */
a {
font: inherit;
color: var(--theme-content-color);
&:hover { color: var(--theme-caption-color); }
&:active { color: var(--theme-content-color); }
&:visited { color: var(--theme-content-color); }
font-weight: 500;
text-decoration: none;
color: var(--theme-caption-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 {
display: flex;

View File

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

View File

@ -38,9 +38,9 @@
<div class="flex-center icon">{iconLabel(value.name)}</div>
<div class="flex-col">
{#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}
<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}
<div class="type">{filesize(value.size)}</div>
</div>
@ -60,7 +60,16 @@
border-radius: .5rem;
}
.name {
font-weight: 500;
color: var(--theme-caption-color);
white-space: nowrap;
cursor: pointer;
&:hover { text-decoration: underline; }
&:active {
text-decoration: underline;
color: var(--theme-content-accent-color);
}
}
.type {
font-size: .75rem;