forked from tenderlove/rubycommitters.org
/
base.sass
296 lines (277 loc) · 7.2 KB
/
base.sass
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
@import "reset"
$primary-colour: #b01000
$secondary-colour: #392a2a
$highlight-colour: #b01000
$shadow-colour: #ece0d0
$bg-header-colour: #ffeed4
$bg-main-colour: #fffdf8
/*------------------------------
* elements
*------------------------------
body, p
font-family: "Lucida Grande", Lucida, "Helvetica Neue", Helvetica, "Myriad Pro", Verdana, Tahoma
font-size: 14px
color: $secondary-colour
h2
font-weight: normal
font-size: 18px
a
color: $secondary-colour
text-decoration: none
border-bottom: 1px dotted $primary-colour
&:hover
color: $highlight-colour
border-bottom-style: solid
/*------------------------------
* supporting structures
*------------------------------
#inner-wrapper
position: relative
margin: 0 auto
width: 1000px
#crowd-header-strip
width: 100%
height: 5px
background: $primary-colour
#crowd-footer-strip
width: 100%
height: 15px
background: $secondary-colour
/*------------------------------
* main structures
*------------------------------
body
background: $bg-main-colour
#header-wrapper
background: $bg-header-colour
#header
padding-top: 100px
h1#logo
position: absolute
top: 60px
text-indent: -9999px
width: 319px
height: 37px
background: url("/images/logo-header.png") no-repeat
p#ruby-link
position: absolute
top: 15px
right: 0
a
padding-left: 22px
background: url("/images/icon-browser.png") no-repeat
#crowd-header-viewport
position: relative
overflow: hidden
margin: 0 auto
width: 1070px
height: 140px
#crowd-header, #crowd-header2
position: absolute
#crowd-header
width: 1075px
height: 144px
background: url("/images/crowd-header.png") center no-repeat
z-index: 3
#crowd-header2
width: 1100px
height: 160px
background: url("/images/crowd-header2.png") center no-repeat
z-index: 2
#hero
h2
color: #fff
line-height: 22px
padding: 30px 10px
background: $secondary-colour
#container
padding: 80px 0
background: url("/images/bg-header-gradient.jpg") top repeat-x
table#list
margin: 0 auto
width: 960px
tr.person
position: relative
display: block
background: url("/images/person-container.png") no-repeat
td.list
padding: 20px 20px 50px 20px
td.portraits
width: 90px
.person-letter
position: absolute
top: 2px
left: -25px
color: $shadow-colour
font-family: "Helvetica Neue", Helvetica
font-size: 24px
.portraits-holder
position: absolute
top: -14px
left: 15px
width: 108px
height: 99px
text-align: center
background: url("/images/portrait-holder.png") no-repeat
.portraits-inner-holder
margin-top: 10px
padding-left: 14px
ul.portrait
width: 80px
height: 80px
li
img
width: 80px
td.meta
width: 230px
table
th
padding-right: 10px
color: $secondary-colour
font-size: 9px
font-weight: normal
text-transform: uppercase
text-align: right
h2
font-size: 24px
td.person-headline
padding-bottom: 6px
td
ul
width: 180px
white-space: nowrap
overflow: hidden
line-height: 17px
li
font-size: 13px
padding-top: 5px
ul.social
margin-bottom: -3px
li
float: left
margin-right: 5px
a
display: block
width: 16px
height: 16px
text-indent: -9999px
border: none
li.facebook a
background: url("/images/social-icons/facebook.png") no-repeat
li.friendfeed a
background: url("/images/social-icons/friendfeed.png") no-repeat
li.github a
background: url("/images/social-icons/github.png") no-repeat
li.iddy a
background: url("/images/social-icons/iddy.png") no-repeat
li.mixi a
background: url("/images/social-icons/mixi.png") no-repeat
li.twitter a
background: url("/images/social-icons/twitter.png") no-repeat
td.bios
width: 520px
font-size: 15px
ul.bio-langs
li
position: absolute
right: -5px
a
display: block
width: 26px
height: 12px
padding: 3px 0 0 4px
color: #fff
font-family: "Helvetica Neue", Helvetica
font-size: 9px
border: none
li.eng
top: 5px
a
background: url("/images/button-brown.png") no-repeat
li.jap
top: 22px
a
background: url("/images/button-red.png") no-repeat
ul.bio-text
li
line-height: 16px
margin-right: 20px
&.jap
display: none
#footer
text-align: center
background: url("/images/bg-footer-gradient.jpg") bottom repeat-x
#footer-logo
margin: 0 auto 15px auto
width: 20px
height: 20px
background: url("/images/logo-footer.png") no-repeat
p
font-size: 12px
padding-bottom: 5px
&#copyright
font-size: 14px
#crowd-footer-viewport
position: relative
overflow: hidden
width: 1090px
height: 116px
margin-top: 20px
margin-left: -50px
#crowd-footer, #crowd-footer2
position: absolute
#crowd-footer
width: 1100px
height: 120px
background: url("/images/crowd-footer.png") center no-repeat
z-index: 3
#crowd-footer2
width: 1110px
height: 125px
background: url("/images/crowd-footer2.png") center no-repeat
z-index: 2
/*------------------------------
* portrait slider
*------------------------------
.nivo-controlNav
position: absolute
top: 90px
left: 20px
a
display: block
float: left
width: 20px
height: 20px
text-indent: -9999px
margin-right: -5px
background: url("/images/bullet.png") no-repeat
border: none
cursor: pointer
&.active
background-position: 0 -20px
/*------------------------------
* Fork me on Github :-)
*------------------------------
#ribbon
background-color: $primary-colour
overflow: hidden
position: fixed
left: -3em
top: 2.5em
-moz-transform: rotate(-45deg)
-webkit-transform: rotate(-45deg)
transform: rotate(-45deg)
-moz-box-shadow: 0 0 1em $shadow-colour
-webkit-box-shadow: 0 0 1em $shadow-colour
box-shadow: 0 0 1em $shadow-colour
z-index: 999
a
border: 1px solid #faa
color: #fff
display: block
font: bold 81.25% 'Helvetiva Neue', Helvetica, Arial, sans-serif
margin: 0.05em 0 0.075em 0
padding: 0.5em 3.5em
text-align: center
text-decoration: none
text-shadow: 0 0 0.5em #444