Replace twitter links with icons
Damian Johnson

Damian Johnson commited on 2017-07-09 07:29:12
Zeige 4 geänderte Dateien mit 17 Einfügungen und 7 Löschungen.


Not quite sure if we'll go with this yet but it certainly does cut down on the
clutter a little.
... ...
@@ -23,9 +23,14 @@ table.people td {
23 23
   float: left;
24 24
 }
25 25
 
26
+.twitter {
27
+  float: right;
28
+}
29
+
26 30
 .field {
27 31
   font-family: "Montserrat";
28 32
   font-size: 0.8rem;
33
+  color: rgb(50, 50, 50);
29 34
 }
30 35
 
31 36
 .description {
... ...
@@ -45,18 +50,18 @@ table.people td {
45 50
   <tr>
46 51
     <td>
47 52
       <div class="photo"><img src="$(IMGROOT)/people/ohmygodel.png" alt="ohmygodel" /></div>
53
+      <div class="twitter"><a href="https://twitter.com/ohmygodel"><img src="$(IMGROOT)/twitter-small.png" alt="twitter" /></a></div>
48 54
       <div class="name">Aaron Johnson</div>
49 55
       <div class="field"><b>IRC:</b> ohmygodel</div>
50
-      <div class="field"><b><a href="https://twitter.com/ohmygodel">Twitter</a></b></div>
51 56
       <div class="field"><b><a href="../keys/ohmygodel.txt">PGP Key</a></b></div>
52 57
       <div class="description"><a href="https://www.nrl.navy.mil/">NRL</a> researcher in applied cryptography with an interest in Tor’s security and privacy.</div>
53 58
     </td>
54 59
 
55 60
     <td>
56 61
       <div class="photo"><img src="$(IMGROOT)/people/no_photo.png" alt="no photo" /></div>
62
+      <div class="twitter"><a href="https://twitter.com/flexlibris"><img src="$(IMGROOT)/twitter-small.png" alt="twitter" /></a></div>
57 63
       <div class="name">Alison Macrina</div>
58 64
       <div class="field"><b>IRC:</b> flexlibris</div>
59
-      <div class="field"><b><a href="https://twitter.com/flexlibris">Twitter</a></b></div>
60 65
       <div class="field"><b><a href="../keys/flexlibris.txt">PGP Key</a></b></div>
61 66
       <div class="description">Leads Community Team and the Library Freedom Project. Works on support, outreach, and training.</div>
62 67
     </td>
... ...
@@ -73,9 +78,9 @@ table.people td {
73 78
 
74 79
     <td>
75 80
       <div class="photo"><img src="$(IMGROOT)/people/hellais.png" alt="hellais" /></div>
81
+      <div class="twitter"><a href="https://twitter.com/hellais"><img src="$(IMGROOT)/twitter-small.png" alt="twitter" /></a></div>
76 82
       <div class="name">Arturo Filastò</div>
77 83
       <div class="field"><b>IRC:</b> hellais</div>
78
-      <div class="field"><b><a href="https://twitter.com/hellais">Twitter</a></b></div>
79 84
       <div class="field"><b><a href="../keys/hellais.txt">PGP Key</a></b></div>
80 85
       <div class="description">Project leader for <a href="https://ooni.torproject.org/">OONI</a>, has helped with <a href="http://tor2web.org/">tor2web</a>, wrote <a href="https://atlas.torproject.org/">Atlas</a>, and helps improve security.</div>
81 86
     </td>
... ...
@@ -102,9 +107,9 @@ table.people td {
102 107
   <tr>
103 108
     <td>
104 109
       <div class="photo"><img src="$(IMGROOT)/people/no_photo.png" alt="no photo" /></div>
110
+      <div class="twitter"><a href="https://twitter.com/david415"><img src="$(IMGROOT)/twitter-small.png" alt="twitter" /></a></div>
105 111
       <div class="name"><a href="https://github.com/david415/">David Stainton</a></div>
106 112
       <div class="field"><b>IRC:</b> dawuud</div>
107
-      <div class="field"><b><a href="https://twitter.com/david415">Twitter</a></b></div>
108 113
       <div class="field"><b><a href="../keys/dawuud.txt">PGP Key</a></b></div>
109 114
       <div class="description">Author of roflcoptor and honeybadger. Researches mixnets and contributes to txtorcon.</div>
110 115
     </td>
... ...
@@ -119,9 +124,9 @@ table.people td {
119 124
   <tr>
120 125
     <td>
121 126
       <div class="photo"><img src="$(IMGROOT)/people/no_photo.png" alt="no photo" /></div>
127
+      <div class="twitter"><a href="https://twitter.com/qbi"><img src="$(IMGROOT)/twitter-small.png" alt="twitter" /></a></div>
122 128
       <div class="name">Jens Kubieziel</div>
123 129
       <div class="field"><b>IRC:</b> qbi</div>
124
-      <div class="field"><b><a href="https://twitter.com/qbi">Twitter</a></b></div>
125 130
       <div class="field"><b><a href="../keys/qbi.txt">PGP Key</a></b></div>
126 131
       <div class="description">Volunteer that helps translate the website, is part of TorServers.net, and Tor's sysadmin team.</div>
127 132
     </td>
... ...
@@ -145,9 +150,9 @@ table.people td {
145 150
 
146 151
     <td>
147 152
       <div class="photo"><img src="$(IMGROOT)/people/robgjansen.png" alt="robgjansen" /></div>
153
+      <div class="twitter"><a href="https://twitter.com/robgjansen"><img src="$(IMGROOT)/twitter-small.png" alt="twitter" /></a></div>
148 154
       <div class="name"><a href="http://www.robgjansen.com/">Rob Jansen</a></div>
149 155
       <div class="field"><b>IRC:</b> robgjansen</div>
150
-      <div class="field"><b><a href="https://twitter.com/robgjansen">Twitter</a></b></div>
151 156
       <div class="field"><b><a href="../keys/robgjansen.txt">PGP Key</a></b></div>
152 157
       <div class="description">Security research scientist, leading expert in Tor network performance, and author of <a href="http://shadow.github.io/">Shadow</a>.</div>
153 158
     </td>
... ...
@@ -172,9 +177,9 @@ table.people td {
172 177
   <tr>
173 178
     <td>
174 179
       <div class="photo"><img src="$(IMGROOT)/people/tjr.png" alt="tjr" /></div>
180
+      <div class="twitter"><a href="https://twitter.com/tomrittervg"><img src="$(IMGROOT)/twitter-small.png" alt="twitter" /></a></div>
175 181
       <div class="name">Tom Ritter</div>
176 182
       <div class="field"><b>IRC:</b> tjr</div>
177
-      <div class="field"><b><a href="https://twitter.com/tomrittervg">Twitter</a></b></div>
178 183
       <div class="field"><b><a href="../keys/tjr.txt">PGP Key</a></b></div>
179 184
       <div class="description">Maintains <a href="https://consensus-health.torproject.org/">Consensus Health </a>, runs one of the bandwidth authorities, and contributes to Tor Browser.</div>
180 185
     </td>
... ...
@@ -0,0 +1,5 @@
1
+twitter.png and twitter-small.png
2
+  Artist: Guilherme Lima (http://www.iconarchive.com/artist/limav.html)
3
+  From: http://www.iconarchive.com/show/flat-gradient-social-icons-by-limav/Twitter-icon.html
4
+  License: Free for non-commercial use
5
+