From 6b8afbccebcca23cf8aeac12c232fc7935b57ebc Mon Sep 17 00:00:00 2001
From: Robert Pintilii <robert.pin9@gmail.com>
Date: Tue, 7 Feb 2023 10:10:28 +0200
Subject: [PATCH] fix(filmstrip) Minor style fixes (#12870)

---
 .../components/web/ConnectionIndicator.tsx                    | 2 +-
 .../components/web/ConnectionIndicatorIcon.js                 | 2 +-
 react/features/filmstrip/components/web/Filmstrip.tsx         | 1 +
 react/features/filmstrip/components/web/Thumbnail.tsx         | 2 +-
 react/features/filmstrip/components/web/styles.ts             | 4 ++--
 5 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/react/features/connection-indicator/components/web/ConnectionIndicator.tsx b/react/features/connection-indicator/components/web/ConnectionIndicator.tsx
index 5480ea1710..1ff9b19698 100644
--- a/react/features/connection-indicator/components/web/ConnectionIndicator.tsx
+++ b/react/features/connection-indicator/components/web/ConnectionIndicator.tsx
@@ -147,7 +147,7 @@ const styles = (theme: Theme) => {
         },
 
         icon: {
-            padding: '6px',
+            padding: '4px',
             borderRadius: '4px',
 
             '&.status-high': {
diff --git a/react/features/connection-indicator/components/web/ConnectionIndicatorIcon.js b/react/features/connection-indicator/components/web/ConnectionIndicatorIcon.js
index 838ad421dd..f6a04d58e4 100644
--- a/react/features/connection-indicator/components/web/ConnectionIndicatorIcon.js
+++ b/react/features/connection-indicator/components/web/ConnectionIndicatorIcon.js
@@ -103,7 +103,7 @@ export const ConnectionIndicatorIcon = ({
         <span className = { emptyIconWrapperClassName }>
             <Icon
                 className = { clsx(classes.icon, colorClass) }
-                size = { 12 }
+                size = { 16 }
                 src = { IconConnection } />
         </span>
     );
diff --git a/react/features/filmstrip/components/web/Filmstrip.tsx b/react/features/filmstrip/components/web/Filmstrip.tsx
index 9f79ab6539..b9214e1deb 100644
--- a/react/features/filmstrip/components/web/Filmstrip.tsx
+++ b/react/features/filmstrip/components/web/Filmstrip.tsx
@@ -853,6 +853,7 @@ class Filmstrip extends PureComponent <IProps, IState> {
                     { ...actions }>
                     <Icon
                         aria-label = { t('toolbar.accessibilityLabel.toggleFilmstrip') }
+                        size = { 24 }
                         src = { icon } />
                 </button>
             </div>
diff --git a/react/features/filmstrip/components/web/Thumbnail.tsx b/react/features/filmstrip/components/web/Thumbnail.tsx
index 5da3d6ef99..dccc9d8e14 100644
--- a/react/features/filmstrip/components/web/Thumbnail.tsx
+++ b/react/features/filmstrip/components/web/Thumbnail.tsx
@@ -337,7 +337,7 @@ const defaultStyles = (theme: Theme) => {
 
         activeSpeaker: {
             '& .active-speaker-indicator': {
-                boxShadow: `inset 0px 0px 0px 4px ${theme.palette.link01Active} !important`
+                boxShadow: `inset 0px 0px 0px 3px ${theme.palette.action01Hover} !important`
             }
         },
 
diff --git a/react/features/filmstrip/components/web/styles.ts b/react/features/filmstrip/components/web/styles.ts
index 8e4b2e9d54..0aac234210 100644
--- a/react/features/filmstrip/components/web/styles.ts
+++ b/react/features/filmstrip/components/web/styles.ts
@@ -20,7 +20,7 @@ export const styles = (theme: Theme) => {
             height: '24px',
             position: 'absolute' as const,
             borderRadius: '4px',
-            top: 'calc(-24px - 3px)',
+            top: 'calc(-24px - 2px)',
             left: 'calc(50% - 16px)',
             opacity: 0,
             transition: 'opacity .3s',
@@ -51,7 +51,7 @@ export const styles = (theme: Theme) => {
 
         toggleVerticalFilmstripContainer: {
             transform: 'rotate(-90deg)',
-            left: 'calc(-24px - 3px - 4px)',
+            left: 'calc(-24px - 2px - 4px)',
             top: 'calc(50% - 12px)'
         },