Browse Source

fix(filmstrip) Minor style fixes (#12870)

factor2
Robert Pintilii 2 years ago
parent
commit
6b8afbcceb
No account linked to committer's email address

+ 1
- 1
react/features/connection-indicator/components/web/ConnectionIndicator.tsx View File

147
         },
147
         },
148
 
148
 
149
         icon: {
149
         icon: {
150
-            padding: '6px',
150
+            padding: '4px',
151
             borderRadius: '4px',
151
             borderRadius: '4px',
152
 
152
 
153
             '&.status-high': {
153
             '&.status-high': {

+ 1
- 1
react/features/connection-indicator/components/web/ConnectionIndicatorIcon.js View File

103
         <span className = { emptyIconWrapperClassName }>
103
         <span className = { emptyIconWrapperClassName }>
104
             <Icon
104
             <Icon
105
                 className = { clsx(classes.icon, colorClass) }
105
                 className = { clsx(classes.icon, colorClass) }
106
-                size = { 12 }
106
+                size = { 16 }
107
                 src = { IconConnection } />
107
                 src = { IconConnection } />
108
         </span>
108
         </span>
109
     );
109
     );

+ 1
- 0
react/features/filmstrip/components/web/Filmstrip.tsx View File

853
                     { ...actions }>
853
                     { ...actions }>
854
                     <Icon
854
                     <Icon
855
                         aria-label = { t('toolbar.accessibilityLabel.toggleFilmstrip') }
855
                         aria-label = { t('toolbar.accessibilityLabel.toggleFilmstrip') }
856
+                        size = { 24 }
856
                         src = { icon } />
857
                         src = { icon } />
857
                 </button>
858
                 </button>
858
             </div>
859
             </div>

+ 1
- 1
react/features/filmstrip/components/web/Thumbnail.tsx View File

337
 
337
 
338
         activeSpeaker: {
338
         activeSpeaker: {
339
             '& .active-speaker-indicator': {
339
             '& .active-speaker-indicator': {
340
-                boxShadow: `inset 0px 0px 0px 4px ${theme.palette.link01Active} !important`
340
+                boxShadow: `inset 0px 0px 0px 3px ${theme.palette.action01Hover} !important`
341
             }
341
             }
342
         },
342
         },
343
 
343
 

+ 2
- 2
react/features/filmstrip/components/web/styles.ts View File

20
             height: '24px',
20
             height: '24px',
21
             position: 'absolute' as const,
21
             position: 'absolute' as const,
22
             borderRadius: '4px',
22
             borderRadius: '4px',
23
-            top: 'calc(-24px - 3px)',
23
+            top: 'calc(-24px - 2px)',
24
             left: 'calc(50% - 16px)',
24
             left: 'calc(50% - 16px)',
25
             opacity: 0,
25
             opacity: 0,
26
             transition: 'opacity .3s',
26
             transition: 'opacity .3s',
51
 
51
 
52
         toggleVerticalFilmstripContainer: {
52
         toggleVerticalFilmstripContainer: {
53
             transform: 'rotate(-90deg)',
53
             transform: 'rotate(-90deg)',
54
-            left: 'calc(-24px - 3px - 4px)',
54
+            left: 'calc(-24px - 2px - 4px)',
55
             top: 'calc(50% - 12px)'
55
             top: 'calc(50% - 12px)'
56
         },
56
         },
57
 
57
 

Loading…
Cancel
Save