API tools faq
paste
Advertisement
neothm

#18 RAILS

neothm
Nov 24th, 2016
3,734
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 30.97 KB | None | 0 0
raw download clone embed print report
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <title>{block:PostTitle}{PostTitle} | {/block:PostTitle}{Title}</title>
  5. <meta name="description" content="{MetaDescription}">
  6. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  7. <meta name="author" content="neothm">
  8. <link rel="stylesheet" href="http://static.tumblr.com/wgg6svp/vvXoh5c0y/ionicons.min.css">
  9. <link href='https://fonts.googleapis.com/css?family={text:GoogleFont}:400,400italic,700,700italic|{text:GoogleFontTitle}:500,700' rel='stylesheet' type='text/css'>
  10. <link rel="shortcut icon" href="{Favicon}">
  11. <meta name="text:GoogleFont" content="PT Serif">
  12. <meta name="text:GoogleFontTitle" content="Amiri">
  13. <meta name="text:CaptionWordBreak" content="100">
  14. <meta name="color:Text" content="#5b5b5b">
  15. <meta name="color:Links" content="#aaa">
  16. <meta name="color:LinksHover" content="#000">
  17. <meta name="color:Borders" content="#f0f0f0">
  18. <meta name="color:Background" content="#fff">
  19. <meta name="select:NextPage" content="pagi" title="Pagination">
  20. <meta name="select:NextPage" content="ldmr" title="Load button">
  21. <meta name="select:NextPage" content="ifnt" title="Infinite Scroll">
  22. <meta name="select:FontSize" content="9px">
  23. <meta name="select:FontSize" content="10px">
  24. <meta name="select:FontSize" content="11px">
  25. <meta name="select:FontSize" content="12px">
  26. <meta name="select:FontSize" content="13px">
  27. <meta name="select:FontSize" content="14px">
  28. <meta name="select:FontSize" content="15px">
  29. <meta name="select:FontSize" content="16px">
  30. <meta name="select:MediaSize" content="30%">
  31. <meta name="select:MediaSize" content="40%">
  32. <meta name="select:MediaSize" content="50%">
  33. <meta name="text:PermalinkPostSize" content="600px">
  34. <meta name="if:SquareMedia" content="0">
  35. <meta name="if:DarkTheme" content="0">
  36. <meta name="if:SocialNetworks" content="1">
  37. <meta name="text:TwitterLink" content="///">
  38. <meta name="text:FacebookLink" content="///">
  39. <meta name="text:InstagramLink" content="///">
  40. <meta name="text:YoutubeLink" content="///">
  41. <meta name="if:Link1" content="1">
  42. <meta name="if:Link2" content="1">
  43. <meta name="if:Link3" content="1">
  44. <meta name="if:Link4" content="1">
  45. <meta name="if:Link5" content="1">
  46. <meta name="text:Link1URL" content="http://">
  47. <meta name="text:Link1Label" content="">
  48. <meta name="text:Link2URL" content="http://">
  49. <meta name="text:Link2Label" content="">
  50. <meta name="text:Link3URL" content="http://">
  51. <meta name="text:Link3Label" content="">
  52. <meta name="text:Link4URL" content="http://">
  53. <meta name="text:Link4Label" content="">
  54. <meta name="text:Link5URL" content="http://">
  55. <meta name="text:Link5Label" content="">
  56.  
  57. <style type="text/css">
  58. /* general */
  59. *{
  60. margin:0;
  61. padding:0;
  62. }
  63. html, body{
  64. height:100%;
  65. }
  66. body, small, input, pre, big, textarea{
  67. color:{color:Text};
  68. font:400 {select:FontSize}/1.2 {text:GoogleFont}, sans-serif;
  69. }
  70. body{
  71. background-color:{color:Background};
  72. padding-top:1px;
  73. margin-top:-1px;
  74. -webkit-font-smoothing: antialiased;
  75. -moz-osx-font-smoothing: grayscale;
  76. }
  77. #noscroll{
  78. overflow-x:hidden;
  79. }
  80. a{
  81. color:{color:Links};
  82. text-decoration:none;
  83. }
  84. a:hover{
  85. color:{color:LinksHover};
  86. cursor:pointer!important;
  87. }
  88. ::selection{
  89. background-color:#000;
  90. color:#fff;
  91. }
  92. ::-moz-selection{
  93. background-color:#000;
  94. color:#fff;
  95. }
  96. ::-webkit-scrollbar{
  97. width:11px;
  98. height:11px;
  99. background-color:{color:Background};
  100. }
  101. ::-webkit-scrollbar-track{
  102. border:5px solid {color:Background};
  103. background-color:{color:Background};
  104. }
  105. ::-webkit-scrollbar-thumb{
  106. border:5px solid {color:Background};
  107. background-color: {color:Text};
  108. }
  109. .tmblr-iframe.iframe-controls--desktop,
  110. #tumblr_controls{
  111. right: 0px!important;
  112. {block:IndexPage}
  113. top: 105px!important;
  114. position:absolute!important;
  115. {/block:IndexPage}
  116. {block:PermalinkPage}
  117. position:fixed!important;
  118. top:30px!important;
  119. {/block:PermalinkPage}
  120. transform:scale(.7);
  121. -webkit-transform:scale(.7);
  122. -moz-transform:scale(.7);
  123. z-index:9999!important;
  124. {block:IfNotDarkTheme}
  125. filter:invert(100%);
  126. -webkit-filter:invert(100%);
  127. -moz-filter:invert(100%);
  128. -ms-filter:invert(100%);
  129. -o-filter:invert(100%);
  130. {/block:IfNotDarkTheme}
  131. }
  132. #s-m-t-tooltip{
  133. z-index:9999;
  134. margin:15px;
  135. padding:5px 15px;
  136. border-radius:4px;
  137. background:rgba(0,0,0,.7);
  138. color:#fff;
  139. text-align:center;
  140. text-transform:uppercase;
  141. max-width:120px;
  142. font:10px/1.5 serif;
  143. letter-spacing:1px;
  144. }
  145. .tmblr-lightbox{
  146. {block:IfNotDarkTheme}background-color: rgba(240,240,240,.9)!important;{/block:IfNotDarkTheme}
  147. {block:IfDarkTheme}background-color: rgba(0,0,0,.9)!important;{/block:IfDarkTheme}
  148. }
  149. .tmblr-lightbox .vignette{
  150. background-image:none!important;
  151. }
  152. .tmblr-lightbox .lightbox-image {
  153. box-shadow:none!important;
  154. {block:IfNotDarkTheme}outline: 20px solid #fff;{/block:IfNotDarkTheme}
  155. {block:IfDarkTheme}outline: 20px solid #222;{/block:IfDarkTheme}
  156. }
  157. /*
  158. TRANSITIONS
  159. */
  160. .topbar.fixed, .tmblr-iframe.iframe-controls--desktop.fixed, #tumblr_controls.fixed, .topbar.fixed + section, .topbar + section, .topbar, .tmblr-iframe.iframe-controls--desktop, #tumblr_controls,
  161. .menu, .menu.showing,
  162. a, a:hover, .menu li > a:before, .menu li > a:hover:before{
  163. transition-duration:.3s;
  164. -webkit-transition-duration:.3s;
  165. -moz-transition-duration:.3s;
  166. -ms-transition-duration:.3s;
  167. -o-transition-duration:.3s;
  168. }
  169. /* nav */
  170. .topbar{
  171. position:fixed;
  172. line-height:40px;
  173. background-color:{color:Background};
  174. top:0px;
  175. left:0px;
  176. box-sizing:border-box;
  177. padding:100px 50px;
  178. width:100%;
  179. border-bottom:1px solid {color:Borders};
  180. z-index:999;
  181. }
  182. .chat, .menu ul, .topbar ol{
  183. list-style:none;
  184. }
  185. .isAnswer .media,
  186. #smbt{
  187. display:none;
  188. }
  189. {block:PermalinkPage}.isAudio .media, .audInfo,{/block:PermalinkPage}
  190. #search,
  191. #smbt + label,
  192. #query, .topbar ol, nav h1{
  193. display:inline-block;
  194. vertical-align:middle;
  195. }
  196. #query{
  197. outline:none;
  198. border:none;
  199. background:transparent;
  200. margin-right:20px;
  201. width:100px;
  202. line-height: 2;
  203. vertical-align:-1px;
  204. }
  205. #query:focus{
  206. border-bottom:1px solid {color:Borders};
  207. }
  208. #smbt + label{
  209. font-size:15px;
  210. }
  211. .topbar h1{
  212. max-width:40%;
  213. margin-right:50px;
  214. font:bold 25px/1.2 {text:GoogleFontTitle}, Arial;
  215. }
  216. .topbar ol li{
  217. display:inline-block;
  218. counter-increment:links;
  219. margin-right:20px;
  220. }
  221. .topbar ol li:before{
  222. content:"0"counter(links)".";
  223. display:inline-block;
  224. margin-right:5px;
  225. font-weight:bold;
  226. }
  227. .topbar ol li a,
  228. .topbar ol li form{
  229. display:inline-block;
  230. }
  231. .menu{
  232. position:fixed;
  233. top:0px;
  234. width:100%;
  235. height:100%;
  236. background-color:{color:Background};
  237. z-index:99999;
  238. box-sizing:border-box;
  239. padding:100px;
  240.  
  241. left:-100%;
  242. }
  243. .menu.showing{
  244. left:0px;
  245. }
  246. .menu ul{
  247. position:relative;
  248. }
  249. #close{
  250. z-index:99999;
  251. position:absolute;
  252. color:{color:Text};
  253. top:-50px;
  254. left:-50px;
  255. font-size:30px;
  256. }
  257. .menu li{
  258. font: 50px/2 {text:GoogleFontTitle}, Arial;
  259. }
  260. .menu li a{
  261. display:block;
  262. padding-left:50px;
  263. position:relative;
  264. }
  265. .menu li a:before{
  266. content:"";
  267. position:absolute;
  268. width:30px;
  269. left:0px;
  270. top:50%;
  271. transform:translateY(-50%);
  272. height:2px;
  273. background:{color:Borders};
  274. }
  275. .menu li a:hover{
  276. font-style:italic;
  277. padding-left:150px;
  278. }
  279. .menu li a:hover:before{
  280. width:100px;
  281. }
  282. {block:IfSocialNetworks}
  283. .sns{
  284. position:absolute;
  285. bottom:100px;
  286. left:100px;
  287. font-size:40px;
  288. }
  289. .sns a{
  290. margin-right:20px;
  291. display:inline-block;
  292. }
  293. {/block:IfSocialNetworks}
  294. .topbar.fixed{
  295. padding-top:25px;
  296. padding-bottom:25px;
  297. }
  298. .tmblr-iframe.iframe-controls--desktop.fixed,
  299. #tumblr_controls.fixed{
  300. position:fixed!important;
  301. top:30px!important;
  302. }
  303. /* footer */
  304. #infscr-loading,
  305. .pagi #loadmore,
  306. .ldmr #pagination,
  307. .ifnt{
  308. display:none!important;
  309. }
  310. footer{
  311. margin:50px 0;
  312. }
  313.  
  314. #loadmore{
  315. padding:10px 20px;
  316. line-height:1;
  317. display:table;
  318. text-transform:uppercase;
  319. border:1px solid {color:Borders};
  320. margin:0 auto;
  321. }
  322. #pagination{
  323. text-align:center;
  324. }
  325. #pagination a{
  326. margin:0 10px;
  327. }
  328. /*posts and shits*/
  329. {block:IndexPage}
  330. section{
  331. margin-top:250px;
  332. }
  333. {/block:IndexPage}
  334. .topbar.fixed + section{
  335. {block:IndexPage}
  336. margin-top:180px;
  337. {/block:IndexPage}
  338. {block:PermalinkPage}
  339. margin-top:90px;
  340. {/block:PermalinkPage}
  341. }
  342. article{
  343. width:100%;
  344. box-sizing:border-box;
  345. {block:IndexPage}
  346. padding:100px 50px;
  347. border-bottom:1px solid {color:Borders};
  348. display:table;
  349. table-layout:fixed;
  350. {/block:IndexPage}
  351. position:relative;
  352. font-size:0px;
  353. }
  354. {block:PermalinkPage}
  355. .isMedia{
  356. padding:50px 100px 50px;
  357. padding-left:calc(50% + 100px);
  358. }
  359. article:not(.isMedia){
  360. width:{text:PermalinkPostSize};
  361. margin:150px auto 80px;
  362. }
  363. {/block:PermalinkPage}
  364.  
  365. h3.title, .chat, .media, .caption, .qa, .audInfo, .parents, .meta{
  366. font-size:{select:FontSize};
  367. {block:IndexPage}
  368. display:table-cell;
  369. vertical-align:middle;
  370. {/block:IndexPage}
  371. }
  372. .media{
  373. {block:IndexPage}
  374. width:{select:MediaSize};
  375. {/block:IndexPage}
  376. }
  377. {block:PermalinkPage}
  378. .isMedia .media{
  379. width:50%;
  380. position:fixed;
  381. top:90px;
  382. left:0%;
  383. height: calc(100vh - 90px);
  384. display: block;
  385. }
  386. {/block:PermalinkPage}
  387. {block:PermalinkPage}
  388. .isMedia .media:after{
  389. content:"";
  390. width:1px;
  391. height:200px;
  392. top:50%;
  393. right:-47px;
  394. display:block;
  395. position:absolute;
  396. background:{color:Borders};
  397. transform:translateY(-50%);
  398. }
  399. {/block:PermalinkPage}
  400. .mediaCont{
  401. display:block;
  402. width:100%;
  403. position:relative;
  404. {block:PermalinkPage}
  405. height:100%;
  406. {/block:PermalinkPage}
  407.  
  408. {block:IfSquareMedia}
  409. {block:IndexPage}
  410. overflow:hidden;
  411. }
  412. .mediaCont:after{
  413. content:"";
  414. display:block;
  415. padding-bottom:100%;
  416. {/block:IndexPage}
  417. {/block:IfSquareMedia}
  418. }
  419. .media .pictures{
  420. display:block;
  421. width:100%;
  422.  
  423. {block:PermalinkPage}
  424. height:100%;
  425. position:absolute;
  426. top:0px;
  427. left:0px;
  428. object-fit:cover;
  429. {/block:PermalinkPage}
  430. {block:IfSquareMedia}
  431. {block:IndexPage}
  432. height:100%;
  433. position:absolute;
  434. top:0px;
  435. left:0px;
  436. object-fit:cover;
  437. {/block:IndexPage}
  438. {/block:IfSquareMedia}
  439. }
  440. {block:PermalinkPage}
  441. .qa{
  442. margin-bottom:10px;
  443. }
  444. .caption, .audInfo, .tags{
  445. margin-bottom:30px;
  446. }
  447. {/block:PermalinkPage}
  448. .caption, .parents, .meta, .chat, .audInfo{
  449. {block:IndexPage}
  450. padding-left:50px;
  451. }
  452. article:not(.isAnswer) .media + div{
  453. padding-left:100px!important;
  454. {/block:IndexPage}
  455. }
  456. .qa .tumblr_parent.asker{
  457. margin-bottom:15px;
  458. }
  459. .qa .tumblr_parent.asker .tumblr_blog{
  460. font-weight:normal;
  461. }
  462. .qa .tumblr_parent.asker .tumblr_blog span{
  463. display:inline-block;
  464. -moz-transform: scaleX(-1);
  465. -o-transform: scaleX(-1);
  466. -webkit-transform: scaleX(-1);
  467. transform: scaleX(-1);
  468. margin-right:5px;
  469. }
  470.  
  471. .caption img{
  472. display:block;
  473. max-width:100%;
  474. height:auto;
  475. }
  476.  
  477. .tumblr_parent:not(:last-child){
  478. margin-bottom:25px;
  479. }
  480. .isText .tumblr_parent blockquote{
  481. padding:20px;
  482. display:block;
  483. border:1px solid {block:IfNotDarkTheme}#eee{/block:IfNotDarkTheme}{block:IfDarkTheme}{color:Borders}{/block:IfDarkTheme};
  484. background-color:{block:IfNotDarkTheme}#f6f6f6{/block:IfNotDarkTheme}{block:IfDarkTheme}#222{/block:IfDarkTheme};
  485. }
  486. hr{
  487. border-color:{color:Borders};
  488. }
  489. .tumblr_parent ul,
  490. .tumblr_parent ol{
  491. padding-left:20px;
  492. }
  493. .tumblr_parent > .tumblr_blog{
  494. margin-right:5px;
  495. }
  496. .tumblr_parent > .tumblr_blog + *,
  497. .tumblr_parent > .tumblr_blog + * > *{
  498. display:inline;
  499. }
  500. .tumblr_parent > :not(:first-child){
  501. margin-top:10px;
  502. }
  503. .parents a{
  504. display:block;
  505. word-break: break-all;
  506. margin:5px 0;
  507. line-height:1.2;
  508. }
  509. .parents a i{
  510. margin-left:10px;
  511. color:{color:Text};
  512. }
  513. .meta time{
  514. display:block;
  515. margin-bottom:5px;
  516. }
  517. .meta time a{
  518. margin-right:10px;
  519. }
  520. .rblg, .likeBtn{
  521. display:inline-block;
  522. vertical-align:middle;
  523. color:{color:Text};
  524. }
  525. .likeBtn{
  526. position:relative;
  527. overflow:hidden;
  528. margin-right:10px;
  529. }
  530. .like_button{
  531. position:absolute;
  532. }
  533. .like_button.liked + span{
  534. color:red;
  535. }
  536. .like_button iframe{
  537. opacity:0;
  538. display:block;
  539. transform: scale(6) translateX(40%);
  540. }
  541. .rblg span, .likeBtn span{
  542. margin-right:5px;
  543. font-size: 12px;
  544. vertical-align: -1px;
  545. }
  546. .likeBtn:hover{
  547. color:{color:LinksHover};
  548. cursor:pointer!important;
  549. }
  550. {block:PermalinkPage}
  551. .metaHolder{
  552. display:table;
  553. table-layout:fixed;
  554. width:100%;
  555. padding:10px 0;
  556. margin:20px 0 10px;
  557. border-top: 1px solid {color:Borders};
  558. border-bottom: 1px solid {color:Borders};
  559. }
  560. .meta, .parents {
  561. /* background-color: white; */
  562. display: table-cell;
  563. text-align: center;
  564. vertical-align: middle;
  565. }
  566. {/block:PermalinkPage}
  567. /*posts types*/
  568. {block:IndexPage}
  569. .isAudio .media{
  570. width:20%;
  571. }
  572. .isAudio .audInfo{
  573. width:30%;
  574. }
  575. {/block:IndexPage}
  576. {block:PermalinkPage}
  577. .isAudio .media{
  578. width:150px;
  579. height:150px;
  580. position:relative;
  581. overflow:hidden;
  582. margin-right:50px;
  583. }
  584. .isAudio .media img{
  585. display:block;
  586. width:100%;
  587. }
  588. .isAudio .media .audio_player{
  589. position:absolute;
  590. top:50%;
  591. left:50%;
  592. transform:translate(-50%, -50%);
  593. overflow:hidden;
  594. width:40px;
  595. height:40px;
  596. }
  597. .isAudio .media iframe{
  598. width:40px;
  599. height:40px;
  600. overflow:hidden;
  601. }
  602. .isAudio .media img{
  603. display:block;
  604. }
  605. .audInfo{
  606. width:calc(100% - 200px);
  607. margin-bottom:0px!important;
  608. }
  609. .audInfo p:not(:last-child){
  610. margin-bottom:10px;
  611. }
  612. .audInfo + div{
  613. margin-top:30px!important;
  614. }
  615. {/block:PermalinkPage}
  616. .isAudio .audInfo b{
  617. font-size:30px;
  618. line-height:1;
  619. display:block;
  620. margin-bottom:10px;
  621. }
  622. .isAudio .audInfo span {
  623. display: inline-block;
  624. margin-right: 10px;
  625. color:{color:Links};
  626. vertical-align: -1px;
  627. font-size: 12px;
  628. }
  629. .isText .media{
  630. display:none;
  631. }
  632. .chat,
  633. .isText .caption{
  634. {block:IndexPage}width:45%;{/block:IndexPage}
  635. line-height:1.7;
  636. }
  637. .isAnswer .caption, .isAnswer .qa{
  638. line-height:1.7;
  639. }
  640. .chat label{
  641. font-weight:bold;
  642. }
  643. .chat li:not(:last-of-type){
  644. margin-bottom:10px;
  645. }
  646. .chat li:nth-child(even){
  647. background-color:{block:IfNotDarkTheme}#f6f6f6{/block:IfNotDarkTheme}{block:IfDarkTheme}#222{/block:IfDarkTheme};
  648. }
  649. .chat li{
  650. padding:10px 15px;
  651. }
  652. h3.title{
  653. font:bold 40px/1.2 {text:GoogleFontTitle}, Arial;
  654. {block:IndexPage}width:25%;{/block:IndexPage}
  655. {block:PermalinkPage}margin-bottom:30px;{/block:PermalinkPage}
  656. }
  657. {block:IndexPage}
  658. h3.title.isQuote,
  659. h3.title.isLink{
  660. width:35%;
  661. }
  662. h3.title.isQuote + .caption,
  663. h3.title.isLink + .caption{
  664. width:25%;
  665. }
  666. {/block:IndexPage}
  667. .tags{
  668. font-size:{select:FontSize};
  669. line-height:1.7;
  670. }
  671. .tags a,
  672. .tags b{
  673. margin-right:10px;
  674. }
  675. ol.notes{
  676. font-size: 0;
  677. margin:0;
  678. text-align: center;
  679. }
  680. li.note {
  681. list-style: none;
  682. display: inline-block;
  683. margin: 10px;
  684. }
  685. img.avatar{
  686. width: 30px;
  687. border-radius: 3px;
  688. }.note.more_notes_link_container{
  689. text-align: center;
  690. display: block;
  691. padding-bottom: 30px;
  692. }
  693. .more_notes_link{
  694. display: inline-block;
  695. width:30px;
  696. height:30px;
  697. background: #fff url('http://static.tumblr.com/wgg6svp/vGzo7wew4/loadmore.png') top center no-repeat;
  698. {block:IfDarkTheme}
  699. -moz-filter: invert(100%);
  700. -webkit-filter: invert(100%);
  701. filter: invert(100%);
  702. {/block:IfDarkTheme}
  703. background-size: 20px 20px;
  704. }
  705. .more_notes_link:hover{
  706. transform:rotate(30deg);
  707. }
  708.  
  709. </style>
  710. </head>
  711. <body id="noscroll">
  712. <nav class="menu">
  713. <ul>
  714. <a id="close" class="ion-close"></a>
  715. {block:IfLink1}
  716. <li>
  717. <a href="{text:Link1URL}">{text:Link1Label}</a>
  718. </li>
  719. {/block:IfLink1}
  720. {block:IfLink2}
  721. <li>
  722. <a href="{text:Link2URL}">{text:Link2Label}</a>
  723. </li>
  724. {/block:IfLink2}
  725. {block:IfLink3}
  726. <li>
  727. <a href="{text:Link3URL}">{text:Link3Label}</a>
  728. </li>
  729. {/block:IfLink3}
  730. {block:IfLink4}
  731. <li>
  732. <a href="{text:Link4URL}">{text:Link4Label}</a>
  733. </li>
  734. {/block:IfLink4}
  735. {block:IfLink5}
  736. <li>
  737. <a href="{text:Link5URL}">{text:Link5Label}</a>
  738. </li>
  739. {/block:IfLink5}
  740. {block:IfSocialNetworks}
  741. <div class="sns">
  742. <!--
  743. [!!!] SOCIAL NETWORKS
  744. -->
  745. <a href="{text:TwitterLink}" target="_blank" class="ion-social-twitter"></a>
  746. <a href="{text:FacebookLink}" target="_blank" class="ion-social-facebook"></a>
  747. <a href="{text:InstagramLink}" target="_blank" class="ion-social-instagram"></a>
  748. <a href="{text:YoutubeLink}" target="_blank" class="ion-social-youtube"></a>
  749. </div>
  750. {/block:IfSocialNetworks}
  751. </ul>
  752. </nav>
  753. <nav class="topbar{block:PermalinkPage} fixed{/block:PermalinkPage}">
  754. <h1>{Title}</h1>
  755. <ol>
  756. <li>
  757. <a href="/">
  758. Home
  759. </a>
  760. </li>
  761. <li>
  762. <a href="/ask">
  763. Contact
  764. </a>
  765. </li>
  766. <li>
  767. <a href="#" id="linkMenu">
  768. Links
  769. </a>
  770. </li>
  771. <li>
  772. <form action="/search" method="get" id="search">
  773. <input type="text" name="q" value="{SearchQuery}" id="query" placeholder="Search"/>
  774. <input type="submit" value="Search" id="smbt"/>
  775. <label for="smbt" class="ion-ios-search"></label>
  776. </form>
  777. </li>
  778. </ol>
  779. </nav>
  780. <section>
  781. {block:Posts}
  782. <article id="{PostID}" class="{block:Photo}isMedia{/block:Photo}{block:Photoset}isMedia{/block:Photoset}{block:Video}isMedia{/block:Video}{block:Text}isText{/block:Text}{block:Link}isText{/block:Link}{block:Chat}isText{/block:Chat}{block:Quote}isText{/block:Quote}{block:Audio}isAudio{/block:Audio}{block:Answer}isAnswer{/block:Answer}{block:RebloggedFrom} isReblog{/block:RebloggedFrom}">
  783.  
  784. {block:Answer}
  785. <div class="qa">
  786. <blockquote class="tumblr_parent asker">
  787. <b class="tumblr_blog">
  788. <span class="ion-ios-chatbubble-outline"></span>
  789. {Asker}:
  790. </b>
  791. <p>{Question}</p>
  792. </blockquote>
  793. </div>
  794. {/block:Answer}
  795. <div class="media">
  796. {block:Photo}
  797. <a onclick="Tumblr.Lightbox.init([/*, /**/ { width: {PhotoWidth-500}, height: {PhotoHeight-500}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' } ]); $('body').toggleClass('tumblr_lightbox_active'); return false" class="mediaCont">
  798. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" draggable="false" class="pictures">
  799. </a>
  800. {/block:Photo}
  801. {block:Photoset}
  802. <a onclick="Tumblr.Lightbox.init([/*{block:Photos}, /**/ { width: {PhotoWidth-500}, height: {PhotoHeight-500}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }{/block:Photos}]); $('body').toggleClass('tumblr_lightbox_active'); return false" class="mediaCont{block:PermalinkPage} slideshow{/block:PermalinkPage}">
  803. {block:IndexPage}
  804. {block:Photos}
  805. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" draggable="false" class="pictures"><!--
  806. {/block:Photos}
  807. -->
  808. {/block:IndexPage}
  809. {block:PermalinkPage}
  810. {block:Photos}
  811. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" draggable="false" class="pictures">
  812. {/block:Photos}
  813. {/block:PermalinkPage}
  814. </a>
  815. {/block:Photoset}
  816. {block:Video}
  817. <div class="video">
  818. {Video-500}
  819. </div>
  820. {/block:Video}
  821. {block:Audio}
  822. {block:PermalinkPage}
  823. {block:AlbumArt}
  824. <img src="{AlbumArtURL}" alt="{block:Artist}{Artist}{/block:Artist}">
  825. {/block:AlbumArt}
  826. {/block:PermalinkPage}
  827. {block:AudioPlayer}
  828. {block:IfNotDarkTheme}{AudioPlayer}{/block:IfNotDarkTheme}
  829. {block:IfDarkTheme}{AudioPlayer color="black"}{/block:IfDarkTheme}
  830. {/block:AudioPlayer}
  831. {/block:Audio}
  832. </div>
  833. {block:Photo}
  834. {block:Caption}
  835. <div class="caption">
  836. {Caption}
  837. </div>
  838. {/block:Caption}
  839. {/block:Photo}
  840. {block:Answer}
  841. <div class="caption">
  842. {Answer}
  843. </div>
  844. {/block:Answer}
  845. {block:Photoset}
  846. {block:Caption}
  847. <div class="caption">
  848. {Caption}
  849. </div>
  850. {/block:Caption}
  851. {/block:Photoset}
  852. {block:Video}
  853. {block:Caption}
  854. <div class="caption">
  855. {Caption}
  856. </div>
  857. {/block:Caption}
  858. {/block:Video}
  859. {block:Audio}
  860. <div class="audInfo">
  861. {block:TrackName}
  862. <p><b>{TrackName}</b></p>
  863. {/block:TrackName}
  864. {block:Artist}
  865. <p><span class="ion-ios-volume-high"></span> {Artist}</p>
  866. {/block:Artist}
  867. {block:Album}
  868. <p><span class="ion-disc"></span> {Album}</p>
  869. {/block:Album}
  870. </div>
  871. {block:PermalinkPage}
  872. <div class="caption">
  873. {block:Caption}{Caption}{/block:Caption}
  874. </div>
  875. {/block:PermalinkPage}
  876. {/block:Audio}
  877.  
  878. {block:Text}
  879. {block:Title}
  880. <h3 class="title">{Title}</h3>
  881. {/block:Title}
  882. <div class="caption">
  883. {Body}
  884. </div>
  885. {/block:Text}
  886. {block:Link}
  887. <h3 class="title isLink"><a href="{URL}" target="{Target}">{Name} &raquo;</a></h3>
  888. {block:Description}
  889. <div class="caption">
  890. {Description}
  891. </div>
  892. {/block:Description}
  893. {/block:Link}
  894.  
  895. {block:Quote}
  896. <h3 class="title isQuote">{Quote}</h3>
  897. {block:Source}
  898. <div class="caption">
  899. <cite>{Source}</cite>
  900. </div>
  901. {/block:Source}
  902. {/block:Quote}
  903.  
  904. {block:Chat}
  905. {block:Title}
  906. <h3 class="title">{Title}</h3>
  907. {/block:Title}
  908. <ul class="chat">
  909. {block:Lines}
  910. <li>
  911. {block:Label}
  912. <label>{Label}</label>
  913. {/block:Label}
  914. {Line}
  915. </li>
  916. {/block:Lines}
  917. </ul>
  918. {/block:Chat}
  919.  
  920. {block:Date}
  921. {block:PermalinkPage}<div class="metaHolder">{/block:PermalinkPage}
  922. {block:RebloggedFrom}
  923. <div class="parents">
  924. <a href="{ReblogParentURL}" target="_blank">
  925. <span>via @{ReblogParentName}</span>
  926. <i>{ReblogParentTitle}</i>
  927. </a>
  928. <a href="{ReblogRootURL}" target="_blank">
  929. <span>from @{ReblogRootName}</span>
  930. <i>{ReblogRootTitle}</i>
  931. </a>
  932. </div>
  933. {/block:RebloggedFrom}
  934. <div class="meta">
  935. <time datetime="{Year}-{MonthNumberWithZero}-{DayOfMonthWithZero} {12HourWithZero}"><a href="{Permalink}">{Month} {DayOfMonth}<sup>{DayOfMonthSuffix}</sup></a>{TimeAgo}</time>
  936. <div class="btns">
  937. <div class="likeBtn">
  938. {LikeButton}
  939. <span class="ion-ios-heart-outline"></span>
  940. {NoteCountWithLabel}
  941. </div>
  942. <a class="rblg" href="{ReblogURL}" target="_blank">
  943. <span class="ion-ios-refresh-empty"></span>
  944. Reblog
  945. </a>
  946. </div>
  947. </div>
  948. {block:PermalinkPage}</div>{/block:PermalinkPage}
  949. {/block:Date}
  950. {block:PermalinkPage}
  951. {block:HasTags}
  952. <div class="tags">
  953. <b>Tags:</b> {block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}
  954. </div>
  955. {/block:HasTags}
  956. {block:PostNotes}
  957. {PostNotes-64}
  958. {/block:PostNotes}
  959. {/block:PermalinkPage}
  960.  
  961.  
  962.  
  963.  
  964.  
  965. {block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource}<!-- {block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  966. </article>
  967. {/block:Posts}
  968. </section>
  969. {block:Pagination}
  970. <footer class="{select:NextPage}">
  971. {block:NextPage}<a id="loadmore">more posts</a>{/block:NextPage}
  972. <div id="pagination">
  973. {block:PreviousPage}<a href="{PreviousPage}">&lsaquo; previous </a>{/block:PreviousPage}<span>{CurrentPage} of {TotalPages} pages</span>{block:NextPage} <a href="{NextPage}" id="nxt">next &rsaquo;</a>{/block:NextPage}
  974. </div>
  975. </footer>
  976. {/block:Pagination}
  977. </body>
  978.  
  979. <script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
  980. <script src="http://static.tumblr.com/emvnqzg/NOVo0fisl/scripts.js"></script>
  981. <script src="http://static.tumblr.com/wgg6svp/sDinmsq3x/jquery.style-my-tooltips.js"></script>
  982. <script src="http://static.tumblr.com/emvnqzg/cK3o6sxeb/jquery.truncate.js"></script>
  983. <script src="http://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
  984. <script src="http://static.tumblr.com/q8c0vxg/xYrnjmd74/jquery.infinitescroll.min.js"></script>
  985. <script src="http://static.tumblr.com/wgg6svp/sHUoh4d39/unnest.min.js"></script>
  986. <script src ="http://static.tumblr.com/fwgzvyf/l6jnyutne/shythemes.vr.js"></script>
  987. <script>
  988. $(function(){
  989.  
  990. $("[title]").style_my_tooltips({
  991. tip_follows_cursor:true,
  992. tip_delay_time:200,
  993. tip_fade_speed:500
  994. });
  995. $('article').unnest({
  996. newCaptionUsername: true,
  997. originalPostCaptionUsername: true,
  998. tumblrAvatars: false,
  999. usernameColon: true
  1000. });
  1001. $('p:empty').remove();
  1002. $('.sns a[href="///"]').remove();
  1003. {block:PermalinkPage}
  1004. var $i = 0;
  1005. setInterval(function() {
  1006. $(".slideshow img").eq($i-1).animate({'opacity':'0'}, 1000);
  1007. $(".slideshow img").eq($i).animate({'opacity':'1'}, 500);
  1008. $i++;
  1009. if($i >= $('.slideshow img').length){
  1010. $i=0;
  1011. }
  1012. }, 3000);
  1013.  
  1014. {/block:PermalinkPage}
  1015.  
  1016. $('#linkMenu').click(function(e){
  1017. e.preventDefault();
  1018. $('.menu').addClass('showing');
  1019. });
  1020. $('#close').click(function(e){
  1021. e.preventDefault();
  1022. $('.menu').removeClass('showing');
  1023. });
  1024.  
  1025. var parent = $('section');
  1026. {block:IndexPage}
  1027.  
  1028. function textTrunc($this){
  1029. if(!$this.hasClass('isText') && !$this.hasClass('isAnswer')){
  1030. if($('.caption', $this).length && {text:CaptionWordBreak} > 0){
  1031. var string = $('.caption', $this).html();
  1032. if($('.caption', $this).text().length > {text:CaptionWordBreak} ){
  1033. var output = $.truncate(string, { length: {text:CaptionWordBreak}, words: true });
  1034. $('.caption', $this).html(output);
  1035. }
  1036. }
  1037. }
  1038. }
  1039.  
  1040. $('article').each(function(){
  1041. textTrunc($(this));
  1042. });
  1043.  
  1044.  
  1045. $(window).scroll(function(){
  1046. if($(window).scrollTop() > 10){
  1047. $('.topbar, .tmblr-iframe.iframe-controls--desktop, #tumblr_controls').addClass('fixed');
  1048. }else{
  1049. $('.topbar, .tmblr-iframe.iframe-controls--desktop, #tumblr_controls').removeClass('fixed');
  1050. }
  1051. });
  1052.  
  1053. if($('footer').hasClass('ldmr') || $('footer').hasClass('ifnt')){
  1054. parent.infinitescroll({
  1055. navSelector : "footer",
  1056. nextSelector : "#nxt",
  1057. itemSelector : "article",
  1058. bufferPx : 50,
  1059. done : "",
  1060. loading: {
  1061. img : "",
  1062. msgText: "",
  1063. finishedMsg:""
  1064. },
  1065. },
  1066. function( newElements ) {
  1067. var $newElems = $( newElements ).css({ opacity: 0 });
  1068. var $newElemsIDs = $newElems.map(function () {
  1069. return this.id;
  1070. }).get();
  1071. $newElems.imagesLoaded(function(){
  1072. $newElems.animate({ opacity: 1 });
  1073. $('[title]').style_my_tooltips();
  1074. $newElems.unnest({
  1075. newCaptionUsername: true,
  1076. originalPostCaptionUsername: true,
  1077. tumblrAvatars: false,
  1078. usernameColon: true
  1079. });
  1080. $('p:empty', $newElems).remove();
  1081. $newElems.each(function(){ textTrunc($(this)); });
  1082. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1083. });
  1084. resizeVideos();
  1085. });
  1086. if($('footer').hasClass('ldmr')){
  1087. parent.infinitescroll({
  1088. behavior: 'twitter',
  1089. errorCallback: function () {
  1090. $('footer').fadeOut(700);
  1091. }
  1092. });
  1093. $(window).unbind('.infscr');
  1094. $('#loadmore').click(function(e){
  1095. e.preventDefault();
  1096. parent.infinitescroll('retrieve');
  1097. $('footer').show();
  1098. return false;
  1099. });
  1100. }
  1101. }
  1102. {/block:IndexPage}
  1103. });
  1104. </script>
  1105. <!--
  1106.  
  1107. #18 RAILS BY NEO
  1108. ================
  1109.  
  1110. ### It is IMPORTANT that you do not delete any of the following.
  1111.  
  1112. ## Information
  1113. Creator: @MTRICS | @NEOTHM
  1114. Release: 25/11/2016
  1115. Version: 0.1
  1116. Latest update: 28/11/2016
  1117. Log: tried fixing the #close btn
  1118.  
  1119. ## Dependencies
  1120. Photosets: © Pixel Union
  1121. Videos: © shythemes
  1122. Images loaded: © David Desandro
  1123. Infinite Scroll: © Paul Irish
  1124. Tooltips: © Style my tooltips
  1125. Un-nest: © magnusthemes & neothm
  1126. Inspiration: metaproject.net & theindex.la
  1127.  
  1128. ## F.A.Q
  1129. Q: A:
  1130.  
  1131. ## Links
  1132. Support http://neothm.com/tagged/q&a
  1133. > #18 SPECIFIC http://neothm.com/tagged/a:18
  1134. Terms of use http://neothm.com/terms
  1135. Tips & tricks http://neothm.com/tagged/101
  1136.  
  1137. ## License
  1138. LICENSED UNDER CREATIVE COMMONS ATTRIBUTION-NONCOMMERCIAL-
  1139. NODERIVATIVES 4.0 INTERNATIONAL LICENSE (CC BY-NC-ND 4.0)
  1140. [http://creativecommons.org/licenses/by-nc-nd/4.0/]
  1141. (CC) 2016, NEO @NEOTHM
  1142.  
  1143. Permission to use and modify this theme for personal purposes is
  1144. hereby granted, provided that the above notice and this
  1145. permission notice remain in all copies.
  1146.  
  1147. THIS THEME IS PROVIDED "AS IS" AND THE CREATOR DISCLAIMS ALL
  1148. WARRANTIES WITH REGARD TO THE FOLLOWING CODE.
  1149.  
  1150. -->
  1151. </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!