Commit 981f0b7c authored by Omid Tourzan's avatar Omid Tourzan Committed by Commit Bot

[files-progress] Add progress spinner style for transfer details.

Using panel item attribute detailed-panel to check feature flag status.

As the expand and collapse status of the summary panel needs different
size of spinner, data-category attribute used to the check this status.

Colors updated to semantic version but they are same as current rgb
values.

Bug: 953308
Change-Id: I53fd02dde6c6799cfd04c5f84f3c96c28851a84b
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2307769
Commit-Queue: Omid Tourzan <oto@chromium.org>
Reviewed-by: default avatarNoel Gordon <noel@chromium.org>
Reviewed-by: default avatarAlex Danilo <adanilo@chromium.org>
Cr-Commit-Position: refs/heads/master@{#791141}
parent 9fb5db59
......@@ -57,18 +57,31 @@ class CircularProgress extends HTMLElement {
height: 36px;
width: 36px;
}
:host-context([detailed-panel][data-category='expanded'])
.progress {
height: 32px;
width: 32px;
}
:host-context([detailed-panel][data-category='collapsed'])
.progress {
height: 28px;
width: 28px;
}
.bottom {
stroke: rgb(210, 227, 252);
stroke: var(--google-blue-100);
fill: none;
}
.top {
stroke: rgb(26, 115, 232);
stroke: var(--google-blue-600);
stroke-linecap: round;
fill: none;
}
text {
font: bold 14px Roboto;
fill: rgb(26, 115, 232);
fill: var(--google-blue-600);
}
</style>
<div class='progress'>
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment