]>
Commit | Line | Data |
---|---|---|
fa12eacc | 1 | @use '_bootstrap-variables'; |
8cbc40b2 C |
2 | @use '_variables' as *; |
3 | @use '_mixins' as *; | |
4 | @use '_miniature' as *; | |
244e76a5 | 5 | |
931d3430 | 6 | $icon-size: 16px; |
2b587cad | 7 | |
3da68f0a | 8 | ::ng-deep my-video-list-header { |
5bcbcbe3 RK |
9 | display: flex; |
10 | flex-grow: 1; | |
11 | } | |
12 | ||
017c3dca C |
13 | .videos-header { |
14 | display: flex; | |
13adf228 | 15 | justify-content: space-between; |
2b587cad | 16 | align-items: center; |
017c3dca | 17 | |
205e4f56 C |
18 | my-feed { |
19 | display: inline-block; | |
931d3430 | 20 | width: calc(#{$icon-size} - 2px); |
017c3dca C |
21 | } |
22 | ||
23 | .moderation-block { | |
27bc9586 C |
24 | @include margin-left(.4rem); |
25 | ||
017c3dca | 26 | display: flex; |
017c3dca C |
27 | justify-content: flex-end; |
28 | align-items: center; | |
931d3430 C |
29 | |
30 | my-global-icon { | |
31 | position: relative; | |
32 | width: $icon-size; | |
33 | } | |
017c3dca | 34 | } |
244e76a5 RK |
35 | } |
36 | ||
34c7f429 C |
37 | .date-title { |
38 | font-size: 16px; | |
39 | font-weight: $font-semibold; | |
40 | margin-bottom: 20px; | |
41 | margin-top: -10px; | |
34c7f429 | 42 | |
e66883b3 RK |
43 | // make the element span a full grid row within .videos grid |
44 | grid-column: 1 / -1; | |
45 | ||
34c7f429 | 46 | &:not(:first-child) { |
d840487f RK |
47 | margin-top: .5rem; |
48 | padding-top: 20px; | |
34c7f429 C |
49 | border-top: 1px solid $separator-border-color; |
50 | } | |
51 | } | |
52 | ||
cf78883c | 53 | .margin-content { |
5d6395af | 54 | @include grid-videos-miniature-layout-with-margins; |
7193ad10 | 55 | } |
11dd0c2e | 56 | |
4d5e572f | 57 | .display-as-row.videos { |
27bc9586 C |
58 | @include margin-left(pvar(--horizontalMarginContent)); |
59 | @include margin-right(pvar(--horizontalMarginContent)); | |
4d5e572f C |
60 | |
61 | .video-wrapper { | |
62 | margin-bottom: 15px; | |
63 | } | |
64 | } | |
65 | ||
4682468d K |
66 | @media screen and (max-width: $mobile-view) { |
67 | .videos-header { | |
68 | flex-direction: column; | |
69 | align-items: center; | |
70 | height: auto; | |
cf78883c | 71 | margin-bottom: 10px; |
4682468d K |
72 | |
73 | .title-page { | |
27bc9586 C |
74 | @include margin-right(0); |
75 | ||
4682468d | 76 | margin-bottom: 10px; |
4682468d K |
77 | } |
78 | } | |
79 | } |