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