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.

_subject.scss 1.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. .subject {
  2. color: #fff;
  3. margin-top: -120px;
  4. transition: margin-top .3s ease-in;
  5. z-index: $zindex3;
  6. &.visible {
  7. margin-top: 20px;
  8. }
  9. }
  10. .subject-info-container {
  11. display: flex;
  12. justify-content: center;
  13. margin: 0 auto;
  14. height: 28px;
  15. @media (max-width: 500px) {
  16. flex-wrap: wrap;
  17. }
  18. }
  19. .subject-info {
  20. align-items: center;
  21. display: flex;
  22. margin-bottom: 4px;
  23. max-width: 80%;
  24. height: 28px;
  25. }
  26. .subject-text {
  27. background: rgba(0, 0, 0, 0.6);
  28. border-radius: 3px 0px 0px 3px;
  29. box-sizing: border-box;
  30. font-size: 14px;
  31. line-height: 28px;
  32. padding: 0 16px;
  33. height: 28px;
  34. @media (max-width: 700px) {
  35. max-width: 100px;
  36. }
  37. @media (max-width: 300px) {
  38. display: none;
  39. }
  40. &--content {
  41. overflow: hidden;
  42. text-overflow: ellipsis;
  43. white-space: nowrap;
  44. }
  45. }
  46. .subject-timer {
  47. background: rgba(0, 0, 0, 0.8);
  48. border-radius: 0px 3px 3px 0px;
  49. box-sizing: border-box;
  50. font-size: 12px;
  51. line-height: 28px;
  52. min-width: 34px;
  53. padding: 0 8px;
  54. height: 28px;
  55. @media (max-width: 300px) {
  56. display: none;
  57. }
  58. }
  59. .details-container {
  60. width: 100%;
  61. display: flex;
  62. justify-content: center;
  63. position: absolute;
  64. top: 0;
  65. height: 48px;
  66. }
  67. .shift-right .details-container {
  68. margin-left: calc(#{$sidebarWidth} / 2);
  69. }