You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

_tile_view_overrides.scss 1.4KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. /**
  2. * Various overrides outside of the filmstrip to style the app to support a
  3. * tiled thumbnail experience.
  4. */
  5. .tile-view {
  6. /**
  7. * Let the avatar grow with the tile.
  8. */
  9. .avatar-container {
  10. max-height: initial;
  11. max-width: initial;
  12. }
  13. /**
  14. * Hide various features that should not be displayed while in tile view.
  15. */
  16. #dominantSpeaker,
  17. #filmstripLocalVideoThumbnail,
  18. #largeVideoElementsContainer,
  19. #sharedVideo,
  20. .filmstrip__toolbar {
  21. display: none;
  22. }
  23. /**
  24. * The follow styling uses !important to override inline styles set with
  25. * javascript.
  26. *
  27. * TODO: These overrides should be more easy to remove and should be removed
  28. * when the components are in react so their rendering done declaratively,
  29. * making conditional styling easier to apply.
  30. */
  31. #largeVideoElementsContainer,
  32. #remoteConnectionMessage,
  33. #remotePresenceMessage {
  34. display: none !important;
  35. }
  36. /**
  37. * Thumbnail popover menus can overlap other thumbnails. Setting an auto
  38. * z-index will allow AtlasKit InlineDialog's large z-index to be
  39. * respected and thereby display over elements in other thumbnails,
  40. * specifically the various status icons.
  41. */
  42. .remotevideomenu,
  43. .localvideomenu,
  44. .videocontainer__toptoolbar {
  45. z-index: auto;
  46. }
  47. }