]>
Commit | Line | Data |
---|---|---|
2d3741d6 C |
1 | @import '_variables'; |
2 | @import '_mixins'; | |
830b4faf | 3 | @import '_miniature'; |
2d3741d6 | 4 | |
cf78883c C |
5 | .section-title { |
6 | // make the element span a full grid row within .videos grid | |
7 | grid-column: 1 / -1; | |
8 | } | |
9 | ||
c8487f3f | 10 | .margin-content { |
0f7407d9 | 11 | @include grid-videos-miniature-layout; |
1a471091 C |
12 | } |
13 | ||
c8487f3f | 14 | .section { |
0f7407d9 C |
15 | &:first-child { |
16 | padding-top: 30px; | |
17 | ||
18 | .section-title { | |
19 | border-top: none !important; | |
20 | } | |
21 | } | |
22 | ||
23 | .section-title { | |
24 | font-size: 24px; | |
25 | font-weight: $font-semibold; | |
26 | padding-top: 15px; | |
27 | margin-bottom: 15px; | |
28 | display: flex; | |
29 | justify-content: space-between; | |
30 | ||
31 | &:not(h2) { | |
32 | border-top: 1px solid $separator-border-color; | |
33 | } | |
34 | ||
35 | a { | |
36 | &:hover, &:focus:not(.focus-visible), &:active { | |
37 | text-decoration: none; | |
38 | outline: none; | |
39 | } | |
40 | ||
41 | color: pvar(--mainForegroundColor); | |
42 | } | |
43 | } | |
44 | ||
45 | &.channel { | |
46 | .section-title { | |
47 | a { | |
48 | display: flex; | |
49 | width: fit-content; | |
50 | align-items: center; | |
51 | ||
746018f6 C |
52 | my-actor-avatar { |
53 | @include actor-avatar-size(28px); | |
0f7407d9 | 54 | |
746018f6 | 55 | font-size: initial; |
0f7407d9 C |
56 | margin-right: 8px; |
57 | } | |
58 | } | |
59 | ||
60 | .followers { | |
61 | color: pvar(--greyForegroundColor); | |
62 | font-weight: normal; | |
63 | font-size: 14px; | |
64 | margin-left: 10px; | |
65 | position: relative; | |
66 | top: 2px; | |
67 | } | |
68 | } | |
69 | } | |
70 | ||
71 | .show-more { | |
72 | position: relative; | |
73 | top: -5px; | |
74 | display: inline-block; | |
75 | font-size: 16px; | |
76 | text-transform: uppercase; | |
77 | color: pvar(--greyForegroundColor); | |
78 | margin-bottom: 10px; | |
79 | font-weight: $font-semibold; | |
80 | text-decoration: none; | |
81 | } | |
82 | ||
83 | @media screen and (max-width: $mobile-view) { | |
84 | max-height: initial; | |
85 | overflow: initial; | |
86 | ||
87 | .section-title { | |
88 | font-size: 17px; | |
89 | margin-left: 10px; | |
90 | } | |
91 | } | |
830b4faf | 92 | } |