treewide: fix various UI bugs; optimize crypto dependencies & format
Signed-off-by: NotAShelf <raf@notashelf.dev> Change-Id: If8fe8b38c1d9c4fecd40ff71f88d2ae06a6a6964
This commit is contained in:
parent
764aafa88d
commit
3ccddce7fd
GPG key ID:
29D95B64378DB4BF
178 changed files with 58342 additions and 54241 deletions
493
crates/pinakes-ui/assets/styles/_audit.scss
Normal file
493
crates/pinakes-ui/assets/styles/_audit.scss
Normal file
|
|
@ -0,0 +1,493 @@
|
|||
@use 'variables' as *;
|
||||
@use 'mixins' as *;
|
||||
|
||||
// Audit log
|
||||
.audit-controls {
|
||||
@include flex(row, flex-start, center, $space-4);
|
||||
margin-bottom: $space-6;
|
||||
}
|
||||
|
||||
.filter-select {
|
||||
padding: $space-2 24px $space-2 $space-4;
|
||||
font-size: $font-size-base;
|
||||
background: $bg-2;
|
||||
}
|
||||
|
||||
.action-danger {
|
||||
background: $error-medium;
|
||||
color: $error-text;
|
||||
}
|
||||
|
||||
.action-updated {
|
||||
background: $action-updated-bg;
|
||||
color: $action-updated-text;
|
||||
}
|
||||
|
||||
.action-collection {
|
||||
background: $action-collection-bg;
|
||||
color: $action-collection-text;
|
||||
}
|
||||
|
||||
.action-collection-remove {
|
||||
background: $action-collection-remove-bg;
|
||||
color: $action-collection-remove-text;
|
||||
}
|
||||
|
||||
.action-opened {
|
||||
background: $action-opened-bg;
|
||||
color: $action-opened-text;
|
||||
}
|
||||
|
||||
.action-scanned {
|
||||
background: $action-scanned-bg;
|
||||
color: $text-2;
|
||||
}
|
||||
|
||||
.clickable {
|
||||
cursor: pointer;
|
||||
color: $accent-text;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.clickable-row {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: $overlay-light;
|
||||
}
|
||||
}
|
||||
|
||||
// Duplicates
|
||||
.duplicates-view {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.duplicates-header {
|
||||
@include flex-between;
|
||||
margin-bottom: $space-8;
|
||||
|
||||
h3 {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.duplicates-summary {
|
||||
@include flex(row, flex-start, center, $space-6);
|
||||
}
|
||||
|
||||
.duplicate-group {
|
||||
border: 1px solid $border;
|
||||
border-radius: $radius;
|
||||
margin-bottom: $space-4;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.duplicate-group-header {
|
||||
@include flex(row, flex-start, center, $space-6);
|
||||
width: 100%;
|
||||
padding: 10px 14px;
|
||||
background: $bg-2;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
color: $text-0;
|
||||
font-size: $font-size-lg;
|
||||
|
||||
&:hover {
|
||||
background: $bg-3;
|
||||
}
|
||||
}
|
||||
|
||||
.expand-icon {
|
||||
font-size: $font-size-sm;
|
||||
width: 14px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.group-name {
|
||||
font-weight: $font-weight-semibold;
|
||||
flex: 1;
|
||||
@include text-truncate;
|
||||
}
|
||||
|
||||
.group-badge {
|
||||
background: $accent;
|
||||
color: white;
|
||||
padding: $space-1 $space-4;
|
||||
border-radius: 10px;
|
||||
font-size: $font-size-base;
|
||||
font-weight: $font-weight-semibold;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.group-size {
|
||||
flex-shrink: 0;
|
||||
font-size: $font-size-md;
|
||||
}
|
||||
|
||||
.group-hash {
|
||||
font-size: $font-size-base;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.duplicate-items {
|
||||
border-top: 1px solid $border;
|
||||
}
|
||||
|
||||
.duplicate-item {
|
||||
@include flex(row, flex-start, center, $space-6);
|
||||
padding: 10px 14px;
|
||||
border-bottom: 1px solid $border-subtle;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
&-keep {
|
||||
background: $green-light;
|
||||
}
|
||||
}
|
||||
|
||||
.dup-thumb {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
flex-shrink: 0;
|
||||
border-radius: $radius-sm;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.dup-thumb-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.dup-thumb-placeholder {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@include flex-center;
|
||||
background: $bg-3;
|
||||
font-size: 20px;
|
||||
color: $text-2;
|
||||
}
|
||||
|
||||
.dup-info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.dup-filename {
|
||||
font-weight: $font-weight-semibold;
|
||||
font-size: $font-size-lg;
|
||||
@include text-truncate;
|
||||
}
|
||||
|
||||
.dup-path {
|
||||
font-size: $font-size-base;
|
||||
@include text-truncate;
|
||||
}
|
||||
|
||||
.dup-meta {
|
||||
font-size: $font-size-md;
|
||||
margin-top: $space-1;
|
||||
}
|
||||
|
||||
.dup-actions {
|
||||
@include flex(row, flex-start, center, 6px);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.keep-badge {
|
||||
background: $green-medium;
|
||||
color: $green-text;
|
||||
padding: $space-1 $space-5;
|
||||
border-radius: 10px;
|
||||
font-size: $font-size-base;
|
||||
font-weight: $font-weight-semibold;
|
||||
}
|
||||
|
||||
// Saved searches
|
||||
.saved-searches-list {
|
||||
@include flex(column, flex-start, stretch, $space-2);
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.saved-search-item {
|
||||
@include flex-between;
|
||||
padding: $space-4 $space-6;
|
||||
background: $bg-1;
|
||||
border-radius: $radius-sm;
|
||||
cursor: pointer;
|
||||
transition: background $transition-slow ease;
|
||||
|
||||
&:hover {
|
||||
background: $bg-2;
|
||||
}
|
||||
}
|
||||
|
||||
.saved-search-info {
|
||||
@include flex(column, flex-start, stretch, $space-1);
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.saved-search-name {
|
||||
font-weight: $font-weight-medium;
|
||||
color: $text-0;
|
||||
}
|
||||
|
||||
.saved-search-query {
|
||||
font-size: $font-size-base;
|
||||
@include text-truncate;
|
||||
}
|
||||
|
||||
// Backlinks
|
||||
.backlinks-panel,
|
||||
.outgoing-links-panel {
|
||||
background: $bg-2;
|
||||
border: 1px solid $border;
|
||||
border-radius: $radius;
|
||||
margin-top: $space-8;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.backlinks-header,
|
||||
.outgoing-links-header {
|
||||
@include flex(row, flex-start, center, $space-4);
|
||||
padding: 10px 14px;
|
||||
background: $bg-3;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
transition: background $transition-base;
|
||||
|
||||
&:hover {
|
||||
background: $overlay-medium;
|
||||
}
|
||||
}
|
||||
|
||||
.backlinks-toggle,
|
||||
.outgoing-links-toggle {
|
||||
font-size: $font-size-sm;
|
||||
color: $text-2;
|
||||
width: 12px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.backlinks-title,
|
||||
.outgoing-links-title {
|
||||
font-size: $font-size-md;
|
||||
font-weight: $font-weight-semibold;
|
||||
color: $text-0;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.backlinks-count,
|
||||
.outgoing-links-count {
|
||||
font-size: $font-size-base;
|
||||
color: $text-2;
|
||||
}
|
||||
|
||||
.backlinks-reindex-btn {
|
||||
@include flex-center;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
padding: 0;
|
||||
margin-left: auto;
|
||||
background: transparent;
|
||||
border: 1px solid $border;
|
||||
border-radius: $radius-sm;
|
||||
color: $text-2;
|
||||
font-size: $font-size-md;
|
||||
cursor: pointer;
|
||||
transition: background $transition-base, color $transition-base,
|
||||
border-color $transition-base;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: $bg-2;
|
||||
color: $text-0;
|
||||
border-color: $border-strong;
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
|
||||
.backlinks-content,
|
||||
.outgoing-links-content {
|
||||
padding: $space-6;
|
||||
border-top: 1px solid $border-subtle;
|
||||
}
|
||||
|
||||
.backlinks-loading,
|
||||
.outgoing-links-loading {
|
||||
@include flex(row, flex-start, center, $space-4);
|
||||
padding: $space-6;
|
||||
color: $text-2;
|
||||
font-size: $font-size-md;
|
||||
}
|
||||
|
||||
.backlinks-error,
|
||||
.outgoing-links-error {
|
||||
padding: $space-4 $space-6;
|
||||
background: $error-bg;
|
||||
border: 1px solid $error-border;
|
||||
border-radius: $radius-sm;
|
||||
font-size: $font-size-md;
|
||||
color: $error;
|
||||
}
|
||||
|
||||
.backlinks-empty,
|
||||
.outgoing-links-empty {
|
||||
padding: $space-8;
|
||||
text-align: center;
|
||||
color: $text-2;
|
||||
font-size: $font-size-md;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.backlinks-list,
|
||||
.outgoing-links-list {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
@include flex(column, flex-start, stretch, 6px);
|
||||
}
|
||||
|
||||
.backlink-item,
|
||||
.outgoing-link-item {
|
||||
padding: $space-5 $space-6;
|
||||
background: $bg-0;
|
||||
border: 1px solid $border-subtle;
|
||||
border-radius: $radius-sm;
|
||||
cursor: pointer;
|
||||
transition: background $transition-base, border-color $transition-base;
|
||||
|
||||
&:hover {
|
||||
background: $bg-1;
|
||||
border-color: $border;
|
||||
}
|
||||
|
||||
&.unresolved {
|
||||
opacity: 0.7;
|
||||
border-style: dashed;
|
||||
}
|
||||
}
|
||||
|
||||
.backlink-source,
|
||||
.outgoing-link-target {
|
||||
@include flex(row, flex-start, center, $space-4);
|
||||
margin-bottom: $space-1;
|
||||
}
|
||||
|
||||
.backlink-title,
|
||||
.outgoing-link-text {
|
||||
font-size: $font-size-lg;
|
||||
font-weight: $font-weight-medium;
|
||||
color: $text-0;
|
||||
flex: 1;
|
||||
@include text-truncate;
|
||||
}
|
||||
|
||||
.backlink-type-badge,
|
||||
.outgoing-link-type-badge {
|
||||
display: inline-block;
|
||||
padding: 1px $space-3;
|
||||
border-radius: $radius-xl;
|
||||
font-size: 9px;
|
||||
font-weight: $font-weight-semibold;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: $letter-spacing-wide;
|
||||
|
||||
&.backlink-type-wikilink,
|
||||
&.link-type-wikilink {
|
||||
background: $accent-dim;
|
||||
color: $accent-text;
|
||||
}
|
||||
|
||||
&.backlink-type-embed,
|
||||
&.link-type-embed {
|
||||
background: $type-audio-bg;
|
||||
color: $type-audio-text;
|
||||
}
|
||||
|
||||
&.backlink-type-markdown_link,
|
||||
&.link-type-markdown_link {
|
||||
background: $type-document-bg;
|
||||
color: $type-document-text;
|
||||
}
|
||||
}
|
||||
|
||||
.backlink-context {
|
||||
font-size: $font-size-base;
|
||||
color: $text-2;
|
||||
line-height: $line-height-normal;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.backlink-line {
|
||||
color: $text-1;
|
||||
font-weight: $font-weight-medium;
|
||||
}
|
||||
|
||||
.unresolved-badge {
|
||||
padding: 1px $space-3;
|
||||
border-radius: $radius-xl;
|
||||
font-size: 9px;
|
||||
font-weight: $font-weight-semibold;
|
||||
background: $warning-light;
|
||||
color: $warning;
|
||||
}
|
||||
|
||||
.outgoing-links-unresolved-badge {
|
||||
margin-left: $space-4;
|
||||
padding: $space-1 $space-4;
|
||||
border-radius: 10px;
|
||||
font-size: $font-size-sm;
|
||||
font-weight: $font-weight-medium;
|
||||
background: $warning-medium;
|
||||
color: $warning;
|
||||
}
|
||||
|
||||
.outgoing-links-global-unresolved {
|
||||
@include flex(row, flex-start, center, 6px);
|
||||
margin-top: $space-6;
|
||||
padding: $space-5 $space-6;
|
||||
background: $warning-bg;
|
||||
border: 1px solid $warning-border;
|
||||
border-radius: $radius-sm;
|
||||
font-size: $font-size-base;
|
||||
color: $text-2;
|
||||
|
||||
.unresolved-icon {
|
||||
color: $warning;
|
||||
}
|
||||
}
|
||||
|
||||
.backlinks-message {
|
||||
padding: $space-4 $space-5;
|
||||
margin-bottom: 10px;
|
||||
border-radius: $radius-sm;
|
||||
font-size: $font-size-base;
|
||||
|
||||
&.success {
|
||||
background: $success-bg;
|
||||
border: 1px solid $success-border;
|
||||
color: $success;
|
||||
}
|
||||
|
||||
&.error {
|
||||
background: $error-bg;
|
||||
border: 1px solid $error-border;
|
||||
color: $error;
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue