1+ ---
2+ test: 123
3+ ---
4+ <!doctype html >
5+ <html class= " no-js" >
6+ <head>
7+ <meta charset= " utf-8" >
8+ <meta http-equiv= " X-UA-Compatible" content= " IE=edge" >
9+ <meta name= " description" content= " " >
10+ <meta name= " keywords" content= " " >
11+ <meta name= " viewport" content= " width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" >
12+ <title>{{ page.title }} - Yncoder Interview</title>
13+ <meta name= " renderer" content= " webkit" >
14+ <meta http-equiv= " Cache-Control" content= " no-siteapp" />
15+ <style type= " text/css" >
16+ * {
17+ -webkit-box-sizing: border-box;
18+ -moz-box-sizing: border-box;
19+ box-sizing: border-box;
20+ -webkit-text-size-adjust: none;
21+ }
22+ html ,
23+ body {
24+ margin: 0;
25+ padding: 0;
26+ border: none;
27+ line-height: 1;
28+ min-height: 100%;
29+ height: 100%;
30+ }
31+ body {
32+ font-size: 16px;
33+ font-family: " Microsoft YaHei" , " 微软雅黑" , Arial, Helvetica, sans-serif;
34+ }
35+ ul,
36+ ol,
37+ figure,
38+ form,
39+ dl,
40+ dt,
41+ dd {
42+ margin: 0;
43+ padding: 0;
44+ }
45+ img {
46+ border: 0;
47+ vertical-align: middle;
48+ }
49+ a {
50+ color: #0395d0;
51+ text-decoration: none;
52+ }
53+ a:hover {
54+ text-decoration: underline;
55+ }
56+ .row {
57+ position: relative;
58+ }
59+ .logo {
60+ font-size: 2em;
61+ line-height: 1.5em ;
62+ text-align: center;
63+ font-family: 'Expletus Sans', cursive;
64+ font-weight: 500;
65+ padding-top: 0.6em ;
66+ padding-bottom: 0.6em ;
67+ color: #fff;
68+ }
69+ .container {
70+ position: relative;
71+ width: 100%;
72+ padding: 6.4em 80px 20px 320px;
73+ }
74+ .container :after {
75+ content: " " ;
76+ display: block ;
77+ clear: both;
78+ }
79+ .it -title {
80+ background-color: #2196F3;
81+ color: #FFF;
82+ font-size: 3em;
83+ padding: 0.4em 80px 0.4em 320px;
84+ position: fixed;
85+ width: 100%;
86+ z-index : 4;
87+ }
88+ .side -bar {
89+ width: 240px;
90+ position: fixed;
91+ min-height: 100%;
92+ padding: 0 20px 20px 20px;
93+ background-color: rgba(100, 181, 246, 0.5 );
94+ z-index : 5;
95+ }
96+ .side -bar > .guest {
97+ margin-top: 20px;
98+ }
99+ .side -bar > .guest > img{
100+ width: 100px;
101+ border-radius: 4px;
102+ float: left;
103+ margin-right: 10px;
104+ }
105+ .side -bar > .guest > h2{
106+ margin-top: 10px;
107+ }
108+ .side -bar > .guest > p{
109+ font-size: 13px;
110+ line-height: 1.5em ;
111+ color: #666;
112+ }
113+ .container > ul {
114+ list-style: none;
115+ }
116+ .container > ul > li {
117+ color: #000;
118+ font-weight: lighter;
119+ margin-bottom: .5em ;
120+ }
121+ .container > ul > li > span {
122+ font-weight: bolder;
123+ color: #999;
124+ }
125+ #content{line-height: 2em; font-size: 14px;letter-spacing:0.1em ;}
126+ #content>h1:first-child{margin:0;}
127+ #content h1,
128+ #content h2,
129+ #content h3,
130+ #content h4,
131+ #content h5,
132+ #content h6,
133+ #content p{margin:.8em 0;}
134+ #content h1{font-size: 2.2em ; line-height: 1.2em ;}
135+ #content h2{font-size: 2em; line-height: 1.2em ;}
136+ #content h3{font-size: 1.8em ; line-height: 1.2em ;}
137+ #content h4{font-size: 1.6em ; line-height: 1.2em ;}
138+ #content h5{font-size: 1.4em ; line-height: 1.2em ;}
139+ #content h6{font-size: 1.2em ; line-height: 1.2em ;}
140+ #content figure{margin: 1em 0;}
141+ #content p img,
142+ #content figure img{max-width: 100%;}
143+ #content figure.half img{max-width: 50%;}
144+ #content figure.half img.margin {max-width: 46%; margin: 2%; box-shadow: 0 5px 15px rgba(0,0,0,.5 );}
145+ #content ul,
146+ #content ol{padding-left:2em;}
147+ #content dl{margin:.5em .8em ;}
148+ #content dl dd{margin-left:2em;}
149+ #content dl dd>ul,
150+ #content dl dd>ol{padding-left:1em;}
151+ #content pre{width:100%; overflow-x:auto; line-height:1.2em ; border-radius: 4px; background:#333;}
152+ #content code{border-radius: 4px; font:normal 85%/1.2em " Inconsolata" , " Monaco" , " Consolas" , " Andale Mono" , " Bitstream Vera Sans Mono" , " Courier New" , Courier, monospace;}
153+ #content :not (pre)>code{margin:auto 1px; padding:1px 2px; border: 1px solid #d7d7d7; background: #eee;}
154+ #content table{border-collapse:collapse;}
155+ #content th,#content td{padding:0 10px; border:1px solid #ccc; font-size:85%;}
156+ #content th{background:#eee; text-align:left;}
157+ #content td{background:#fff;}
158+ #content table a{margin:0;}
159+ #content blockquote{line-height:1.6em ; margin:1em 0 1em 1.5em ; border-left:2px solid #eee; padding-left:1em; font-size:90%;}
160+ @media screen and (max-width: 1023px) {
161+ .container {
162+ position: relative;
163+ width: 100%;
164+ padding: 20px;
165+ }
166+ #content {
167+ font-size: 17px;
168+ }
169+ .it -title {
170+ font-size: 3em;
171+ padding-left: 20px;
172+ padding-right: 20px;
173+ position: relative;
174+ }
175+ .side -bar{
176+ display: none
177+ }
178+ }
179+ </style>
180+ </head>
181+ <body>
182+ <div class= " it-title" >
183+ Freelancer 与 Remoting
184+ </div>
185+ <div class= " side-bar" >
186+ <div class= " logo" >Interview</div>
187+ {% for person in page.interviewee %}
188+ <div class= " guest" >
189+ <img src= " {{person.avatar}}" />
190+ <h2>{{ person.name }}</h2>
191+ <p>{{ person.description }}</p>
192+ </div>
193+ {% endfor %}
194+ </div>
195+ <div id= " content" class= " container" >{{ content }}</div>
196+
197+ <div class= " container" >
198+ <ul>
199+ <li><span>时间</span>:2015年2月7日(周六)下午2点</li>
200+ <li><span>地点:</span>北辰财富中心CD商务公寓16楼(<a href= " http://j.map.baidu.com/n4cwm" target= " blank" >查看地图</a>)</li>
201+ </ul>
202+ <div class= " ds-thread" data-thread-key= " 201501-I" data-title= " freelancer-and-remoting" data-url= " http://yncoder.github.io/event/2015-freelancer-and-remoting/" ></div>
203+ </div>
204+
205+ <script type= " text/javascript" >
206+ var duoshuoQuery = {short_name:" yncoder" };
207+ (function() {
208+ var ds = document.createElement ('script');
209+ ds.type = 'text/javascript';ds.async = true;
210+ ds.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//static.duoshuo.com /embed.js ';
211+ ds.charset = 'UTF-8';
212+ (document.getElementsByTagName ('head')[0]
213+ || document.getElementsByTagName ('body')[0]).appendChild (ds);
214+ })();
215+ </script>
216+ </body>
217+ </html >
0 commit comments