Arukas Share Shadowsocks

├── Dockerfile ├── package.json ├── README.md ├── index2.html ├── index.html ├── server.js └── css.css /Dockerfile: -------------------------------------------------------------------------------- 1 | FROM readytalk/nodejs 2 | WORKDIR /app 3 | WORKDIR /app/views 4 | WORKDIR /app/public 5 | COPY server.js /app/ 6 | COPY package.json /app/ 7 | COPY index.html /app/views 8 | COPY css.css /app/public 9 | RUN npm install 10 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "arukas-get-ip-port", 3 | "version": "1.0.0", 4 | "author": "Malaohu", 5 | "description": "", 6 | "dependencies": { 7 | "express": "4.*", 8 | "ejs": "*", 9 | "superagent":"*" 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ## forked from malaohu/Arukas-API 2 | 3 | # 注意该源码不是部署SSR 4 | 5 | 本代码是部署一个nodejs项目，自动实时获取arukas的IP和端口的。 6 | 7 | 演示地址：https://jazss.arukascloud.io/ 8 | 9 | ### 部署方法 10 | ``` 11 | 镜像：jialezi/arukas-api 12 | 端口:3999 TCP 13 | CMD : node /app/server.js token secret xxxxx-appid-xxxxxx 14 | #推荐使用上面的CMD命令 15 | 16 | CMD : node /app/server.js xxxx@gmail.com password xxxxx-appid-xxxxxx 17 | #注意邮箱，密码和appid直接有一个空格 18 | 19 | ``` 20 | 21 | 详细说明一下CMD中的命令。 22 | 23 | token 和 secret 获取地址： 24 | 25 | https://app.arukas.io/settings/api-keys 26 | 27 | 28 | xxxx@gmail.com 是arukas注册邮箱。 29 | 30 | password 是arukas登录密码。 31 | 32 | xxxxx-appid-xxxxxx 是你要获取IP和端口的APPID （也可以不传，默认是 all） 33 | 34 | 你建立的APP都有一个ID。例如： 35 | ID fd9b708e-9a2c-45a0-b81c-620944369c2d 36 | 37 | 该ID必须在你的账号下才能访问。 38 | 如果你输入的appid 是 all。会自动获取你账号下使用以下镜像创建的APP。 39 | 40 | "malaohu/ssr-with-net-speeder", 41 | 42 | "lowid/ss-with-net-speeder", 43 | 44 | "smounives/shadowsocksr-docker" 45 | 46 | -------------------------------------------------------------------------------- /index2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Arukas Share Shadowsocks 7 | 8 | 9 | 10 | 11 | 12 | 13 |

14 | 17 |

18 |

19 | 调用Arukas API KEY获取IP以及端口等信息。 20 |
21 | 注意以下IP和端口不定期变化！请注意更新。 22 |

23 |

24 | <% for(var i=0;i < data.length; i++) { %> 25 |

26 | 账号信息 ↓↓: 点击查看API接口 27 |

28 |

29 | <%delete data[i].appid%> 30 | <%=JSON.stringify(data[i])%> 31 |

32 |

33 |
34 |

35 |

36 | <% if(data[i].protocol && data[i].obfs){%> 37 |

38 | <%}else{%> 39 |

40 | <%}%> 41 |

42 |

43 |

44 |
45 |
46 |
47 | <% } %> 48 |

49 | 50 |

51 |

52 |

53 |

54 |

55 | 技术支持: 如有乐享 56 | 开源地址: Github 57 |
58 | 59 | 60 |

61 |

62 |

63 |

64 | 65 | This site is built with <3 using Pure v0.6.0 66 |
67 | © 2016 RUYO.net! Inc. All rights reserved. 68 |

69 |

70 |

71 | 72 |

73 |

74 | 75 | 76 | 77 | 85 | 86 | 87 | 88 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Jaz Shares Shadowsocks 7 | 8 | 9 | 10 | 11 | 12 | 13 |

14 | 17 |

18 |

19 | 调用Arukas API KEY获取IP以及端口等信息。 20 |
21 | 注意以下IP和端口不定期变化！！！请注意更新(如果ssr的二维码扫描有问题，请手动输入） 22 |
23 | IP和端口不定期变化！更新可能需要一些时间，失效后请尽量选择不同密码的ss/ssr更换 24 |
25 | 推荐使用shadowsocksr→下载地址 26 |
27 | 不会用的百度，百度都不会的→点这里 28 |
29 |

30 |

31 | <% for(var i=0;i < data.length; i++) { %> 32 |

33 | 账号信息 ↓↓: 34 |

35 |

36 | <%delete data[i].appid%> 37 | <%=JSON.stringify(data[i])%> 38 |

39 |

40 |
41 |

42 |

43 | <% if(data[i].protocol && data[i].obfs){%> 44 |

45 | <%}else{%> 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 |

76 |

77 |

78 | 79 |

80 |

81 | 82 | 83 | 84 | 92 | 93 | 94 | 95 | -------------------------------------------------------------------------------- /server.js: -------------------------------------------------------------------------------- 1 | var express = require('express'); 2 | var superagent = require('superagent'); 3 | var ejs = require('ejs'); 4 | var app = express(); 5 | app.use(express.static(__dirname + '/public')); 6 | app.engine('.html', require('ejs').__express); 7 | app.set('view engine', 'html'); 8 | app.set('views', __dirname + '/views'); 9 | var args = process.argv.slice(2); 10 | var email = '',pwd = '',token = '',secret = ''; 11 | if(args[0].indexOf('@') > -1) 12 | { 13 | email = args[0]; 14 | pwd = args[1]; 15 | }else 16 | { 17 | token = args[0]; 18 | secret = args[1]; 19 | } 20 | 21 | 22 | appid = args[2] || 'all', 23 | images = ["malaohu/ssr-with-net-speeder","lowid/ss-with-net-speeder","smounives/shadowsocksr-docker"]; 24 | 25 | 26 | app.get('/', function(req, res) { 27 | getit(appid,function(err,data){ 28 | if(err || !data) 29 | res.send('没有查询到数据。请检查node启动参数是否正确。更多内容请访问：https://github.com/malaohu/ssr-with-net-speeder/tree/arukas'); 30 | else 31 | res.render('./index.html',{"data":data || []}); 32 | }) 33 | }); 34 | 35 | function getit_by_token(appid,callback) 36 | { 37 | superagent.get("https://app.arukas.io/api/containers").auth(token, secret, {type:'auto'}) 38 | .end(function(err,sres){ 39 | var data = sres.body.data; 40 | if(err) 41 | return callback(err,null); 42 | else 43 | return deal_data(appid,sres.body.data,callback); 44 | }); 45 | } 46 | 47 | 48 | function getit(appid,callback) 49 | { 50 | if(email == '') 51 | return getit_by_token(appid,callback); 52 | superagent.post("https://app.arukas.io/api/login") 53 | .send({email: email, password: pwd}) 54 | .end(function(err,lres){ 55 | if(err) 56 | return callback(err,null); 57 | var cookie = lres.header['set-cookie']; 58 | superagent.get("https://app.arukas.io/api/containers") 59 | .set("Cookie", cookie) 60 | .end(function(err,sres){ 61 | if(err) 62 | return callback(err,null); 63 | else 64 | return deal_data(appid,sres.body.data,callback); 65 | }) 66 | }) 67 | } 68 | 69 | //处理结果信息 70 | function deal_data(_appid,data,callback) 71 | { 72 | var ret_list = []; 73 | for (var i = 0; i < data.length; i++) 74 | { 75 | if(data[i].id == _appid ||(_appid == 'all' && images.indexOf(data[i].attributes.image_name.replace(/:[^ ]+/,''))>-1) ) 76 | { 77 | var jn = data[i]; 78 | console.log(jn); 79 | if(!jn.attributes.port_mappings) 80 | continue; 81 | for (var j = 0; j < jn.attributes.port_mappings.length; j++) 82 | { 83 | var host = jn.attributes.port_mappings[j][0].host; 84 | var ip = host.substring(6,host.indexOf(".")).replace(/-/g,"."); 85 | var service_port = jn.attributes.port_mappings[j][0].service_port; 86 | var container_port = jn.attributes.port_mappings[j][0].container_port; 87 | var cmd = jn.attributes.cmd; 88 | var ss_method = '',ss_password = '',ss_port = '',ss_protocol = '',ss_obfs = ''; 89 | //try to get ss method 90 | if(/-m\s+([^ ]+)/.test(cmd)) 91 | ss_method = RegExp.$1; 92 | //try to get ss password 93 | if(/-k\s+([^ ]+)/.test(cmd)) 94 | ss_password = RegExp.$1; 95 | //try to get ss port 96 | if(/-p\s+([^ ]+)/.test(cmd)) 97 | ss_port = RegExp.$1; 98 | //try to get ssr protocol 99 | if(/-O\s+([^ ]+)/.test(cmd)) 100 | ss_protocol = RegExp.$1; 101 | //try to get ssr obfs 102 | if(/-o\s+([^ ]+)/.test(cmd)) 103 | ss_obfs = RegExp.$1; 104 | if(ss_port == container_port) 105 | { 106 | var ret_json = {"appid":data[i].id,"server":ip,"server_port":service_port,"password":ss_password,"method":ss_method}; 107 | if(ss_protocol && ss_obfs) 108 | { 109 | ret_json["protocol"] = ss_protocol; 110 | ret_json["obfs"] = ss_obfs; 111 | } 112 | ret_list.push(ret_json); 113 | } 114 | } 115 | } 116 | } 117 | return callback(null,ret_list); 118 | } 119 | 120 | app.get('/:appid',function(req,res){ 121 | var _appid = req.params.appid; 122 | getit(_appid,function(e,data){ 123 | if(e) 124 | return res.send(e); 125 | else 126 | return res.send(data); 127 | }); 128 | }) 129 | 130 | app.get('/i', function (req, res) { 131 | res.send('http://51.ruyo.net'); 132 | }) 133 | 134 | app.listen(3999, function () { 135 | console.log('Example app listening on port 3999') 136 | }) 137 | -------------------------------------------------------------------------------- /css.css: -------------------------------------------------------------------------------- 1 | 2 | @media screen and (min-width: 35.5em) { 3 | .u-sm-1, 4 | .u-sm-1-1, 5 | .u-sm-1-2, 6 | .u-sm-1-3, 7 | .u-sm-2-3, 8 | .u-sm-1-4, 9 | .u-sm-3-4, 10 | .u-sm-1-5, 11 | .u-sm-2-5, 12 | .u-sm-3-5, 13 | .u-sm-4-5, 14 | .u-sm-5-5, 15 | .u-sm-1-6, 16 | .u-sm-5-6, 17 | .u-sm-1-8, 18 | .u-sm-3-8, 19 | .u-sm-5-8, 20 | .u-sm-7-8, 21 | .u-sm-1-12, 22 | .u-sm-5-12, 23 | .u-sm-7-12, 24 | .u-sm-11-12, 25 | .u-sm-1-24, 26 | .u-sm-2-24, 27 | .u-sm-3-24, 28 | .u-sm-4-24, 29 | .u-sm-5-24, 30 | .u-sm-6-24, 31 | .u-sm-7-24, 32 | .u-sm-8-24, 33 | .u-sm-9-24, 34 | .u-sm-10-24, 35 | .u-sm-11-24, 36 | .u-sm-12-24, 37 | .u-sm-13-24, 38 | .u-sm-14-24, 39 | .u-sm-15-24, 40 | .u-sm-16-24, 41 | .u-sm-17-24, 42 | .u-sm-18-24, 43 | .u-sm-19-24, 44 | .u-sm-20-24, 45 | .u-sm-21-24, 46 | .u-sm-22-24, 47 | .u-sm-23-24, 48 | .u-sm-24-24 { 49 | display: inline-block; 50 | *display: inline; 51 | zoom: 1; 52 | letter-spacing: normal; 53 | word-spacing: normal; 54 | vertical-align: top; 55 | text-rendering: auto; 56 | } 57 | 58 | .u-sm-1-24 { 59 | width: 4.1667%; 60 | *width: 4.1357%; 61 | } 62 | 63 | .u-sm-1-12, 64 | .u-sm-2-24 { 65 | width: 8.3333%; 66 | *width: 8.3023%; 67 | } 68 | 69 | .u-sm-1-8, 70 | .u-sm-3-24 { 71 | width: 12.5000%; 72 | *width: 12.4690%; 73 | } 74 | 75 | .u-sm-1-6, 76 | .u-sm-4-24 { 77 | width: 16.6667%; 78 | *width: 16.6357%; 79 | } 80 | 81 | .u-sm-1-5 { 82 | width: 20%; 83 | *width: 19.9690%; 84 | } 85 | 86 | .u-sm-5-24 { 87 | width: 20.8333%; 88 | *width: 20.8023%; 89 | } 90 | 91 | .u-sm-1-4, 92 | .u-sm-6-24 { 93 | width: 25%; 94 | *width: 24.9690%; 95 | } 96 | 97 | .u-sm-7-24 { 98 | width: 29.1667%; 99 | *width: 29.1357%; 100 | } 101 | 102 | .u-sm-1-3, 103 | .u-sm-8-24 { 104 | width: 33.3333%; 105 | *width: 33.3023%; 106 | } 107 | 108 | .u-sm-3-8, 109 | .u-sm-9-24 { 110 | width: 37.5000%; 111 | *width: 37.4690%; 112 | } 113 | 114 | .u-sm-2-5 { 115 | width: 40%; 116 | *width: 39.9690%; 117 | } 118 | 119 | .u-sm-5-12, 120 | .u-sm-10-24 { 121 | width: 41.6667%; 122 | *width: 41.6357%; 123 | } 124 | 125 | .u-sm-11-24 { 126 | width: 45.8333%; 127 | *width: 45.8023%; 128 | } 129 | 130 | .u-sm-1-2, 131 | .u-sm-12-24 { 132 | width: 50%; 133 | *width: 49.9690%; 134 | } 135 | 136 | .u-sm-13-24 { 137 | width: 54.1667%; 138 | *width: 54.1357%; 139 | } 140 | 141 | .u-sm-7-12, 142 | .u-sm-14-24 { 143 | width: 58.3333%; 144 | *width: 58.3023%; 145 | } 146 | 147 | .u-sm-3-5 { 148 | width: 60%; 149 | *width: 59.9690%; 150 | } 151 | 152 | .u-sm-5-8, 153 | .u-sm-15-24 { 154 | width: 62.5000%; 155 | *width: 62.4690%; 156 | } 157 | 158 | .u-sm-2-3, 159 | .u-sm-16-24 { 160 | width: 66.6667%; 161 | *width: 66.6357%; 162 | } 163 | 164 | .u-sm-17-24 { 165 | width: 70.8333%; 166 | *width: 70.8023%; 167 | } 168 | 169 | .u-sm-3-4, 170 | .u-sm-18-24 { 171 | width: 75%; 172 | *width: 74.9690%; 173 | } 174 | 175 | .u-sm-19-24 { 176 | width: 79.1667%; 177 | *width: 79.1357%; 178 | } 179 | 180 | .u-sm-4-5 { 181 | width: 80%; 182 | *width: 79.9690%; 183 | } 184 | 185 | .u-sm-5-6, 186 | .u-sm-20-24 { 187 | width: 83.3333%; 188 | *width: 83.3023%; 189 | } 190 | 191 | .u-sm-7-8, 192 | .u-sm-21-24 { 193 | width: 87.5000%; 194 | *width: 87.4690%; 195 | } 196 | 197 | .u-sm-11-12, 198 | .u-sm-22-24 { 199 | width: 91.6667%; 200 | *width: 91.6357%; 201 | } 202 | 203 | .u-sm-23-24 { 204 | width: 95.8333%; 205 | *width: 95.8023%; 206 | } 207 | 208 | .u-sm-1, 209 | .u-sm-1-1, 210 | .u-sm-5-5, 211 | .u-sm-24-24 { 212 | width: 100%; 213 | } 214 | } 215 | 216 | @media screen and (min-width: 48em) { 217 | .u-md-1, 218 | .u-md-1-1, 219 | .u-md-1-2, 220 | .u-md-1-3, 221 | .u-md-2-3, 222 | .u-md-1-4, 223 | .u-md-3-4, 224 | .u-md-1-5, 225 | .u-md-2-5, 226 | .u-md-3-5, 227 | .u-md-4-5, 228 | .u-md-5-5, 229 | .u-md-1-6, 230 | .u-md-5-6, 231 | .u-md-1-8, 232 | .u-md-3-8, 233 | .u-md-5-8, 234 | .u-md-7-8, 235 | .u-md-1-12, 236 | .u-md-5-12, 237 | .u-md-7-12, 238 | .u-md-11-12, 239 | .u-md-1-24, 240 | .u-md-2-24, 241 | .u-md-3-24, 242 | .u-md-4-24, 243 | .u-md-5-24, 244 | .u-md-6-24, 245 | .u-md-7-24, 246 | .u-md-8-24, 247 | .u-md-9-24, 248 | .u-md-10-24, 249 | .u-md-11-24, 250 | .u-md-12-24, 251 | .u-md-13-24, 252 | .u-md-14-24, 253 | .u-md-15-24, 254 | .u-md-16-24, 255 | .u-md-17-24, 256 | .u-md-18-24, 257 | .u-md-19-24, 258 | .u-md-20-24, 259 | .u-md-21-24, 260 | .u-md-22-24, 261 | .u-md-23-24, 262 | .u-md-24-24 { 263 | display: inline-block; 264 | *display: inline; 265 | zoom: 1; 266 | letter-spacing: normal; 267 | word-spacing: normal; 268 | vertical-align: top; 269 | text-rendering: auto; 270 | } 271 | 272 | .u-md-1-24 { 273 | width: 4.1667%; 274 | *width: 4.1357%; 275 | } 276 | 277 | .u-md-1-12, 278 | .u-md-2-24 { 279 | width: 8.3333%; 280 | *width: 8.3023%; 281 | } 282 | 283 | .u-md-1-8, 284 | .u-md-3-24 { 285 | width: 12.5000%; 286 | *width: 12.4690%; 287 | } 288 | 289 | .u-md-1-6, 290 | .u-md-4-24 { 291 | width: 16.6667%; 292 | *width: 16.6357%; 293 | } 294 | 295 | .u-md-1-5 { 296 | width: 20%; 297 | *width: 19.9690%; 298 | } 299 | 300 | .u-md-5-24 { 301 | width: 20.8333%; 302 | *width: 20.8023%; 303 | } 304 | 305 | .u-md-1-4, 306 | .u-md-6-24 { 307 | width: 25%; 308 | *width: 24.9690%; 309 | } 310 | 311 | .u-md-7-24 { 312 | width: 29.1667%; 313 | *width: 29.1357%; 314 | } 315 | 316 | .u-md-1-3, 317 | .u-md-8-24 { 318 | width: 33.3333%; 319 | *width: 33.3023%; 320 | } 321 | 322 | .u-md-3-8, 323 | .u-md-9-24 { 324 | width: 37.5000%; 325 | *width: 37.4690%; 326 | } 327 | 328 | .u-md-2-5 { 329 | width: 40%; 330 | *width: 39.9690%; 331 | } 332 | 333 | .u-md-5-12, 334 | .u-md-10-24 { 335 | width: 41.6667%; 336 | *width: 41.6357%; 337 | } 338 | 339 | .u-md-11-24 { 340 | width: 45.8333%; 341 | *width: 45.8023%; 342 | } 343 | 344 | .u-md-1-2, 345 | .u-md-12-24 { 346 | width: 50%; 347 | *width: 49.9690%; 348 | } 349 | 350 | .u-md-13-24 { 351 | width: 54.1667%; 352 | *width: 54.1357%; 353 | } 354 | 355 | .u-md-7-12, 356 | .u-md-14-24 { 357 | width: 58.3333%; 358 | *width: 58.3023%; 359 | } 360 | 361 | .u-md-3-5 { 362 | width: 60%; 363 | *width: 59.9690%; 364 | } 365 | 366 | .u-md-5-8, 367 | .u-md-15-24 { 368 | width: 62.5000%; 369 | *width: 62.4690%; 370 | } 371 | 372 | .u-md-2-3, 373 | .u-md-16-24 { 374 | width: 66.6667%; 375 | *width: 66.6357%; 376 | } 377 | 378 | .u-md-17-24 { 379 | width: 70.8333%; 380 | *width: 70.8023%; 381 | } 382 | 383 | .u-md-3-4, 384 | .u-md-18-24 { 385 | width: 75%; 386 | *width: 74.9690%; 387 | } 388 | 389 | .u-md-19-24 { 390 | width: 79.1667%; 391 | *width: 79.1357%; 392 | } 393 | 394 | .u-md-4-5 { 395 | width: 80%; 396 | *width: 79.9690%; 397 | } 398 | 399 | .u-md-5-6, 400 | .u-md-20-24 { 401 | width: 83.3333%; 402 | *width: 83.3023%; 403 | } 404 | 405 | .u-md-7-8, 406 | .u-md-21-24 { 407 | width: 87.5000%; 408 | *width: 87.4690%; 409 | } 410 | 411 | .u-md-11-12, 412 | .u-md-22-24 { 413 | width: 91.6667%; 414 | *width: 91.6357%; 415 | } 416 | 417 | .u-md-23-24 { 418 | width: 95.8333%; 419 | *width: 95.8023%; 420 | } 421 | 422 | .u-md-1, 423 | .u-md-1-1, 424 | .u-md-5-5, 425 | .u-md-24-24 { 426 | width: 100%; 427 | } 428 | } 429 | 430 | @media screen and (min-width: 58em) { 431 | .u-lg-1, 432 | .u-lg-1-1, 433 | .u-lg-1-2, 434 | .u-lg-1-3, 435 | .u-lg-2-3, 436 | .u-lg-1-4, 437 | .u-lg-3-4, 438 | .u-lg-1-5, 439 | .u-lg-2-5, 440 | .u-lg-3-5, 441 | .u-lg-4-5, 442 | .u-lg-5-5, 443 | .u-lg-1-6, 444 | .u-lg-5-6, 445 | .u-lg-1-8, 446 | .u-lg-3-8, 447 | .u-lg-5-8, 448 | .u-lg-7-8, 449 | .u-lg-1-12, 450 | .u-lg-5-12, 451 | .u-lg-7-12, 452 | .u-lg-11-12, 453 | .u-lg-1-24, 454 | .u-lg-2-24, 455 | .u-lg-3-24, 456 | .u-lg-4-24, 457 | .u-lg-5-24, 458 | .u-lg-6-24, 459 | .u-lg-7-24, 460 | .u-lg-8-24, 461 | .u-lg-9-24, 462 | .u-lg-10-24, 463 | .u-lg-11-24, 464 | .u-lg-12-24, 465 | .u-lg-13-24, 466 | .u-lg-14-24, 467 | .u-lg-15-24, 468 | .u-lg-16-24, 469 | .u-lg-17-24, 470 | .u-lg-18-24, 471 | .u-lg-19-24, 472 | .u-lg-20-24, 473 | .u-lg-21-24, 474 | .u-lg-22-24, 475 | .u-lg-23-24, 476 | .u-lg-24-24 { 477 | display: inline-block; 478 | *display: inline; 479 | zoom: 1; 480 | letter-spacing: normal; 481 | word-spacing: normal; 482 | vertical-align: top; 483 | text-rendering: auto; 484 | } 485 | 486 | .u-lg-1-24 { 487 | width: 4.1667%; 488 | *width: 4.1357%; 489 | } 490 | 491 | .u-lg-1-12, 492 | .u-lg-2-24 { 493 | width: 8.3333%; 494 | *width: 8.3023%; 495 | } 496 | 497 | .u-lg-1-8, 498 | .u-lg-3-24 { 499 | width: 12.5000%; 500 | *width: 12.4690%; 501 | } 502 | 503 | .u-lg-1-6, 504 | .u-lg-4-24 { 505 | width: 16.6667%; 506 | *width: 16.6357%; 507 | } 508 | 509 | .u-lg-1-5 { 510 | width: 20%; 511 | *width: 19.9690%; 512 | } 513 | 514 | .u-lg-5-24 { 515 | width: 20.8333%; 516 | *width: 20.8023%; 517 | } 518 | 519 | .u-lg-1-4, 520 | .u-lg-6-24 { 521 | width: 25%; 522 | *width: 24.9690%; 523 | } 524 | 525 | .u-lg-7-24 { 526 | width: 29.1667%; 527 | *width: 29.1357%; 528 | } 529 | 530 | .u-lg-1-3, 531 | .u-lg-8-24 { 532 | width: 33.3333%; 533 | *width: 33.3023%; 534 | } 535 | 536 | .u-lg-3-8, 537 | .u-lg-9-24 { 538 | width: 37.5000%; 539 | *width: 37.4690%; 540 | } 541 | 542 | .u-lg-2-5 { 543 | width: 40%; 544 | *width: 39.9690%; 545 | } 546 | 547 | .u-lg-5-12, 548 | .u-lg-10-24 { 549 | width: 41.6667%; 550 | *width: 41.6357%; 551 | } 552 | 553 | .u-lg-11-24 { 554 | width: 45.8333%; 555 | *width: 45.8023%; 556 | } 557 | 558 | .u-lg-1-2, 559 | .u-lg-12-24 { 560 | width: 50%; 561 | *width: 49.9690%; 562 | } 563 | 564 | .u-lg-13-24 { 565 | width: 54.1667%; 566 | *width: 54.1357%; 567 | } 568 | 569 | .u-lg-7-12, 570 | .u-lg-14-24 { 571 | width: 58.3333%; 572 | *width: 58.3023%; 573 | } 574 | 575 | .u-lg-3-5 { 576 | width: 60%; 577 | *width: 59.9690%; 578 | } 579 | 580 | .u-lg-5-8, 581 | .u-lg-15-24 { 582 | width: 62.5000%; 583 | *width: 62.4690%; 584 | } 585 | 586 | .u-lg-2-3, 587 | .u-lg-16-24 { 588 | width: 66.6667%; 589 | *width: 66.6357%; 590 | } 591 | 592 | .u-lg-17-24 { 593 | width: 70.8333%; 594 | *width: 70.8023%; 595 | } 596 | 597 | .u-lg-3-4, 598 | .u-lg-18-24 { 599 | width: 75%; 600 | *width: 74.9690%; 601 | } 602 | 603 | .u-lg-19-24 { 604 | width: 79.1667%; 605 | *width: 79.1357%; 606 | } 607 | 608 | .u-lg-4-5 { 609 | width: 80%; 610 | *width: 79.9690%; 611 | } 612 | 613 | .u-lg-5-6, 614 | .u-lg-20-24 { 615 | width: 83.3333%; 616 | *width: 83.3023%; 617 | } 618 | 619 | .u-lg-7-8, 620 | .u-lg-21-24 { 621 | width: 87.5000%; 622 | *width: 87.4690%; 623 | } 624 | 625 | .u-lg-11-12, 626 | .u-lg-22-24 { 627 | width: 91.6667%; 628 | *width: 91.6357%; 629 | } 630 | 631 | .u-lg-23-24 { 632 | width: 95.8333%; 633 | *width: 95.8023%; 634 | } 635 | 636 | .u-lg-1, 637 | .u-lg-1-1, 638 | .u-lg-5-5, 639 | .u-lg-24-24 { 640 | width: 100%; 641 | } 642 | } 643 | 644 | @media screen and (min-width: 75em) { 645 | .u-xl-1, 646 | .u-xl-1-1, 647 | .u-xl-1-2, 648 | .u-xl-1-3, 649 | .u-xl-2-3, 650 | .u-xl-1-4, 651 | .u-xl-3-4, 652 | .u-xl-1-5, 653 | .u-xl-2-5, 654 | .u-xl-3-5, 655 | .u-xl-4-5, 656 | .u-xl-5-5, 657 | .u-xl-1-6, 658 | .u-xl-5-6, 659 | .u-xl-1-8, 660 | .u-xl-3-8, 661 | .u-xl-5-8, 662 | .u-xl-7-8, 663 | .u-xl-1-12, 664 | .u-xl-5-12, 665 | .u-xl-7-12, 666 | .u-xl-11-12, 667 | .u-xl-1-24, 668 | .u-xl-2-24, 669 | .u-xl-3-24, 670 | .u-xl-4-24, 671 | .u-xl-5-24, 672 | .u-xl-6-24, 673 | .u-xl-7-24, 674 | .u-xl-8-24, 675 | .u-xl-9-24, 676 | .u-xl-10-24, 677 | .u-xl-11-24, 678 | .u-xl-12-24, 679 | .u-xl-13-24, 680 | .u-xl-14-24, 681 | .u-xl-15-24, 682 | .u-xl-16-24, 683 | .u-xl-17-24, 684 | .u-xl-18-24, 685 | .u-xl-19-24, 686 | .u-xl-20-24, 687 | .u-xl-21-24, 688 | .u-xl-22-24, 689 | .u-xl-23-24, 690 | .u-xl-24-24 { 691 | display: inline-block; 692 | *display: inline; 693 | zoom: 1; 694 | letter-spacing: normal; 695 | word-spacing: normal; 696 | vertical-align: top; 697 | text-rendering: auto; 698 | } 699 | 700 | .u-xl-1-24 { 701 | width: 4.1667%; 702 | *width: 4.1357%; 703 | } 704 | 705 | .u-xl-1-12, 706 | .u-xl-2-24 { 707 | width: 8.3333%; 708 | *width: 8.3023%; 709 | } 710 | 711 | .u-xl-1-8, 712 | .u-xl-3-24 { 713 | width: 12.5000%; 714 | *width: 12.4690%; 715 | } 716 | 717 | .u-xl-1-6, 718 | .u-xl-4-24 { 719 | width: 16.6667%; 720 | *width: 16.6357%; 721 | } 722 | 723 | .u-xl-1-5 { 724 | width: 20%; 725 | *width: 19.9690%; 726 | } 727 | 728 | .u-xl-5-24 { 729 | width: 20.8333%; 730 | *width: 20.8023%; 731 | } 732 | 733 | .u-xl-1-4, 734 | .u-xl-6-24 { 735 | width: 25%; 736 | *width: 24.9690%; 737 | } 738 | 739 | .u-xl-7-24 { 740 | width: 29.1667%; 741 | *width: 29.1357%; 742 | } 743 | 744 | .u-xl-1-3, 745 | .u-xl-8-24 { 746 | width: 33.3333%; 747 | *width: 33.3023%; 748 | } 749 | 750 | .u-xl-3-8, 751 | .u-xl-9-24 { 752 | width: 37.5000%; 753 | *width: 37.4690%; 754 | } 755 | 756 | .u-xl-2-5 { 757 | width: 40%; 758 | *width: 39.9690%; 759 | } 760 | 761 | .u-xl-5-12, 762 | .u-xl-10-24 { 763 | width: 41.6667%; 764 | *width: 41.6357%; 765 | } 766 | 767 | .u-xl-11-24 { 768 | width: 45.8333%; 769 | *width: 45.8023%; 770 | } 771 | 772 | .u-xl-1-2, 773 | .u-xl-12-24 { 774 | width: 50%; 775 | *width: 49.9690%; 776 | } 777 | 778 | .u-xl-13-24 { 779 | width: 54.1667%; 780 | *width: 54.1357%; 781 | } 782 | 783 | .u-xl-7-12, 784 | .u-xl-14-24 { 785 | width: 58.3333%; 786 | *width: 58.3023%; 787 | } 788 | 789 | .u-xl-3-5 { 790 | width: 60%; 791 | *width: 59.9690%; 792 | } 793 | 794 | .u-xl-5-8, 795 | .u-xl-15-24 { 796 | width: 62.5000%; 797 | *width: 62.4690%; 798 | } 799 | 800 | .u-xl-2-3, 801 | .u-xl-16-24 { 802 | width: 66.6667%; 803 | *width: 66.6357%; 804 | } 805 | 806 | .u-xl-17-24 { 807 | width: 70.8333%; 808 | *width: 70.8023%; 809 | } 810 | 811 | .u-xl-3-4, 812 | .u-xl-18-24 { 813 | width: 75%; 814 | *width: 74.9690%; 815 | } 816 | 817 | .u-xl-19-24 { 818 | width: 79.1667%; 819 | *width: 79.1357%; 820 | } 821 | 822 | .u-xl-4-5 { 823 | width: 80%; 824 | *width: 79.9690%; 825 | } 826 | 827 | .u-xl-5-6, 828 | .u-xl-20-24 { 829 | width: 83.3333%; 830 | *width: 83.3023%; 831 | } 832 | 833 | .u-xl-7-8, 834 | .u-xl-21-24 { 835 | width: 87.5000%; 836 | *width: 87.4690%; 837 | } 838 | 839 | .u-xl-11-12, 840 | .u-xl-22-24 { 841 | width: 91.6667%; 842 | *width: 91.6357%; 843 | } 844 | 845 | .u-xl-23-24 { 846 | width: 95.8333%; 847 | *width: 95.8023%; 848 | } 849 | 850 | .u-xl-1, 851 | .u-xl-1-1, 852 | .u-xl-5-5, 853 | .u-xl-24-24 { 854 | width: 100%; 855 | } 856 | } 857 | * { 858 | -webkit-box-sizing: border-box; 859 | -moz-box-sizing: border-box; 860 | box-sizing: border-box; 861 | } 862 | 863 | *:before, 864 | *:after { 865 | -webkit-box-sizing: border-box; 866 | -moz-box-sizing: border-box; 867 | box-sizing: border-box; 868 | } 869 | 870 | html, button, input, select, textarea, 871 | .pure-g [class *= "pure-u"] { 872 | font-family: sans-serif; 873 | font-weight: 100; 874 | letter-spacing: 0.01em; 875 | } 876 | 877 | 878 | /* -------------------------- 879 | * Element Styles 880 | * -------------------------- 881 | */ 882 | 883 | body { 884 | min-width: 320px; 885 | color: #777; 886 | line-height: 1.6; 887 | } 888 | 889 | h1, h2, h3, h4, h5, h6 { 890 | font-weight: bold; 891 | color: rgb(75, 75, 75); 892 | } 893 | h3 { 894 | font-size: 1.25em; 895 | } 896 | h4 { 897 | font-size: 1.125em; 898 | } 899 | 900 | a { 901 | color: #3b8bba; /* block-background-text-normal */ 902 | text-decoration: none; 903 | } 904 | 905 | a:visited { 906 | color: #265778; /* block-normal-text-normal */ 907 | } 908 | 909 | dt { 910 | font-weight: bold; 911 | } 912 | dd { 913 | margin: 0 0 10px 0; 914 | } 915 | 916 | aside { 917 | background: #1f8dd6; /* same color as selected state on site menu */ 918 | padding: 0.3em 1em; 919 | border-radius: 3px; 920 | color: #fff; 921 | } 922 | aside a, aside a:visited { 923 | color: rgb(169, 226, 255); 924 | } 925 | 926 | 927 | /* -------------------------- 928 | * Layout Styles 929 | * -------------------------- 930 | */ 931 | 932 | /* Navigation Push Styles */ 933 | #layout { 934 | position: relative; 935 | padding-left: 0; 936 | } 937 | #layout.active #menu { 938 | left: 160px; 939 | width: 160px; 940 | } 941 | 942 | /* Apply the .box class on the immediate parent of any grid element (pure-u-*) to apply some padding. */ 943 | .l-box { 944 | padding: 1em; 945 | } 946 | 947 | .l-wrap { 948 | margin-left: auto; 949 | margin-right: auto; 950 | } 951 | .content .l-wrap { 952 | margin-left: -1em; 953 | margin-right: -1em; 954 | } 955 | 956 | 957 | /* -------------------------- 958 | * Header Module Styles 959 | * -------------------------- 960 | */ 961 | 962 | .header { 963 | font-family: "Raleway", "Helvetica Neue", Helvetica, Arial, sans-serif; 964 | max-width: 768px; 965 | margin: 0 auto; 966 | padding: 1em; 967 | text-align: center; 968 | border-bottom: 1px solid #eee; 969 | background: #fff; 970 | letter-spacing: 0.05em; 971 | } 972 | .header h1 { 973 | font-size: 300%; 974 | font-weight: 100; 975 | margin: 0; 976 | } 977 | .header h2 { 978 | font-size: 125%; 979 | font-weight: 100; 980 | line-height: 1.5; 981 | margin: 0; 982 | color: #666; 983 | letter-spacing: -0.02em; 984 | } 985 | 986 | 987 | /* -------------------------- 988 | * Content Module Styles 989 | * -------------------------- 990 | */ 991 | 992 | /* The content div is placed as a wrapper around all the docs */ 993 | .content { 994 | margin-left: auto; 995 | margin-right: auto; 996 | padding-left: 1em; 997 | padding-right: 1em; 998 | max-width: 768px; 999 | } 1000 | 1001 | .content .content-subhead { 1002 | margin: 2em 0 1em 0; 1003 | font-weight: 300; 1004 | color: #888; 1005 | position: relative; 1006 | } 1007 | 1008 | .content .content-spaced { 1009 | line-height: 1.8; 1010 | } 1011 | 1012 | .content .content-quote { 1013 | font-family: "Georgia", serif; 1014 | color: #666; 1015 | font-style: italic; 1016 | line-height: 1.8; 1017 | border-left: 5px solid #ddd; 1018 | padding-left: 1.5em; 1019 | } 1020 | 1021 | .content-link { 1022 | position: absolute; 1023 | top: 0; 1024 | right: 0; 1025 | display: block; 1026 | height: 100%; 1027 | width: 20px; 1028 | background: transparent url('/img/link-icon.png') no-repeat center center; 1029 | background-size: 20px 20px; 1030 | } 1031 | 1032 | @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { 1033 | .content-link { 1034 | background-image: url('/img/link-icon@2x.png'); 1035 | } 1036 | } 1037 | 1038 | 1039 | /* -------------------------- 1040 | * Code Styles 1041 | * -------------------------- 1042 | */ 1043 | 1044 | pre, 1045 | code { 1046 | font-family: Consolas, Courier, monospace; 1047 | color: #333; 1048 | background: rgb(250, 250, 250); 1049 | } 1050 | 1051 | code { 1052 | padding: 0.2em 0.4em; 1053 | white-space: nowrap; 1054 | } 1055 | .content p code { 1056 | font-size: 90%; 1057 | } 1058 | 1059 | .code { 1060 | margin-left: -1em; 1061 | margin-right: -1em; 1062 | padding: 1em; 1063 | border: 1px solid #eee; 1064 | border-left-width: 0; 1065 | border-right-width: 0; 1066 | overflow-x: auto; 1067 | -webkit-overflow-scrolling: touch; 1068 | } 1069 | .code code { 1070 | font-size: 95%; 1071 | white-space: pre; 1072 | word-wrap: normal; 1073 | padding: 0; 1074 | background: none; 1075 | } 1076 | .code-wrap code { 1077 | white-space: pre-wrap; 1078 | word-wrap: break-word; 1079 | } 1080 | 1081 | /* -------------------------- 1082 | * Footer Module Styles 1083 | * -------------------------- 1084 | */ 1085 | 1086 | .footer { 1087 | font-size: 87.5%; 1088 | border-top: 1px solid #eee; 1089 | margin-top: 3.4286em; 1090 | padding: 1.1429em; 1091 | background: rgb(250, 250, 250); 1092 | } 1093 | 1094 | .legal { 1095 | line-height: 1.6; 1096 | text-align: center; 1097 | margin: 0 auto; 1098 | } 1099 | 1100 | .legal-license { 1101 | margin-top: 0; 1102 | } 1103 | .legal-links { 1104 | list-style: none; 1105 | padding: 0; 1106 | margin-bottom: 0; 1107 | } 1108 | .legal-copyright { 1109 | margin-top: 0; 1110 | margin-bottom: 0; 1111 | } 1112 | 1113 | 1114 | /* -------------------------- 1115 | * Main Navigation Bar Styles 1116 | * -------------------------- 1117 | */ 1118 | 1119 | /* Add transition to containers so they can push in and out */ 1120 | #layout, 1121 | #menu, 1122 | .menu-link { 1123 | -webkit-transition: all 0.2s ease-out; 1124 | -moz-transition: all 0.2s ease-out; 1125 | -ms-transition: all 0.2s ease-out; 1126 | -o-transition: all 0.2s ease-out; 1127 | transition: all 0.2s ease-out; 1128 | } 1129 | 1130 | #layout.active .menu-link { 1131 | left: 160px; 1132 | } 1133 | 1134 | #menu { 1135 | margin-left: -160px; /* "#menu" width */ 1136 | width: 160px; 1137 | position: fixed; 1138 | top: 0; 1139 | left: 0; 1140 | bottom: 0; 1141 | z-index: 1000; /* so the menu or its navicon stays above all content */ 1142 | background: #191818; 1143 | overflow-y: auto; 1144 | -webkit-overflow-scrolling: touch; 1145 | } 1146 | #menu a { 1147 | color: #999; 1148 | border: none; 1149 | white-space: normal; 1150 | padding: 0.625em 1em; 1151 | } 1152 | 1153 | #menu .pure-menu-open { 1154 | background: transparent; 1155 | border: 0; 1156 | } 1157 | 1158 | #menu .pure-menu ul { 1159 | border: none; 1160 | background: transparent; 1161 | display: block; 1162 | } 1163 | 1164 | #menu .pure-menu ul, 1165 | #menu .pure-menu .menu-item-divided { 1166 | border-top: 1px solid #333; 1167 | } 1168 | 1169 | #menu .pure-menu li a:hover, 1170 | #menu .pure-menu li a:focus { 1171 | background: #333; 1172 | } 1173 | 1174 | .menu-link { 1175 | position: fixed; 1176 | display: block; /* show this only on small screens */ 1177 | top: 0; 1178 | left: 0; /* "#menu width" */ 1179 | background: #000; 1180 | background: rgba(0,0,0,0.7); 1181 | font-size: 11px; /* change this value to increase/decrease button size */ 1182 | z-index: 10; 1183 | width: 4em; 1184 | height: 4em; 1185 | padding: 1em; 1186 | } 1187 | 1188 | .menu-link:hover, 1189 | .menu-link:focus { 1190 | background: #000; 1191 | } 1192 | 1193 | .menu-link span { 1194 | position: relative; 1195 | display: block; 1196 | margin-top: 0.9em; 1197 | } 1198 | 1199 | .menu-link span, 1200 | .menu-link span:before, 1201 | .menu-link span:after { 1202 | background-color: #fff; 1203 | width: 100%; 1204 | height: .2em; 1205 | -webkit-transition: all 0.4s; 1206 | -moz-transition: all 0.4s; 1207 | -ms-transition: all 0.4s; 1208 | -o-transition: all 0.4s; 1209 | transition: all 0.4s; 1210 | } 1211 | 1212 | .menu-link span:before, 1213 | .menu-link span:after { 1214 | position: absolute; 1215 | top: -.55em; 1216 | content: " "; 1217 | } 1218 | 1219 | .menu-link span:after { 1220 | top: .55em; 1221 | } 1222 | 1223 | .menu-link.active span { 1224 | background: transparent; 1225 | } 1226 | 1227 | .menu-link.active span:before { 1228 | -webkit-transform: rotate(45deg) translate(.5em, .4em); 1229 | -moz-transform: rotate(45deg) translate(.5em, .4em); 1230 | -ms-transform: rotate(45deg) translate(.5em, .4em); 1231 | -o-transform: rotate(45deg) translate(.5em, .4em); 1232 | transform: rotate(45deg) translate(.5em, .4em); 1233 | } 1234 | 1235 | .menu-link.active span:after { 1236 | -webkit-transform: rotate(-45deg) translate(.4em, -.3em); 1237 | -moz-transform: rotate(-45deg) translate(.4em, -.3em); 1238 | -ms-transform: rotate(-45deg) translate(.4em, -.3em); 1239 | -o-transform: rotate(-45deg) translate(.4em, -.3em); 1240 | transform: rotate(-45deg) translate(.4em, -.3em); 1241 | } 1242 | 1243 | #menu .pure-menu-heading { 1244 | font-size: 125%; 1245 | font-weight: 300; 1246 | letter-spacing: 0.1em; 1247 | color: #fff; 1248 | margin-top: 0; 1249 | padding: 0.5em 0.8em; 1250 | text-transform: uppercase; 1251 | } 1252 | #menu .pure-menu-heading:hover, 1253 | #menu .pure-menu-heading:focus { 1254 | color: #999; 1255 | } 1256 | 1257 | #menu .pure-menu-selected { 1258 | background: #1f8dd6; 1259 | } 1260 | 1261 | #menu .pure-menu-selected a { 1262 | color: #fff; 1263 | } 1264 | 1265 | #menu li.pure-menu-selected a:hover, 1266 | #menu li.pure-menu-selected a:focus { 1267 | background: none; 1268 | } 1269 | 1270 | 1271 | 1272 | /* --------------------- 1273 | * Smaller Module Styles 1274 | * --------------------- 1275 | */ 1276 | 1277 | .pure-img-responsive { 1278 | max-width: 100%; 1279 | height: auto; 1280 | } 1281 | 1282 | .pure-paginator .pure-button { 1283 | -webkit-box-sizing: content-box; 1284 | -moz-box-sizing: content-box; 1285 | box-sizing: content-box; 1286 | } 1287 | 1288 | .pure-button { 1289 | font-family: inherit; 1290 | } 1291 | a.pure-button-primary { 1292 | color: white; 1293 | } 1294 | 1295 | 1296 | /* green call to action button class */ 1297 | .notice { 1298 | background-color: #61B842; 1299 | color: white; 1300 | } 1301 | 1302 | .muted { 1303 | color: #ccc; 1304 | } 1305 | 1306 | 1307 | 1308 | /* ------------- 1309 | * Table Styles 1310 | * ------------- 1311 | */ 1312 | 1313 | .pure-table th, 1314 | .pure-table td { 1315 | padding: 0.5em 1em; 1316 | } 1317 | 1318 | .table-responsive { 1319 | margin-left: -1em; 1320 | margin-right: -1em; 1321 | overflow-x: auto; 1322 | -webkit-overflow-scrolling: touch; 1323 | margin-bottom: 1em; 1324 | } 1325 | .table-responsive table { 1326 | width: 100%; 1327 | min-width: 35.5em; 1328 | border-left-width: 0; 1329 | border-right-width: 0; 1330 | } 1331 | 1332 | .table-responsive .mq-table { 1333 | width: 100%; 1334 | min-width: 44em; 1335 | } 1336 | .mq-table th.highlight { 1337 | background-color: rgb(255, 234, 133); 1338 | } 1339 | .mq-table td.highlight { 1340 | background-color: rgb(255, 250, 229); 1341 | } 1342 | .mq-table th.highlight code, 1343 | .mq-table td.highlight code { 1344 | background: rgb(255, 255, 243); 1345 | } 1346 | .mq-table-mq code { 1347 | font-size: 0.875em; 1348 | } 1349 | 1350 | /* ---------------------------- 1351 | * Example for full-width Grids 1352 | * ---------------------------- 1353 | */ 1354 | 1355 | .grids-example { 1356 | background: rgb(250, 250, 250); 1357 | margin: 2em auto; 1358 | border-top: 1px solid #ddd; 1359 | border-bottom: 1px solid #ddd; 1360 | } 1361 | 1362 | /* -------------------------- 1363 | * State Rules 1364 | * -------------------------- 1365 | */ 1366 | 1367 | 1368 | .is-code-full { 1369 | text-align: center; 1370 | } 1371 | .is-code-full .code { 1372 | margin-left: auto; 1373 | margin-right: auto; 1374 | } 1375 | 1376 | 1377 | /* -------------------------- 1378 | * Responsive Styles 1379 | * -------------------------- 1380 | */ 1381 | 1382 | @media screen and (min-width: 35.5em) { 1383 | 1384 | .legal-license { 1385 | text-align: left; 1386 | margin: 0; 1387 | } 1388 | .legal-copyright, 1389 | .legal-links, 1390 | .legal-links li { 1391 | text-align: right; 1392 | margin: 0; 1393 | } 1394 | 1395 | } 1396 | 1397 | @media screen and (min-width: 48em) { 1398 | 1399 | .l-wrap, 1400 | .l-wrap .content { 1401 | padding-left: 1em; 1402 | padding-right: 1em; 1403 | } 1404 | .content .l-wrap { 1405 | margin-left: -2em; 1406 | margin-right: -2em; 1407 | } 1408 | 1409 | .header, 1410 | .content { 1411 | padding-left: 2em; 1412 | padding-right: 2em; 1413 | } 1414 | 1415 | .header h1 { 1416 | font-size: 320%; 1417 | } 1418 | .header h2 { 1419 | font-size: 128%; 1420 | } 1421 | 1422 | .content p { 1423 | font-size: 1.125em; 1424 | } 1425 | 1426 | .code { 1427 | margin-left: auto; 1428 | margin-right: auto; 1429 | border-left-width: 1px; 1430 | border-right-width: 1px; 1431 | } 1432 | 1433 | .table-responsive { 1434 | margin-left: auto; 1435 | margin-right: auto; 1436 | } 1437 | .table-responsive table { 1438 | border-left-width: 1px; 1439 | border-right-width: 1px; 1440 | } 1441 | 1442 | } 1443 | 1444 | @media (max-width: 58em) { 1445 | /* Only apply this when the window is smaller. Otherwise, the following 1446 | case results in extra padding on the left: 1447 | * Make the window small. (Rotate to portrait on a mobile.) 1448 | * Tap the menu to trigger the active state. 1449 | * Make the window large again. (Rotate to landscape on mobile.) 1450 | */ 1451 | #layout.active { 1452 | position: relative; 1453 | left: 160px; 1454 | } 1455 | } 1456 | 1457 | @media (min-width: 58em) { 1458 | 1459 | #layout { 1460 | padding-left: 160px; /* left col width "#menu" */ 1461 | left: 0; 1462 | } 1463 | #menu { 1464 | left: 160px; 1465 | } 1466 | .menu-link { 1467 | position: fixed; 1468 | left: 160px; 1469 | display: none; 1470 | } 1471 | #layout.active .menu-link { 1472 | left: 160px; 1473 | } 1474 | 1475 | } 1476 | 1477 | /** 1478 | * Baby Blue theme for RainbowJS 1479 | * 1480 | * @author tilomitra 1481 | */ 1482 | 1483 | pre .comment { 1484 | color: #999; 1485 | } 1486 | 1487 | pre .tag, 1488 | pre .tag-name, 1489 | pre .support.tag-name { 1490 | color: rgb(85, 85, 85); 1491 | } 1492 | 1493 | pre .keyword, 1494 | pre .css-property, 1495 | pre .vendor-prefix, 1496 | pre .sass, 1497 | pre .class, 1498 | pre .id, 1499 | pre .css-value, 1500 | pre .entity.function, 1501 | pre .storage.function { 1502 | font-weight: bold; 1503 | } 1504 | 1505 | pre .css-property, 1506 | pre .css-value, 1507 | pre .vendor-prefix, 1508 | pre .support.namespace { 1509 | color: #333; 1510 | } 1511 | 1512 | pre .constant.numeric, 1513 | pre .keyword.unit, 1514 | pre .hex-color { 1515 | font-weight: normal; 1516 | color: #099; 1517 | } 1518 | 1519 | pre .attribute, 1520 | pre .variable, 1521 | pre .support { 1522 | color: #757575; /* skinbuilder block-page-text-normal with #1f8dd6 as primary */ 1523 | } 1524 | 1525 | pre .string, 1526 | pre .support.value { 1527 | font-weight: normal; 1528 | color: #3b8bba; /* skinbuilder block-mine-text-low with #1f8dd6 as primary */ 1529 | } 1530 | --------------------------------------------------------------------------------