Files: bf3564c3853449f37f594fd76094e285f4c43809 / styles / dark / channel-list.mcss
1835 bytesRaw
1 | ChannelList { |
2 | a.channel { |
3 | display: flex; |
4 | padding: 8px 10px; |
5 | font-size: 110%; |
6 | margin: 4px 0; |
7 | background: #2d2c2c; |
8 | color: #ccc; |
9 | border-radius: 3px; |
10 | position: relative |
11 | transition: background-color 0.25s |
12 | max-width: 250px; |
13 | |
14 | background-repeat: no-repeat |
15 | background-position: right |
16 | |
17 | -more { |
18 | background-color: transparent |
19 | color: #6e6d6d |
20 | |
21 | :hover { |
22 | background-color: transparent |
23 | color: #ccc |
24 | } |
25 | } |
26 | |
27 | -subscribed { |
28 | background-image: svg(subscribed) |
29 | border-left: 2px solid #51c067; |
30 | border-top-left-radius: 0; |
31 | border-bottom-left-radius: 0; |
32 | |
33 | span.name { |
34 | font-weight: bold |
35 | } |
36 | } |
37 | |
38 | @svg subscribed { |
39 | width: 20px |
40 | height: 12px |
41 | content: "<circle cx='6' stroke='#888' fill='none' cy='6' r='5' /> <circle cx='6' cy='6' r='3' fill='#888'/>" |
42 | } |
43 | |
44 | :hover { |
45 | background: #434141; |
46 | text-decoration: none; |
47 | a { |
48 | transition: opacity 0.05s |
49 | opacity: 1 |
50 | } |
51 | } |
52 | |
53 | span.name { |
54 | flex: 1 |
55 | white-space: nowrap; |
56 | min-width: 0; |
57 | -webkit-mask-image: linear-gradient(90deg, rgba(0,0,0,1) 90%, rgba(0,0,0,0)); |
58 | } |
59 | |
60 | a { |
61 | display: inline |
62 | opacity: 0; |
63 | font-size: 80%; |
64 | background-color: rgb(112, 112, 112); |
65 | transition: opacity 0.2s, background-color 0.4s |
66 | padding: 9px 10px; |
67 | color: white; |
68 | border-radius: 3px; |
69 | margin: -8px -10px -8px 4px; |
70 | border-top-left-radius: 0; |
71 | border-bottom-left-radius: 0; |
72 | border-left: 2px solid rgba(255, 255, 255, 0.9); |
73 | text-decoration: none |
74 | |
75 | -subscribe { |
76 | :hover { |
77 | background-color: #51c067; |
78 | } |
79 | } |
80 | |
81 | -unsubscribe { |
82 | :hover { |
83 | background: rgb(212, 112, 112); |
84 | } |
85 | } |
86 | } |
87 | } |
88 | } |
89 |
Built with git-ssb-web