Event Widget Update (#1098)

* Took care of some notes in the code

* Fixed an issue where Extra might get flagged as special too early, if in a word like Extraordinary

* Moved Tag cleanup code into Scanner service. Added a SplitQuery to another heavy API. Refactored Scan loop to remove parallelism and use async instead.

* Lots of rework on the codebase to support detailed messages and easier management of message sending. Need to take a break on this work.

* Progress is being made, but slowly. Code is broken in this commit.

* Progress is being made, but slowly. Code is broken in this commit.

* Fixed merge issue

* Fixed unit tests

* CoverUpdate is now hooked into new ProgressEvent structure

* Refactored code to remove custom observables and have everything use standard messages$

* Refactored a ton of instances to NotificationProgressEvent style and tons of the UI to respect that too. UI is still a bit buggy, but wholistically the work is done.

* Working much better. Sometimes events come in too fast. Currently cover update progress doesn't display on UI

* Fixed unit tests

* Removed SignalREvent to minimize internal event types. Updated the UI to use progress bars. Finished SiteThemeService.

* Merged metadata refresh progress events and changed library scan events to merge cleaner in the UI

* Changed RefreshMetadataProgress to CoverUpdateProgress to reflect the event better.

* Theme Cleanup (#1089)

* Fixed e-ink theme not properly applying correctly

* Fixed some seed changes. Changed card checkboxes to use our themed ones

* Fixed recently added carousel not going to recently-added page

* Fixed an issue where no results found would show when searching for a library name

* Cleaned up list a bit, typeahead dropdown still needs work

* Added a TODO to streamline series-card component

* Removed ng-lazyload-image module since we don't use it. We use lazysizes

* Darken card on hover

* Fixing accordion focus style

* ux pass updates

- Fixed typeahead width
- Fixed changelog download buttons
- Fixed a select
- Fixed various input box-shadows
- Fixed all anchors to only have underline on hover
- Added navtab hover and active effects

* more ux pass

- Fixed spacing on theme cards
- Fixed some light theme issues
- Exposed text-muted-color for theme card subtitle color

* UX pass fixes

- Changed back to bright green for primary on dark theme
- Changed fa icon to black on e-ink

* Merged changelog component

* Fixed anchor buttons text decoration

* Changed nav tabs to have a background color instead of open active state

* When user is not authenticated, make sure we set default theme (dark)

* Cleanup on carousel

* Updated Users tab to use small buttons with icons to align with Library tab

* Cleaned up brand to not underline, removed default link underline on hover in dropdown and pill tabs

* Fixed collection detail posters not rendering

Co-authored-by: Robbie Davis <robbie@therobbiedavis.com>

* Bump versions by dotnet-bump-version.

* Tweaked some of the emitting code

* Some css, but pretty bad. Robbie please save me

* Removed a todo

* styling update

* Only send filename on FileScanProgress

* Some console.log spam cleanup

* Various updates

* Show events widget activity based on activeEvents

* progress bar color updates

* Code cleanup

Co-authored-by: Robbie Davis <robbie@therobbiedavis.com>

UI/Web/src/theme/components/_popover.scss

@@ -1,5 +1,22 @@
-
+.popover {
+    background-color: var(--popover-bg-color);
+    border-color: var(--popover-border-color);
+}
+  
+.bs-popover-bottom {
+    > .popover-arrow {
+  
+        &::before {
+            border-bottom-color: var(--popover-outerarrow-color);
+        }
+  
+        &::after {
+            border-bottom-color: var(--popover-arrow-color);
+        }
+    }
+}
+  
 .popover-body {
     background-color: var(--popover-body-bg-color);
     color: var(--popover-body-text-color)
-}
+}

UI/Web/src/theme/components/progress.scss

@@ -0,0 +1,13 @@
+.progress {
+    background-color: var(--progress-bg-color);
+
+}
+
+.progress-bar {
+    background-color: var(--progress-bar-color);
+}
+
+.progress-bar-striped {
+    background-image: var(--progress-striped-animated-color);
+    background-color: unset;
+}

UI/Web/src/theme/themes/dark.scss

@@ -96,6 +96,10 @@
     /* Popover */
     --popover-body-bg-color: var(--navbar-bg-color);
     --popover-body-text-color: var(--navbar-text-color);
+    --popover-outerarrow-color: transparent;
+    --popover-arrow-color: transparent;
+    --popover-bg-color: black;
+    --popover-border-color: black;
 
     /* Pagination */
     --pagination-active-link-border-color: var(--primary-color);
@@ -106,9 +110,14 @@
     --pagination-link-bg-color: rgba(1, 4, 9, 0.5);
     --pagination-focus-border-color: var(--primary-color);
 
+    /* Progress Bar */
+    --progress-striped-animated-color: linear-gradient(45deg, rgba(74,198,148, 0.75) 25%, rgba(51, 138, 103, 0.75) 25%, rgba(51, 138, 103, 0.75) 50%, rgba(74,198,148, 0.75) 50%, rgba(74,198,148, 0.75) 75%, rgba(51, 138, 103, 0.75) 75%, rgba(51, 138, 103, 0.75));
+    --progress-bg-color: var(--nav-header-bg-color);
+    --progress-bar-color: var(--primary-color-dark-shade);
+
     /* Dropdown */
     --dropdown-item-hover-text-color: white;
-    --dropdown-item-hover-bg-color: var(--primary-color);
+    --dropdown-item-hover-bg-color: var(--primary-color-dark-shade);
     --dropdown-item-text-color: var(--navbar-text-color);
     --dropdown-item-bg-color: var(--navbar-bg-color);
     --dropdown-overlay-color: rgba(0,0,0,0.5);