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