git ssb

10+

Matt McKegg / patchwork



Tree: be34adb18ee4724cd9d1a6a8fdaf95891e4c516d

Files: be34adb18ee4724cd9d1a6a8fdaf95891e4c516d / styles / light / profile-list.mcss

2208 bytesRaw
1ProfileList {
2 a.profile {
3 display: flex;
4 padding: 4px;
5 font-size: 110%;
6 margin: 4px 0;
7 background: rgba(255, 255, 255, 0.74);
8 border-radius: 5px;
9 position: relative
10 text-decoration: none
11 transition: background-color 0.2s
12
13 background-repeat: no-repeat
14 background-position: right
15
16 -following {
17 background-image: svg(following)
18 }
19
20 -connected {
21 background-image: svg(connected)
22 }
23
24 @svg connected {
25 width: 20px
26 height: 12px
27 content: "<circle cx='6' stroke='none' fill='green' cy='6' r='5' />"
28 }
29
30 @svg following {
31 width: 20px
32 height: 12px
33 content: "<circle cx='6' stroke='#888' fill='none' cy='6' r='5' /> <circle cx='6' cy='6' r='3' fill='#888'/>"
34 }
35
36 div.avatar {
37 img {
38 width: 40px
39 height: 40px
40 display: block
41 }
42 }
43
44 div.main {
45 display: flex
46 flex-direction: column
47 flex: 1
48 margin-left: 10px
49 justify-content: center
50 min-width: 0px
51 div.name {
52 white-space: nowrap
53 font-weight: bold
54 font-size: 110%
55 color: #636363
56 -webkit-mask-image: linear-gradient(90deg, rgba(0,0,0,1) 90%, rgba(0,0,0,0))
57 }
58 }
59
60 div.progress {
61 display: flex
62 flex-direction: column
63 svg {
64 transition: opacity 0.2s
65 opacity: 0
66 -pending {
67 opacity: 1
68 }
69 width: 20px
70 flex: 1
71 }
72 }
73
74 div.controls {
75 opacity: 0
76 position: absolute
77 right: 7px
78 top: 0
79 bottom: 0
80 display: flex;
81 justify-content: center;
82 flex-direction: column;
83 width: 15px;
84 transition: opacity 0.2s
85 a.disconnect {
86 color: white;
87 border-radius: 10px;
88 height: 16px;
89 width: 16px;
90 background-color: #777
91 text-align: center
92 vertical-align: middle
93 font-size: 14px;
94 overflow: hidden;
95 :hover {
96 text-decoration: none
97 background-color: #F77
98 }
99 }
100 }
101
102 :hover {
103 background-color: rgba(255, 255, 255, 0.4);
104 div.controls {
105 opacity: 1
106 }
107 }
108 }
109}
110

Built with git-ssb-web