git ssb

10+

Matt McKegg / patchwork



Tree: 35ca2d9446f15b90de0ece30391868c2761a1247

Files: 35ca2d9446f15b90de0ece30391868c2761a1247 / styles / dark / channel-list.mcss

1835 bytesRaw
1ChannelList {
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