API tools faq
paste
Advertisement
Guest User

Milo Theme

a guest
Nov 24th, 2015
65
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.28 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <head>
  3. <title>{Title}</title>
  4. <meta name="description" content="{MetaDescription}" />
  5. <link rel="shortcut icon" href="{Favicon}">
  6. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  7. <link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700' rel='stylesheet' type='text/css'>
  8.  
  9. <meta name="viewport" content="width=device-width, initial-scale=1">
  10.  
  11. {block:Description}
  12. <meta name="description" content="{MetaDescription}" />
  13. {/block:Description}
  14.  
  15. <!-- TOP MENU -->
  16. <meta name="text:Ask Label" content="Ask">
  17. <meta name="text:Submit Label" content="Submit">
  18. <meta name="text:Archive Label" content="Archive">
  19. <meta name="text:Random Label" content="Random">
  20.  
  21. <!-- MAIN MENU -->
  22. <meta name="text:Link 1 Text" content="Link 1">
  23. <meta name="text:Link 1 URL" content="#">
  24. <meta name="text:Link 2 Text" content="Link 2">
  25. <meta name="text:Link 2 URL" content="#">
  26. <meta name="text:Link 3 Text" content="Link 3">
  27. <meta name="text:Link 3 URL" content="#">
  28. <meta name="text:Link 4 Text" content="Link 4">
  29. <meta name="text:Link 4 URL" content="#">
  30. <meta name="text:Link 5 Text" content="Link 5">
  31. <meta name="text:Link 5 URL" content="#">
  32.  
  33. <!-- SOCIAL LINKS -->
  34. <meta name="text:Facebook" content=""/>
  35. <meta name="text:Twitter" content=""/>
  36. <meta name="text:Instagram" content=""/>
  37. <meta name="text:Pinterest" content=""/>
  38.  
  39. <!-- OTHER TEXTS -->
  40. <meta name="text:Header Quote" content="Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fuga, non!">
  41.  
  42. <!-- COLOURS -->
  43. <meta name="color:Link Color" content="#cc8002">
  44.  
  45. <!-- IMAGES -->
  46. <meta name="image:Header Background" content="http://static.tumblr.com/57185c0b2314c0308b5d2a8d02e4ac99/0x14dld/BbHnmju9j/tumblr_static_axe6oqwbg0oc40k0w8c08o4ok.jpg">
  47. <meta name="image:Avatar" content="http://static.tumblr.com/96bdc71dddb19415b0b216a5d2deb879/0x14dld/B7Onmjunq/tumblr_static_3nruwnqlujms4o4o0k0swow00.png">
  48.  
  49. <style>
  50. /* reset */
  51. * {
  52. text-decoration: none;
  53. list-style: none;
  54. outline: none;
  55. margin: 0;
  56. padding: 0;
  57. }
  58. a, a:hover, a:active, a:focus, a:visited {
  59. text-decoration: none !important;
  60. }
  61.  
  62. /* body */
  63. body {
  64. font-family: "Open Sans", Arial, sans-serif;
  65. font-size: 18px;
  66. background: #f2f2f2;
  67. }
  68.  
  69. /* elements */
  70. .clear {
  71. clear: both;
  72. }
  73.  
  74. /* container */
  75. .container {
  76. width: 1030px;
  77. margin: 0 auto;
  78. }
  79.  
  80. /* top menu */
  81. .top-menu {
  82. text-align: center;
  83. background: #111;
  84. width: 100%;
  85. }
  86. .top-menu ul li {
  87. margin: 0;
  88. display: inline-block;
  89. }
  90. .top-menu ul li a {
  91. font-size: 0.8em;
  92. font-weight: bold;
  93. text-transform: uppercase;
  94. color: #fff;
  95. padding: 20px;
  96. display: inline-block;
  97. transition: all 0.3s ease;
  98. }
  99. .top-menu ul li a:hover {
  100. background: #1a1a1a;
  101. }
  102.  
  103. /* header */
  104. .header {
  105. text-align: center;
  106. color: #fff;
  107. background-image: url({image:Header Background});
  108. background-position: center;
  109. background-repeat: no-repeat;
  110. background-size: cover;
  111. padding: 150px 0 250px;
  112. }
  113. .header .content {
  114. width: 90%;
  115. margin: 0 auto;
  116. }
  117. .header h1 {
  118. font-size: 2.4em;
  119. margin: 0;
  120. text-shadow: 0 2px 3px rgba(0,0,0,0.5);
  121. }
  122. .header h1 a {
  123. font-weight: bold;
  124. text-transform: uppercase;
  125. color: #fff;
  126. }
  127. .header h2 {
  128. font-size: 1.4em;
  129. font-weight: normal;
  130. margin: 10px 0 0 0;
  131. text-shadow: 0 1px 2px rgba(0,0,0,0.5);
  132. }
  133.  
  134. /* main section */
  135. .main-section {
  136. background: #fff;
  137. border-radius: 3px;
  138. margin-top: -100px;
  139. padding: 50px 45px;
  140. display: flex;
  141. box-shadow: 0 2px 3px rgba(0,0,0,0.05),
  142. inset 0 0 0 1px rgba(0,0,0,0.1);
  143. }
  144. .main-section .posts-section {
  145. width: 730px;
  146. padding-right: 45px;
  147. box-sizing: border-box;
  148. flex-shrink: 0;
  149. }
  150. .main-section .sidebar {
  151. flex-grow: 1;
  152. }
  153.  
  154. /* posts */
  155. article {
  156. font-size: 0.9em;
  157. }
  158. article:not(:last-child) {
  159. border-bottom: 1px solid #ddd;
  160. margin-bottom: 45px;
  161. padding-bottom: 40px;
  162. }
  163. article .post-content {
  164. text-align: justify;
  165. color: #333;
  166. }
  167. article .post-content h3 {
  168. font-size: 1.8em;
  169. }
  170. article .post-content h3 a {
  171. color: #333;
  172. transition: all 0.3s ease;
  173. }
  174. article .post-content h3 a:hover {
  175. color: {color:Link Color};
  176. }
  177. article .post-content > *:not(:last-child) {
  178. margin-bottom: 15px;
  179. }
  180. article .post-content img {
  181. width: 100%;
  182. height: auto;
  183. display: block;
  184. }
  185. article .post-content blockquote {
  186. font-size: 1.4em;
  187. padding-left: 25px;
  188. border-left: 3px solid #ddd;
  189. box-sizing: border-box;
  190. }
  191. article .post-content blockquote + p {
  192. margin-left: 28px;
  193. }
  194. article .post-content blockquote + p:before {
  195. content: "–";
  196. margin-right: 5px;
  197. }
  198. article .post-content a {
  199. color: {color:Link Color};
  200. transition: all 0.3s ease;
  201. }
  202. article .post-content a:hover {
  203. opacity: 0.9s;
  204. }
  205.  
  206. /* post footer */
  207. article .post-footer {
  208. margin-top: 40px;
  209. }
  210. article .post-meta {
  211. color: #999;
  212. float: left;
  213. }
  214. article .post-meta a {
  215. color: #999;
  216. transition: all 0.3s ease;
  217. }
  218. article .post-meta a:hover {
  219. color: {color:Link Color};
  220. }
  221. article .post-actions {
  222. float: right;
  223. }
  224. article .post-actions .like_button,
  225. article .post-actions .reblog_button {
  226. display: inline-block !important;
  227. }
  228. article .post-actions .like_button iframe,
  229. article .post-actions .reblog_button svg {
  230. width: 17px !important;
  231. }
  232.  
  233. /* sidebar */
  234. .sidebar {
  235. font-size: 14px;
  236. }
  237. .sb-avatar img {
  238. width: 100%;
  239. margin-bottom: 15px;
  240. }
  241. .sb-description {
  242. line-height: 25px;
  243. text-align: center;
  244. color: #333;
  245. }
  246. .sb-social {
  247. text-align: center;
  248. margin: 30px 0;
  249. }
  250. .sb-social a {
  251. transition: all 0.3s ease;
  252. }
  253. .sb-social a:hover {
  254. opacity: 0.9;
  255. }
  256. .sb-main-menu {
  257. text-align: center;
  258. box-sizing: border-box;
  259. }
  260. .sb-main-menu ul li {
  261. border-bottom: 1px solid #ddd;
  262. }
  263. .sb-main-menu ul li:first-child {
  264. border-top: 1px solid #ddd;
  265. }
  266. .sb-main-menu ul li a {
  267. color: #333;
  268. padding: 7px 0 5px;
  269. display: block;
  270. transition: all 1s ease;
  271. }
  272. .sb-main-menu ul li a:hover {
  273. color: {color:Link Color};
  274. background: #fefefe;
  275. transition: all 0.3s ease;
  276. }
  277.  
  278. /* footer */
  279. .footer {
  280. font-size: 14px;
  281. text-align: center;
  282. padding: 54px 0 50px;
  283. }
  284. .footer a {
  285. color: #333;
  286. transition: all 0.3s ease;
  287. }
  288. .footer a.prev {
  289. border: 2px solid #ddd;
  290. border-radius: 5px;
  291. padding: 5px 10px;
  292. float: left;
  293. }
  294. .footer a.next {
  295. border: 2px solid #ddd;
  296. border-radius: 5px;
  297. padding: 5px 10px;
  298. float: right;
  299. }
  300. .footer a.prev:hover,
  301. .footer a.next:hover {
  302. border-color: #aaa;
  303. }
  304. .footer .copyright {
  305. color: #777;
  306. padding: 5px 0;
  307. }
  308. .footer .copyright a:hover {
  309. color: {color:Link Color};
  310. }
  311.  
  312. /* notes */
  313. ol.notes {
  314. margin-top: 30px;
  315. }
  316. ol.notes li {
  317. font-size: 14px;
  318. text-align: justify;
  319. padding: 10px;
  320. }
  321. ol.notes li:nth-child(odd) {
  322. background: #F0F0F0;
  323. }
  324. ol.notes li a {
  325. color: {color:Link Color};
  326. }
  327. ol.notes li img.avatar {
  328. position: relative;
  329. margin-right: 10px;
  330. top: 2px;
  331. }
  332. </style>
  333.  
  334. <style type="text/css">{CustomCSS}</style>
  335. </head>
  336. <body>
  337.  
  338. <div class="top-menu"><div class="container">
  339. <ul>
  340. {block:AskEnabled}
  341. <li><a href="/ask">{text:Ask label}</a>
  342. {/block:AskEnabled}
  343. {block:SubmissionsEnabled}
  344. <li><a href="/submit">{text:Submit label}</a>
  345. {/block:SubmissionsEnabled}
  346. <li><a href="/archive">{text:Archive label}</a>
  347. <li><a href="/random">{text:Random label}</a>
  348. </ul>
  349. </div></div><!-- top menu -->
  350.  
  351. <div class="header"><div class="container">
  352. <div class="content">
  353. <h1><a href="http://{Host}">{Title}</a></h1>
  354. <h2>{text:Header Quote}</h2>
  355. </div><!-- content -->
  356. </div></div><!-- header -->
  357.  
  358. <div class="container">
  359. <div class="main-section">
  360. <section class="posts-section">
  361.  
  362. {block:Posts}
  363.  
  364. <!-- hide source -->
  365. {block:ContentSource}
  366. <!-- {SourceURL}
  367. {block:SourceLogo}
  368. <img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  369. {/block:SourceLogo}
  370. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  371. {/block:ContentSource}
  372.  
  373. <!-- hide via -->
  374. <!-- {block:NoRebloggedFrom}
  375. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  376. {/block:NoRebloggedFrom} -->
  377.  
  378. <article class="single-post">
  379.  
  380. {block:Text}
  381. <div class="post-content">
  382. {block:Title}<h3><a href="{Permalink}">{Title}</a></h3>{/block:Title}
  383. {Body}
  384. </div>
  385. {/block:Text}
  386.  
  387. {block:Photo}
  388. <div class="post-content">
  389. {LinkOpenTag}
  390. <img class="photo" src="{PhotoWidth-1280}" class="highres" alt="{PhotoAlt}">
  391. {LinkCloseTag}
  392. {block:Caption}<p>{Caption}</p>{/block:Caption}
  393. </div>
  394. {/block:Photo}
  395.  
  396. {block:Photoset}
  397. <div class="post-content">
  398. {block:Photos}
  399. <img class="photo" src="{PhotoURL-1280}" alt="{PhotoAlt}" {block:HighRes}style="display:none"{/block:HighRes} />
  400. {block:HighRes}<img class="photo" src="{PhotoURL-HighRes}" class="highres" alt="{PhotoAlt}">{/block:HighRes}
  401. {/block:Photos}
  402. {block:Caption}<p class="caption">{Caption}</p>{/block:Caption}
  403. </div>
  404. {/block:Photoset}
  405.  
  406. {block:Quote}
  407. <div class="post-content">
  408. <blockquote class="quote {Length}">{Quote}</blockquote>
  409. <p>{block:Source}{Source}{/block:Source}</p>
  410. </div>
  411. {/block:Quote}
  412.  
  413. {block:Link}
  414. <div class="post-content">
  415. <p><a href="{URL}" {Target}>{Name}</a></p>
  416. {block:Description}{Description}{/block:Description}
  417. </div>
  418. {/block:Link}
  419.  
  420. {block:Chat}
  421. <div class="post-content">
  422. {block:Title}<h3>{Title}</h3>{/block:Title}
  423. <div class="chat">
  424. {block:Lines}
  425. <div class="line {Alt}">{block:Label}<strong>{Label}</strong>{/block:Label} {Line}</div>
  426. {/block:Lines}
  427. </div>
  428. </div>
  429. {/block:Chat}
  430.  
  431. {block:Video}
  432. <div class="post-content">
  433. <div class="video-container">{Video-500}</div>
  434. {block:Caption}<p>{Caption}</p>{/block:Caption}
  435. </div>
  436. {/block:Video}
  437.  
  438. {block:Audio}
  439. <div class="post-content">
  440. {block:AlbumArt}
  441. <img src="{AlbumArtURL}" alt="{block:Artist}{Artist}{/block:Artist}{block:TrackName} - {TrackName}{/block:TrackName}" />
  442. {/block:AlbumArt}
  443.  
  444. {AudioEmbed}
  445.  
  446. {block:ExternalAudio}
  447. <div class="meta">
  448. <span class="download_external_audio"><a href="{ExternalAudioURL}">{lang:Download}</a></span>
  449. </div>
  450. {/block:ExternalAudio}
  451. {block:Caption}
  452. <p>{Caption}</p>
  453. {/block:Caption}
  454. </div>
  455. {/block:Audio}
  456.  
  457. {block:Answer}
  458. <div class="post-content">
  459. <div class="chat">
  460. <div class="line odd"><strong>{Asker}</strong> {Question}</div>
  461. <div class="line even">{Answer}</div>
  462. </div>
  463. </div>
  464. {/block:Answer}
  465.  
  466. <div class="post-footer">
  467. <div class="post-meta">
  468. <p>
  469. {block:Date}{Timeago}{/block:Date} /
  470. {block:NoteCount}
  471. <a href="{Permalink}">{NoteCountWithLabel}</a>
  472. {/block:NoteCount}
  473. </p>
  474. </div>
  475. <div class="post-actions">
  476. {ReblogButton}
  477. {LikeButton}
  478. </div>
  479. </div>
  480.  
  481. <div class="clear"></div>
  482.  
  483. {block:PostNotes}<p>{PostNotes}</p>{/block:PostNotes}
  484.  
  485. </article><!-- .single-post -->
  486. {/block:Posts}
  487.  
  488. </section><!-- posts section -->
  489. <aside class="sidebar">
  490. <div class="sb-avatar">
  491. <a href="/"><img src="{image:Avatar}"></a>
  492. </div><!-- sidebar avatar -->
  493. <div class="sb-description">
  494. {block:Description}
  495. <p>{Description}</p>
  496. {/block:Description}
  497. </div><!-- sidebar description -->
  498. <div class="sb-social">
  499. {block:IfFacebook}
  500. <a href="https://www.facebook.com/{text:Facebook}" title="Facebook" target="_blank"><img src="http://static.tumblr.com/0x14dld/Q18nmjzgo/facebook.png"></a>
  501. {/block:IfFacebook}
  502. {block:IfTwitter}
  503. <a href="https://www.twitter.com/{text:Twitter}" title="Twitter" target="_blank"><img src="http://static.tumblr.com/0x14dld/RGanmjzi5/twitter.png"></a>
  504. {/block:IfTwitter}
  505. {block:IfInstagram}
  506. <a href="https://www.instagram.com/{text:Instagram}" title="Instagram" target="_blank"><img src="http://static.tumblr.com/0x14dld/iPInmjzj5/instagram.png"></a>
  507. {/block:IfInstagram}
  508. {block:IfPinterest}
  509. <a href="https://www.pinterest.com/{text:Pinterest}" title="Pinterest" target="_blank"><img src="http://static.tumblr.com/0x14dld/SBvnmjzk0/pinterest.png"></a>
  510. {/block:IfPinterest}
  511. </div><!-- sidebar social icons -->
  512. <div class="sb-main-menu"><ul>
  513. <li><a href="{text:Link 1 URL}">{text:Link 1 Text}</a></li>
  514. <li><a href="{text:Link 2 URL}">{text:Link 2 Text}</a></li>
  515. <li><a href="{text:Link 3 URL}">{text:Link 3 Text}</a></li>
  516. <li><a href="{text:Link 4 URL}">{text:Link 4 Text}</a></li>
  517. <li><a href="{text:Link 5 URL}">{text:Link 5 Text}</a></li>
  518. </ul></div><!-- main navigation -->
  519. </aside><!-- sidebar -->
  520. </div><!-- main section -->
  521. <div class="footer">
  522. {block:Pagination}
  523. <div class="load-more-posts">
  524. {block:PreviousPage}<a class="prev" href="{PreviousPage}">&larr; {lang:Previous}</a>{/block:PreviousPage}
  525. {block:NextPage}<a class="next" href="{NextPage}">{lang:Next} &rarr;</a>{/block:NextPage}
  526. </div>
  527. {/block:Pagination}
  528. <div class="copyright">Lovingly designed and developed by <a href="http://www.instagram.com/t75.sam" target="_blank">Samuel Black</a>.</div>
  529. </div><!-- footer -->
  530. </div><!-- container -->
  531. </body>
  532. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!