tea/browsertrix
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: Correct progress ring for analysis run in Chrome (#1860)

Browse Source 
Switches `sl-progress-ring` and `sl-icon` to inherit font size from
table cell for consistent sizing as base size, while also fixing
`var(--font-size-base)` not being available when progress ring size is
first calculated.

Fixes #1835
This commit is contained in:
sua yoo 2024-06-12 09:50:19 -05:00 committed by sua yoo
parent 1ab6ec325b
commit d501fb3fe7
No known key found for this signature in database
GPG Key ID: 5AD1B4C02D4F0567
1 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/src/features/archived-items/archived-item-list.ts
View File

@ -45,6 +45,14 @@ export class ArchivedItemListItem extends TailwindElement {
var(--btrix-border-radius-bottom, 0);
height: 2.5rem;
}
sl-progress-ring {
/* Setting size to var(--font-size-base) breaks in chrome,
have cell contents inherit size from cell instead */
--size: 1em;
--track-width: 1px;
--indicator-width: 2px;
}
`;
@property({ type: Object, attribute: false })
@ -141,7 +149,7 @@ export class ArchivedItemListItem extends TailwindElement {
</btrix-table-cell>
`
: nothing}
<btrix-table-cell class="pr-0">
<btrix-table-cell class="pr-0 text-base">
${this.showStatus
? html`
<btrix-crawl-status
@ -158,7 +166,7 @@ export class ArchivedItemListItem extends TailwindElement {
hoist
>
<sl-icon
class="text-base"
class="text-inherit"
style="color: ${crawlStatus.cssColor}"
name=${typeIcon}
label=${typeLabel}
@ -179,12 +187,12 @@ export class ArchivedItemListItem extends TailwindElement {
? html`
<sl-progress-ring
value="${activeProgress}"
style="color: ${qaStatus.cssColor}; --size: var(--font-size-base); --track-width: 1px; --indicator-width: 2px;"
style="color: ${qaStatus.cssColor};"
></sl-progress-ring>
`
: html`
<sl-icon
class="text-base"
class="text-inherit"
style="color: ${qaStatus.cssColor}"
name=${isUpload ? "slash" : "microscope"}
library=${isUpload ? "default" : "app"}