Advertisement
bct

false promises theme

bct
Jan 29th, 2016
20,756
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 45.76 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <!------------------------------------------
  5.  
  6. (◍•ᴗ•◍)♡ ✧*。
  7.  
  8. False Promises Theme by Chloe | @dontbrag | @bychloethemes
  9.  
  10. > Do not delete/alter any credit.
  11. > Do not claim as your own.
  12. > Do not copy any code.
  13. > Do not redistribute.
  14.  
  15. ------------------------------------------->
  16. {block:Hidden}
  17. <meta name="image:Avatar" content="" />
  18.  
  19. <meta name="color:Background" content="#fafafa"/>
  20.  
  21. <meta name="color:Text" content="#4b4f54"/>
  22. <meta name="color:Accent" content="#f0bfb6" />
  23. <meta name="color:Post Accent" content="#eee" />
  24.  
  25. <meta name="select:Body Font" content="'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif" title="Helvetica"/>
  26. <meta name="select:Body Font" content="inconsolata" title="Inconsolata"/>
  27.  
  28. <meta name="select:Images" content="contain" title="Contain" />
  29. <meta name="select:Images" content="cover" title="Cover" />
  30.  
  31. <meta name="select:Padding" content="0px" title="No Padding" />
  32. <meta name="select:Padding" content="5px" title="Small Padding" />
  33. <meta name="select:Padding" content="10px" title="Medium Padding" />
  34. <meta name="select:Padding" content="15px" title="Large Padding" />
  35.  
  36. <meta name="select:Filter" content="" title="None" />
  37. <meta name="select:Filter" content="-webkit-filter:grayscale(50%);filter:grayscale(50%);" title="50% Greyscale" />
  38. <meta name="select:Filter" content="-webkit-filter:grayscale(100%);filter:grayscale(100%);" title="100% Greyscale" />
  39. <meta name="select:Filter" content="-webkit-filter:opacity(70%);filter:opacity(70%);" title="Faded" />
  40.  
  41. <meta name="if:Infinite Scroll" content="" />
  42. <meta name="if:Manual Load" content="" />
  43. <meta name="if:Multisized Posts" content="" />
  44. <meta name="if:Rounded Corners" content="" />
  45. <meta name="if:Borders" content="" />
  46. <meta name="if:Related Posts" content="" />
  47. <meta name="if:Credit Link" content="" />
  48.  
  49. <meta name="text:Tagline" content="tagline" />
  50. <meta name="text:Ask Label" content="message" />
  51. <meta name="text:Submit Label" content="submit" />
  52. <meta name="text:Archive Label" content="past" />
  53. <meta name="text:Link 1" content="" />
  54. <meta name="text:URL 1" content="http://" />
  55. <meta name="text:Link 2" content="" />
  56. <meta name="text:URL 2" content="http://" />
  57. <meta name="text:Link 3" content="" />
  58. <meta name="text:URL 3" content="http://" />
  59. {/block:Hidden}
  60. <meta charset="UTF-8" />
  61. <link href='https://fonts.googleapis.com/css?family=Roboto+Condensed:400,600' rel='stylesheet' type='text/css'>
  62. <title>{block:TagPage}{Tag} posts | {/block:TagPage} {block:PostSummary}{PostSummary} | {/block:PostSummary}{Title}</title>
  63. <link rel="shortcut icon" href="{Favicon}">
  64. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  65. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  66. <link rel="stylesheet" href="//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
  67. <script src="//use.edgefonts.net/{select:Body Font}:n4,i4,n5,n6,n7.js"></script>
  68. <link href="http://static.tumblr.com/wgijwsy/k1Hm9ei8b/normalize.css" rel="stylesheet" type="text/css" />
  69. <link rel="stylesheet" href="http://static.tumblr.com/yxfeliq/0gMo0fe39/style.css">
  70. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  71. <style type="text/css">
  72. /*--start global settings--*/
  73. #tumblr_controls, .tmblr-iframe {top:5px!important;right:5px!important;-webkit-filter: invert(90%);filter: invert(90%);position:fixed!important;-webkit-transform:scale(.8, .8);-moz-transform:scale(.8, .8);transform:scale(.8, .8);-webkit-transform-origin: right top;-moz-transform-origin: right top;-ms-transform-origin: right top;-o-transform-origin: right top;transform-origin: right top;z-index:999999999999999999!important}
  74. ::-webkit-scrollbar {background-color:#fff;height: 7px;width: 7px;}
  75. ::-webkit-scrollbar-thumb {background-color:{color:Accent};border:2px solid #fff;}
  76. body{background:{color:background};color:{color:text};font-size:14px;font-family: {select:Body Font};font-weight:300;}
  77. a {text-decoration:none;color:{color:Text};-webkit-transition: all 0.2s ease-in;-moz-transition: all 0.2s ease-in;-o-transition: all 0.2s ease-in;transition: all 0.2s ease-in;}
  78. a:focus {outline:none;}
  79. iframe, img, embed, object, video {max-width: 100%;}
  80. img {height: auto;width: auto;vertical-align:middle;}
  81. {block:IfInfiniteScroll}
  82. #infscr-loading {position:absolute;bottom:-180px;height: 124px;width: 124px;margin-left:50%;left:-60px;text-align:center;line-height:120px;color:#bbb;text-transform:uppercase;font-weight:bold;{block:IfManualLoad}display:none!important;{/block:IfManualLoad}}
  83. #infscr-loading:before {content:'';position:absolute;top:0;left:0;height: 120px;width: 120px;border:2px solid #ccc;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;border-bottom-color:{color:Accent};-webkit-animation:rotate 2s linear infinite;-moz-animation:rotate 2s linear infinite;animation:rotate 2s linear infinite;}
  84. #infscr-loading img {display:none;}
  85. @-webkit-keyframes rotate{ 100% { -webkit-transform: rotate(360deg); } }
  86. @-moz-keyframes rotate{ 100% { -moz-transform: rotate(360deg); } }
  87. @keyframes rotate{ 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
  88. {/block:IfInfiniteScroll}
  89. {block:IfManualLoad}
  90. #load-more {position:relative;height: 124px;width: 124px;margin-left:50%;left:-60px;text-align:center;line-height:120px;color:{color:Accent};text-transform:uppercase;font-weight:bold;margin-top:60px;cursor:pointer;}
  91. #load-more #spin {position:absolute;top:0;left:0;height: 120px;width: 120px;border:2px solid {color:Accent};border-radius:50%;border-bottom-color:{color:Accent};}
  92. #load-more.roll #spin {-webkit-animation:rotate 2s linear infinite;-moz-animation:rotate 2s linear infinite;animation:rotate 2s linear infinite;border:2px solid #ccc;border-bottom-color:{color:Accent};}
  93. #load-more.roll {color:#bbb}
  94. {/block:IfManualLoad}
  95. /*--end global settings--*/
  96.  
  97. /*--start main body wrap--*/
  98. #wrapper {margin-left:50%;-webkit-transform: translate(-50%, 0%);-moz-transform: translate(-50%, 0%);-ms-transform: translate(-50%, 0%);-o-transform: translate(-50%, 0%);transform: translate(-50%, 0%);margin-top:40px;width:936px;{block:IfInfiniteScroll}padding-bottom:240px;{block:IfManualLoad}padding-bottom:60px;{/block:IfManualLoad}{/block:IfInfiniteScroll}}
  99. /*--end main body wrap--*/
  100.  
  101. /*--start header--*/
  102. #header {padding: 20px 0;margin-bottom:45px;}
  103. #header img {width: 150px;height: 150px;border-radius: 50%;margin: 0 71px;letter-spacing: 0;word-spacing: 0;display: inline-block;vertical-align:top;{block:IfBorders}margin:0 70px;border:1px solid #ececec;{/block:IfBorders}}
  104. #head-info {width: 543px;margin-left: 30px;display: inline-block;}
  105. #header h1 {font-weight:normal;font-size:34px;margin:0;line-height:40px;}
  106. #header p {margin:0;font-size: 17px;line-height: 24px;margin-top: 14px;}
  107. #tag-line {font-weight:normal;color:{color:Accent};margin-right:15px;}
  108.  
  109. ul#navlinks {list-style-type:none;font-size:17px;margin: 0;padding:0;z-index:99;margin-top: 17px;}
  110. ul#navlinks a li {display:inline-block;padding:0;margin:0 8px;}
  111. ul#navlinks a:first-child li {margin-left:0;}
  112. ul#navlinks a {color:{color:accent};-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
  113. ul#navlinks a:hover {color:{color:text};-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
  114. /*--end header--*/
  115.  
  116. /*--------------------START OF POSTS--------------------*/
  117. #header img, .photo-post, .photoset, .albumart, .post img{block:PermalinkPage}, .photo-box, .photoset-box, .album-box{/block:PermalinkPage} {{select:Filter};-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
  118. {block:PermalinkPage}.post:hover img, .post:hover .photo-box, .post:hover .photoset-box, .post:hover .album-box {-webkit-filter:initial;filter:initial;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}{/block:PermalinkPage}
  119. #posts {margin-top:50px;}
  120. /*--start global post settings--*/
  121. article {margin-bottom:30px;position:relative;width:292px;height:292px;overflow:hidden;background:#fff;}
  122. article a {color:{color:Accent};}
  123. article h2 {margin:0;font-size:1.3em;}
  124. article p {margin:10px 0;}
  125. article p:first-child {margin-top:0;}
  126. article p:last-child {margin-bottom:0;}
  127. article blockquote {margin: 5px 0 5px 10px;border-left:2px solid {color:Accent};padding-left:10px;}
  128. article ul, article ol {padding-left:25px;}
  129. {block:IfBorders}article{width:290px;height:290px;border:1px solid #ececec;}{/block:IfBorders}
  130. /*--end global post settings--*/
  131.  
  132. /*--start text based settings--*/
  133. .text-based {padding:20px;position:relative;z-index:2;word-break: break-word;}
  134. .text-based a {color:{color:Accent};-webkit-transition: all 0.2s ease-in;-moz-transition: all 0.2s ease-in;-o-transition: all 0.2s ease-in;transition: all 0.2s ease-in;}
  135. .text-based a:hover {color:{color:Text};-webkit-transition: all 0.2s ease-in;-moz-transition: all 0.2s ease-in;-o-transition: all 0.2s ease-in;transition: all 0.2s ease-in;}
  136. .t-b:after {content:'';width: 100%;height: 50px;position: absolute;bottom: 0;left: 0;z-index:999;background-image:-webkit-linear-gradient(bottom, #fff 45%, transparent);background-image:-moz-linear-gradient(bottom, #fff 45%, transparent);background-image:-ms-linear-gradient(bottom, #fff 45%, transparent);background-image:-o-linear-gradient(bottom, #fff 45%, transparent);background-image:linear-gradient(bottom, #fff 45%, transparent);}
  137. .quote-post cite {text-align:right;display:block;margin:5px 5px 10px 5px;}
  138. ul.chat-list {padding:0;list-style-type:none;margin:0;}
  139. ul.chat-list li {line-height:1.3em;}
  140. ul.chat-list .label {color:{color:Accent};font-weight:bold;}
  141. .responses p:first-of-type {margin-top:0;display:inline-block;}
  142. /*--end text based settings--*/
  143.  
  144. /*--start big post settings--*/
  145. article.big {width:614px;height:614px;font-size:2.2em;}
  146. {block:IfBorders}article.big{width:612px;height:612px;}{/block:IfBorders}
  147. .big .text-based {padding:40px;}
  148. .big.t-b:after {height:100px;}
  149. .big .photo-post, .big .photoset, .big .albumart { width:calc(614px - {select:Padding} - {select:Padding}{block:IfBorders} - 2px{/block:IfBorders});height:calc(614px - {select:Padding} - {select:Padding}{block:IfBorders} - 2px{/block:IfBorders});}
  150. .big .audio-button {height: 88px;width: 88px;line-height: 88px;}
  151. .photo-post, .photoset, .albumart {background:center center;width:calc(292px - {select:Padding} - {select:Padding}{block:IfBorders} - 2px{/block:IfBorders});height:calc(292px - {select:Padding} - {select:Padding}{block:IfBorders} - 2px{/block:IfBorders});background-repeat:no-repeat;background-size:{select:Images};margin:{select:Padding};}
  152. .photos .photoset {display: none;}
  153. .photos .photoset:first-child {display: block;}
  154. .audio_player {background: {color:Accent};margin: 10px 0;}
  155. .tumblr_audio_player {width: 100%;opacity: 0.7;margin-bottom: -3px;}
  156. .audio-button {font-weight: normal;bottom:{select:Padding};left:{select:Padding};line-height:40px;text-align: center;z-index: 1;font-size: 1.4em;position: absolute;color: {color:Text};width:40px;height:40px;border-radius:0 50% 0 0;background:rgba({RGBcolor:Accent}, 0.6);}
  157.  
  158. /*--start underlay settings--*/
  159. .q-bg, .l-bg, .c-bg, .a-bg {font-weight: normal;top: 0px;text-align: center;width: 100%;z-index: 0;opacity: 0.3;font-size: 18em;position: absolute;color: {color:Post Accent};}
  160. .big .q-bg, .big .l-bg, .big .c-bg, .big .a-bg {position: absolute;font-size: 18em;font-weight: normal;top: -20px;text-align: center;width: 100%;z-index: 0;opacity: 0.3;color: {color:Post Accent};}
  161. .l-bg, .big .l-bg {font-size: 17em;}
  162. .c-bg, .big .c-bg {top: -20px;font-size: 17em;}
  163. .a-bg {font-size: 20em;top: -30px;}
  164. .big .a-bg {font-size: 20em;top: -80px;}
  165. /*--end underlay settings--*/
  166.  
  167. /*--start permalinks settings--*/
  168. .post-mask {width:100%;height:100%;position:absolute;opacity:0;visibility:hidden;-webkit-transition: all 0.4s ease-in;-moz-transition: all 0.4s ease-in;-o-transition: all 0.4s ease-in;transition: all 0.4s ease-in;background:rgba(0,0,0, 0.6);z-index:9999;}
  169. article:hover .post-mask {opacity:1;visibility:visible;-webkit-transition: all 0.4s ease-in;-moz-transition: all 0.4s ease-in;-o-transition: all 0.4s ease-in;transition: all 0.4s ease-in;}
  170. .info {top:50%;position:relative;text-align:center;-webkit-transform: translate(0%, -50%);-moz-transform: translate(0%, -50%);-ms-transform: translate(0%, -50%);-o-transform: translate(0%, -50%);transform: translate(0%, -50%);color:#fff;width:100%;text-transform:uppercase;font-family:'Roboto Condensed';font-size:18px;}
  171. .info a {background:transparent;color:#fff;padding:2px 5px;margin:3px ;line-height:200%;-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
  172. .info a:hover {color:{color:text};background:#fff;-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
  173. .big .info {font-size:1.2em;}
  174. /*--end permalinks settings--*/
  175.  
  176. /*-----Dont Change Lightbox------*/
  177. #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999;}
  178. #cboxWrapper {max-width:none;}
  179. #cboxOverlay{position:fixed; width:100%; height:100%;}
  180. #cboxMiddleLeft, #cboxBottomLeft{clear:left;}
  181. #cboxContent{position:relative;}
  182. #cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
  183. #cboxTitle{margin:0;}
  184. #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
  185. #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
  186. .cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
  187. .cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
  188. #colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}
  189. /*----Change below here-------*/
  190. #cboxOverlay{background:#000;}
  191. #colorbox{outline:0;}
  192. #cboxContent{;background:#fff;}
  193. .cboxIframe{background:#fff;}
  194. #cboxError{padding:50px; border:1px solid #ccc;}
  195. #cboxLoadedContent{ background:#fff;max-height:540px;position:relative;}
  196. #cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;}
  197. #cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;}
  198. #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}
  199. #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose { border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
  200. #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active, #cboxPrevious:focus, #cboxNext:focus, #cboxSlideshow:focus, #cboxClose:focus {outline:0;}
  201. #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}
  202. #cboxPrevious{position: absolute;top: calc(50% - 21px);left: calc(50% - 490px);width: 30px;height: 20px;z-index: 99999;color: #fff;font-size: 3em;}
  203. #cboxNext{position: absolute;top: calc(50% - 21px);left: calc(50% + 460px);width: 30px;height: 20px;z-index: 99999;color: #fff;font-size: 3em;}
  204. #cboxPrevious:hover, #cboxNext:hover{color:{color:Accent};}
  205. #cboxClose{position:absolute; top:15px; right:5px; display:block; width:38px; height:19px;z-index:99999;color:#000;font-size:20px;}
  206. #cboxClose:hover{color:{color:Accent};}
  207. .cboxPhoto {width:500px;}
  208. .lighters {padding:0px; background:#fff;overflow-y:auto;}
  209. .lighters h1 {margin:0;padding:0;font-weight:400;}
  210. /*---lightbox----*/
  211.  
  212. /*---lightbox sidebar--*/
  213. .sidebox {position: absolute;top: 0px;left: 540px;padding: 20px;width: 310px;}
  214. .via img {width: 40px;height: 40px;border-radius: 50%;border: 1px solid #eee;position:relative; top:-7px;}
  215. .linked {display: inline-block;margin-left: 10px;margin-top: 10px;font-size: 0.9em;}
  216. .linked a:first-of-type {margin-top:3px;text-transform:uppercase;font-size: 1.1em;}
  217. hr {margin: 15px auto;width: 100%;height: 1px;border: none;background: #eee;}
  218. .captions blockquote {border-left: 2px solid #eee;margin: 0px 0 5px 10px;padding: 0 0 0 10px;}
  219. .captions p {margin:5px;}
  220. a.tumblr_blog {font-weight:bold;color:{color:Accent};}
  221. .tags { font-size:0.9em;word-break:break-word;}
  222. .tags a {color:{color:Accent};}
  223. .footer {position: absolute;bottom: 0px;left: 540px;padding: 20px;width: 310px;color: #fff;text-align: center;line-height: 12px;padding-top:0;}
  224. .liker {position: absolute;left: 30px;bottom: 23px;font-size: 1.6em;cursor:pointer;}
  225. .like_button {width: 100%;height: 14px;z-index: 10;cursor: pointer;position: relative;top: 2px;left:-1px;position: absolute;opacity:0!important;}
  226. .like_button iframe {width: 100% !important;height: 100% !important;cursor:pointer;}
  227. .my_button {width: 100%;z-index: 1;cursor: pointer;display: inline-block;-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;color:{color:Text};}
  228. .like_button:hover + .my_button {cursor:pointer;color:{color:Accent};-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
  229. .like_button.liked + .my_button .ion-android-favorite-outline {color: #f12938;cursor:pointer;-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
  230. .timeago {font-size: 11px;color: {color:Text};text-shadow: none;text-transform: uppercase;text-align: center;}
  231. .timeago a:hover {color:{color:Accent};-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
  232. .reblogger {position: absolute;right: 30px;bottom: 22px;font-size: 1.6em;}
  233. .reblogger a {color:{color:Text};-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
  234. .reblogger a:hover {color:{color:Accent};-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;-o-transition: all 0.4s ease-in-out;transition: all 0.4s ease-in-out;}
  235. /*---end lightbox sidebar--*/
  236.  
  237. /*---lightbox content--*/
  238. .photo-box, .photoset-box, .album-box {background:center center;width:540px;height:540px;background-repeat:no-repeat;background-color:#fff;border-right:1px solid #eee;display:inline-block;}
  239. .lighters .sidebox-words {height: 358px;overflow-y: auto;padding-top: 15px;padding-bottom: 15px;width: 310px;padding-right: 20px;}
  240. .lighters .text-based {width: 460px;height: 460px;border-right: 1px solid #eee;overflow-y: auto;padding:40px;}
  241. .lighters blockquote {margin: 5px 0 5px 10px;border-left:2px solid {color:Accent};padding-left:10px;}
  242. .lighters p {margin:10px 0;}
  243. .lighters p:first-child, .lighters h2:first-child {margin-top:0;}
  244. .lighters p:last-child {margin-bottom:0;}
  245. .lighters .q-bg, .lighters .l-bg,.lighters .c-bg, .lighters .a-bg {position: absolute;font-size: 36em;font-weight: normal;text-align: center;z-index: 0;opacity: 0.3;color: {color:Post Accent};width:540px;line-height:540px;}
  246. .lighters .l-bg {font-size: 35em;}
  247. .lighters .c-bg {top: -30px;font-size: 33em;}
  248. .lighters .a-bg {font-size: 44em;top: -40px;}
  249. .lighters .quote-post, .lighters .chat-post, .lighters .link-post {font-size:2em;}
  250. .lighters .answer-post, .lighters .text-post {font-size:1.6em;}
  251. /*---end lightbox content--*/
  252.  
  253. /*--start permalink page settings--*/
  254. #newer-post {position: absolute;top: calc(50% - 21px);left: calc(50% - 480px);width: 30px;height: 20px;z-index: 99999;font-size: 3em;}
  255. #older-post {position: absolute;top: calc(50% - 21px);left: calc(50% + 470px);width: 30px;height: 20px;z-index: 99999;font-size: 3em;}
  256. #newer-post a, #older-post a {color:{color:Accent};}
  257. #newer-post a:hover, #older-post a:hover {color:{color:Text};-webkit-transition: all 0.2s ease-in;-moz-transition: all 0.2s ease-in;-o-transition: all 0.2s ease-in;transition: all 0.2s ease-in;}
  258. .post {width:540px;{block:PermalinkPagination}width:890px;height:540px;{/block:PermalinkPagination}background:#fff;margin:0 auto 50px auto;position:relative;overflow:hidden;}
  259. .video-box {border-right:1px solid #eee;width:540px;position:absolute;top:0;height:540px;}
  260. .video {margin-top:50%;-webkit-transform: translate(0%, -50%);-moz-transform: translate(0%, -50%);-ms-transform: translate(0%, -50%);-o-transform: translate(0%, -50%);transform: translate(0%, -50%)}
  261. .video iframe {height:540px}
  262. .post .captions {height: 367px;overflow-y: auto;padding-top: 15px;padding-bottom: 15px;}
  263. .post .text-based {width: 460px;{block:PermalinkPagination}height: 460px;border-right: 1px solid #eee;{/block:PermalinkPagination}overflow-y: auto;padding:40px;}
  264. .post blockquote {margin: 5px 0 5px 10px;border-left:2px solid {color:Accent};padding-left:10px;}
  265. .post p {margin:10px 0;}
  266. .post p:first-child, .post h2:first-child {margin-top:0;}
  267. .post p:last-child {margin-bottom:0;}
  268. .post .q-bg, .post .l-bg,.post .c-bg, .post .a-bg {position: absolute;font-size: 36em;font-weight: normal;text-align: center;z-index: 0;opacity: 0.3;color: {color:Post Accent};width:540px;line-height:540px;}
  269. .post .l-bg {font-size: 35em;}
  270. .post .c-bg {top: -30px;font-size: 33em;}
  271. .post .a-bg {font-size: 44em;top: -40px;}
  272. .post .quote-post, .post .chat-post, .post .link-post {font-size:2em;}
  273. .post .answer-post, .post .text-post {font-size:1.2em;}
  274. .sidebar-words {height: 358px;overflow-y: auto;padding-top: 15px;padding-bottom: 15px;width: 310px;padding-right: 20px;}
  275. .captions-p blockquote {border-left: 2px solid #eee;margin: 0px 0 5px 10px;padding: 0 0 0 10px;}
  276. .captions-p p {margin:5px;}
  277. ol.notes {padding: 0px;margin: 0;list-style-type: none;font-size:0.9em;}
  278. ol.notes a {border-bottom:0;}
  279. ol.notes a:hover {color:{color:Accent};}
  280. ol.notes li.note {padding: 3px;margin-bottom:3px;}
  281. ol.notes li.note img.avatar {float:right;border-radius:50%;margin-left:5px;}
  282. ol.notes li.note blockquote {border-color: {color:text};padding-left: 6px;margin: 6px;}
  283. ol.notes li.note blockquote a {text-decoration: none;}
  284. ol.notes a.more_notes_link, ol.notes .notes_loading {color:{color:Accent};}
  285. /*--end permalink page settings--*/
  286.  
  287. /*--start pagination settings--*/
  288. .pagination {text-align: center;width: 936px;margin: 20px auto;line-height: 30px;padding-bottom:20px;}
  289. .pagination a {color:{color:Accent};}
  290. .pagination a:hover {color:{color:Text};-webkit-transition: all 0.2s ease-in;-moz-transition: all 0.2s ease-in;-o-transition: all 0.2s ease-in;transition: all 0.2s ease-in;}
  291. #prev-link {float: left;font-size: 1.9em;}
  292. #next-link {float: right;font-size: 1.9em;}
  293. /*--end pagination settings--*/
  294. {block:PermalinkPage}
  295. #related { text-align:center;}
  296. #related h1 {font-weight:normal;}
  297. article {width:200px; height:200px; display:inline-block; margin:11px; text-align:left; font-size:0.9em;}
  298. .photo-post, .photoset, .albumart { width:calc(200px - {select:Padding} - {select:Padding});height:calc(200px - {select:Padding} - {select:Padding});}
  299. .q-bg, .l-bg, .c-bg, .a-bg {display:none;}
  300. .masker {position:absolute; top:0; left:0; z-index:99999; width:200px; height:200px;}
  301. article:nth-child(n+10){
  302. display:none;
  303. }
  304. {block:IfBorders}
  305. article{margin:10px;border:1px solid #ececec;}
  306. .post {border:1px solid #ececec;}
  307. {/block:IfBorders}
  308. {/block:PermalinkPage}
  309. {block:IfRoundedCorners}
  310. #cboxLoadedContent, #cboxContent, .post-mask, article, .post {border-radius:10px;}
  311. {/block:IfRoundedCorners}
  312. </style>
  313. </head>
  314. <body>
  315. <div id="wrapper">
  316. <div id="header"><!--
  317. --><img src="{image:Avatar}"><!--
  318. --><div id="head-info">
  319. <h1>{Title}</h1>
  320. <p>{block:IfTagline}<span id="tag-line">{text:Tagline}</span>{/block:IfTagline} {block:Description}<i>{Description}</i>{/block:Description}</p>
  321. <ul id="navlinks">
  322. <a href="/"><li>home</li></a>{block:AskEnabled}<!--
  323. --><a href="/ask"><li>{text:Ask Label}</li></a>{/block:AskEnabled}{block:SubmissionsEnabled}<!--
  324. --><a href="/submit"><li>{text:Submit Label}</li></a>{/block:SubmissionsEnabled}{block:IfLink1}<!--
  325. --><a href="{text:URL 1}"><li>{text:Link 1}</li></a>{/block:IfLink1}{block:IfLink2}<!--
  326. --><a href="{text:URL 2}"><li>{text:Link 2}</li></a>{/block:IfLink2}{block:IfLink3}<!--
  327. --><a href="{text:URL 3}"><li>{text:Link 3}</li></a>{/block:IfLink3}<!--
  328. --><a href="/archive"><li>{text:Archive Label}</li></a>{block:IfCreditLink}<!--
  329. --><a href="http://dontbrag.tumblr.com" target="_blank"><li>credit</li></a>{/block:IfCreditLink}
  330. </ul>
  331. </div>
  332. </div>
  333. <div id="posts">
  334. {block:Posts}
  335. {block:IndexPage}
  336. <article id="{PostID}" class="{block:Text} t-b{/block:Text}{block:Quote} t-b{/block:Quote}{block:Link} t-b{/block:Link}{block:Chat} t-b{/block:Chat}{block:Answer} t-b{/block:Answer}{block:IfMultisizedPosts}{block:Post4} big{/block:Post4}{block:Post11} big{/block:Post11}{/block:IfMultisizedPosts}">
  337. <a class='inline group1' href="#lb_{PostID}"><div class="post-mask">
  338. <div class="info"><i class="fa fa-heart"></i> {NoteCount}&nbsp; &nbsp;<i class="ion-chatbox-working"></i> {24HourWithZero}:{Minutes}</div>
  339. </div></a>
  340. {block:Text}
  341. <div class="text-post text-based">
  342. {block:Title}<h2>{Title}</h2>{/block:Title}
  343. {Body}
  344. </div>
  345. {/block:Text}{block:Photo}
  346. <div class="photo-post" style="background-image:url('{PhotoURL-500}');">
  347. </div>
  348. {/block:Photo}{block:Photoset}
  349. <div class="photoset-post">
  350. <div class="photos">
  351. {block:Photos}
  352. <div class="photoset" style="background-image:url('{PhotoURL-500}');"></div>
  353. {/block:Photos}
  354. </div>
  355. <div class="audio-button"><i class="ion-images"></i></div>
  356. </div>
  357. {/block:Photoset}{block:Quote}
  358. <div class="q-bg"><i class="fa fa-quote-left"></i></div>
  359. <div class="quote-post text-based">
  360. <h2><span style="color:{color:Accent};">❝</span> {Quote} <span style="color:{color:Accent};">❞</span></h2>
  361. {block:Source}<cite>-&nbsp;{Source}</cite>{/block:Source}
  362. </div>
  363. {/block:Quote}{block:Link}
  364. <div class="l-bg"><i class="fa fa-link"></i></div>
  365. <div class="link-post text-based">
  366. <h2><a href="{URL}" {Target}>{Name} &nbsp;<i class="fa fa-angle-right"></i></a></h2>
  367. {block:Description}{Description}{/block:Description}
  368. </div>
  369. {/block:Link}{block:Chat}
  370. <div class="c-bg"><i class="fa fa-comments"></i></div>
  371. <div class="chat-post text-based">
  372. {block:Title}<h2>{Title}</h2>{/block:Title}
  373. <ul class="chat-list">
  374. {block:Lines}
  375. <li class="{Alt}">
  376. {block:Label}<span class="label">{Label}</span>{/block:Label}
  377. {Line}</li>
  378. {/block:Lines}
  379. </ul>
  380. </div>
  381. {/block:Chat}{block:Audio}
  382. <div class="audio">
  383. <div class="albumart" style="background-image:url('http://static.tumblr.com/yxfeliq/C5Xnysfnk/cd.jpg');{block:AlbumArt}background-image:url('{AlbumArtURL}');{/block:AlbumArt}"></div>
  384. <div class="audio-button"><i class="ion-ios-musical-notes"></i></div>
  385. {/block:Audio}{block:Video}
  386. <div class="video-post">
  387. <div class="albumart" style="background-image:url('http://static.tumblr.com/yxfeliq/epAo1nvhu/video-play-button-icon-614x460.png');{block:VideoThumbnail}background-image:url('{VideoThumbnailURL}');{/block:VideoThumbnail}"></div>
  388. <div class="audio-button"><i class="ion-ios-videocam-outline"></i></div>
  389. </div>
  390. {/block:Video}{block:Answer}
  391. <div class="a-bg"><i class="fa fa-question"></i></div>
  392. <div class="answer-post text-based">
  393. <span style="{color:Accent}; font-weight:bold;">Q:</span> {Question}
  394. <br><i style="float:right">&mdash; {Asker}</i>
  395. <br><div class="responses"><span style="{color:Accent}; font-weight:bold">A:</span> {Replies}</div>
  396. </div>
  397. {/block:Answer}<div style="display:none;">
  398. <div id="lb_{PostID}" class="lighters">
  399. {block:Text}
  400. <div class="text-post text-based">
  401. {block:Title}<h2>{Title}</h2>{/block:Title}
  402. {Body}
  403. </div>
  404. {/block:Text}{block:Photo}
  405. <div class="photo-lb">
  406. <div class="photo-box" style="background-image:url('{PhotoURL-500}');background-size:contain;"></div>
  407. </div>
  408. {/block:Photo}{block:Photoset}
  409. <div class="slideshow">
  410. {block:Photos}<div class="photoset-box" style="background-image:url('{PhotoURL-500}');background-size:contain;"></div>{/block:Photos}
  411. </div>
  412. {/block:Photoset}{block:Quote}
  413. <div class="q-bg"><i class="fa fa-quote-left"></i></div>
  414. <div class="quote-post text-based">
  415. <h2><span style="color:{color:Accent};">❝</span> {Quote} <span style="color:{color:Accent};">❞</span></h2>
  416. {block:Source}<cite>-&nbsp;{Source}</cite>{/block:Source}
  417. </div>
  418. {/block:Quote}{block:Link}
  419. <div class="l-bg"><i class="fa fa-link"></i></div>
  420. <div class="link-post text-based">
  421. <h2><a href="{URL}" {Target}>{Name} &nbsp;<i class="fa fa-angle-right"></i></a></h2>
  422. {block:Description}{Description}{/block:Description}
  423. </div>
  424. {/block:Link}{block:Chat}
  425. <div class="c-bg"><i class="fa fa-comments"></i></div>
  426. <div class="chat-post text-based">
  427. {block:Title}<h2>{Title}</h2>{/block:Title}
  428. <ul class="chat-list">
  429. {block:Lines}<li class="{Alt}">{block:Label}<span class="label">{Label}</span> {/block:Label}{Line}</li>{/block:Lines}
  430. </ul>
  431. </div>
  432. {/block:Chat}{block:Audio}
  433. <div class="album-box" style="background-image:url('http://static.tumblr.com/yxfeliq/C5Xnysfnk/cd.jpg');{block:AlbumArt}background-image:url('{AlbumArtURL}');{/block:AlbumArt}background-size:contain;"></div>
  434. {/block:Audio}{block:Video}
  435. <div class="photo-box" style="background-image:url('http://static.tumblr.com/yxfeliq/epAo1nvhu/video-play-button-icon-614x460.png');{block:VideoThumbnail}background-image:url('{VideoThumbnailURL}');{/block:VideoThumbnail}background-size:contain;"></div>
  436. {/block:Video}{block:Answer}
  437. <div class="a-bg"><i class="fa fa-question"></i></div>
  438. <div class="answer-post text-based">
  439. <span style="{color:Accent}; font-weight:bold;">Q:</span> {Question}
  440. <br><i style="float:right">&mdash; {Asker}</i>
  441. <br><div class="responses"><span style="{color:Accent}; font-weight:bold">A:</span> {Replies}</div>
  442. </div>
  443. {/block:Answer}
  444. <div class="sidebox">
  445. <div class="via">
  446. {block:RebloggedFrom}<img src="{ReblogRootPortraitURL-40}">
  447. <span class="linked"><a href="{ReblogRootURL}">{ReblogRootName}</a>
  448. <br>(via <a href="{ReblogParentURL}" target="_bank">{ReblogParentName}</a>)</span>{/block:RebloggedFrom}
  449. {block:NotReblog}<img src="{PortraitURL-40}">
  450. <span class="linked"><a href="/" style="position: relative;top: -5px;">{Name}</a><br></span>
  451. {/block:NotReblog}
  452. </div>
  453. <hr style="margin-bottom:0;">
  454. <div class="sidebox-words">
  455. {block:Photo}{block:Caption}<div class="captions-p">{Caption}</div>{block:HasTags}<hr>{/block:HasTags}{/block:Caption}{/block:Photo}
  456. {block:Photoset}{block:Caption}<div class="captions-p">{Caption}</div>{block:HasTags}<hr>{/block:HasTags}{/block:Caption}{/block:Photoset}
  457. {block:Audio}<center><span {block:TrackName}style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br><span {block:Artist}style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist} &mdash; <span {block:Album}style="display:none;"{/block:Album}>Unknown</span>{block:Album}{Album}{/block:Album}</center>{block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}{block:Caption}<hr><div class="captions-p">{Caption}</div>{/block:Caption}{/block:Audio}
  458. {block:Video}{block:Caption}<div class="captions-p">{Caption}</div>{block:HasTags}<hr>{/block:HasTags}{/block:Caption}{/block:Video}
  459. {block:HasTags}<div class="tags">{block:Tags}<a href="/tagged/{Tag}">#{Tag}</a> &nbsp; {/block:Tags}</div>{/block:HasTags}
  460. </div>
  461. </div>
  462. <div class="footer">
  463. <hr>
  464. <div class="liker">{LikeButton size="14"}<span class="my_button"><i class="ion-android-favorite-outline"></i></span></div>
  465. <span class="timeago"><a href="{Permalink}" target="_blank">{block:NotReblog}Posted {/block:NotReblog}{block:RebloggedFrom}Reblogged {block:RebloggedFrom} at {12Hour}:{Minutes}{AmPm} <br>on {Month} {DayOfMonth}{DayOfMonthSuffix}</a></span>
  466. <span class="reblogger"><a href="{ReblogURL}" target="_blank"><i class="ion-ios-loop-strong"></i></a></span>
  467. </div>
  468. </div>
  469. </div>
  470.  
  471. </article>{/block:IndexPage}
  472. {block:ContentSource}<!-- {SourceURL}
  473. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  474. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  475. {/block:ContentSource}
  476. {block:PermalinkPage}
  477. <div class="post">
  478. {block:PermalinkPagination}
  479. {block:NextPost}<div id="newer-post">
  480. <a href="{NextPost}"><i class="fa fa-angle-left"></i></a>
  481. </div>{/block:NextPost}
  482. {block:PreviousPost}<div id="older-post">
  483. <a href="{PreviousPost}"><i class="fa fa-angle-right"></i></a>
  484. </div>{/block:PreviousPost}
  485. {/block:PermalinkPagination}
  486. {block:Text}
  487. <div class="text-post text-based">
  488. {block:Title}<h2>{Title}</h2>{/block:Title}
  489. {Body}
  490. </div>
  491. {/block:Text}{block:Photo}
  492. <div class="photo-p">
  493. <div class="photo-box" style="background-image:url('{PhotoURL-500}');background-size:contain;"></div>
  494. </div>
  495. {/block:Photo}{block:Photoset}
  496. <div class="slideshow">
  497. {block:Photos}<div class="photoset-box" style="background-image:url('{PhotoURL-500}');background-size:contain;"></div>{/block:Photos}
  498. </div>
  499. {/block:Photoset}{block:Quote}
  500. <div class="q-bg"><i class="fa fa-quote-left"></i></div>
  501. <div class="quote-post text-based">
  502. <h2><span style="color:{color:Accent};">❝</span> {Quote} <span style="color:{color:Accent};">❞</span></h2>
  503. {block:Source}<cite>-&nbsp;{Source}</cite>{/block:Source}
  504. </div>
  505. {/block:Quote}{block:Link}
  506. <div class="l-bg"><i class="fa fa-link"></i></div>
  507. <div class="link-post text-based">
  508. <h2><a href="{URL}" {Target}>{Name} &nbsp;<i class="fa fa-angle-right"></i></a></h2>
  509. {block:Description}{Description}{/block:Description}
  510. </div>
  511. {/block:Link}{block:Chat}
  512. <div class="c-bg"><i class="fa fa-comments"></i></div>
  513. <div class="chat-post text-based">
  514. {block:Title}<h2>{Title}</h2>{/block:Title}
  515. <ul class="chat-list">
  516. {block:Lines}<li class="{Alt}">{block:Label}<span class="label">{Label}</span> {/block:Label}{Line}</li>{/block:Lines}
  517. </ul>
  518. </div>
  519. {/block:Chat}{block:Audio}
  520. <div class="album-box" style="background-image:url('http://static.tumblr.com/yxfeliq/C5Xnysfnk/cd.jpg');{block:AlbumArt}background-image:url('{AlbumArtURL}');{/block:AlbumArt}background-size:contain;"></div>
  521. {/block:Audio}{block:Video}
  522. <div class="video-box">
  523. <div class="video">{Video-500}</div>
  524. </div>
  525. {/block:Video}{block:Answer}
  526. <div class="a-bg"><i class="fa fa-question"></i></div>
  527. <div class="answer-post text-based">
  528. <span style="{color:Accent}; font-weight:bold;">Q:</span> {Question}
  529. <br><i style="float:right">&mdash; {Asker}</i>
  530. <br><div class="responses"><span style="{color:Accent}; font-weight:bold">A:</span> {Replies}</div>
  531. </div>
  532. {/block:Answer}
  533. {block:Date}<div class="sidebox">
  534. <div class="via">
  535. {block:RebloggedFrom}<img src="{ReblogRootPortraitURL-40}">
  536. <span class="linked"><a href="{ReblogRootURL}">{ReblogRootName}</a>
  537. <br>(via <a href="{ReblogParentURL}" target="_bank">{ReblogParentName}</a>)</span>{/block:RebloggedFrom}
  538. {block:NotReblog}<img src="{PortraitURL-40}">
  539. <span class="linked"><a href="/" style="position: relative;top: -5px;">{Name}</a><br></span>
  540. {/block:NotReblog}
  541. </div>
  542. <hr style="margin-bottom:0;">
  543. <div class="sidebar-words">
  544. {block:Photo}{block:Caption}<div class="captions-p">{Caption}</div><hr>{/block:Caption}{/block:Photo}
  545. {block:Photoset}{block:Caption}<div class="captions-p">{Caption}</div><hr>{/block:Caption}{/block:Photoset}
  546. {block:Audio}<center><span {block:TrackName}style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br><span {block:Artist}style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist} &mdash; <span {block:Album}style="display:none;"{/block:Album}>Unknown</span>{block:Album}{Album}{/block:Album}</center>{block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}{block:Caption}<hr><div class="captions-p">{Caption}</div><hr>{/block:Caption}{/block:Audio}
  547. {block:Video}{block:Caption}<div class="captions-p">{Caption}</div><hr>{/block:Caption}{/block:Video}
  548. {block:HasTags}<div class="tags">{block:Tags}<a href="/tagged/{Tag}">#{Tag}</a> &nbsp; {/block:Tags}</div><hr>{/block:HasTags}
  549. {block:PostNotes}<div id="notes">{PostNotes-16}</div>{/block:PostNotes}
  550. </div>
  551. </div>
  552. <div class="footer">
  553. <hr>
  554. <div class="liker">{LikeButton size="14"}<span class="my_button"><i class="ion-android-favorite-outline"></i></span></div>
  555. <span class="timeago"><a href="{Permalink}">{block:NotReblog}Posted {/block:NotReblog}{block:RebloggedFrom}Reblogged {block:RebloggedFrom} at {12Hour}:{Minutes}{AmPm} <br>on {Month} {DayOfMonth}{DayOfMonthSuffix}</a></span>
  556. <span class="reblogger"><a href="{ReblogURL}" taget="_blank"><i class="ion-ios-loop-strong"></i></a></span>
  557. </div>{/block:Date}
  558. </div>
  559. </div>
  560. {/block:PermalinkPage}
  561. {/block:Posts}
  562. {block:IfRelatedPosts}{block:RelatedPosts}<section id="related">
  563. <h1>Related Posts</h1>
  564. {block:Posts}
  565. <article{block:Text} class="t-b"{/block:Text}{block:Quote} class="t-b"{/block:Quote}{block:Link} class="t-b"{/block:Link}{block:Chat} class="t-b"{/block:Chat}{block:Answer} class="t-b"{/block:Answer}>
  566. <a href="{Permalink}"><div class="masker"></div></a>
  567. {block:Text}<div class="text-post text-based">
  568. {block:Title}<h2>{Title}</h2>{/block:Title}
  569. {Body}
  570. </div>{/block:Text}{block:Photo}
  571. <div class="photo-post" style="background-image:url('{PhotoURL-500}');">
  572. </div>{/block:Photo}{block:Photoset}
  573. <div class="photoset-post">
  574. <div class="photos">
  575. {block:Photos}
  576. <div class="photoset" style="background-image:url('{PhotoURL-500}');"></div>
  577. {/block:Photos}
  578. </div>
  579. <div class="audio-button"><i class="ion-images"></i></div>
  580. </div>{/block:Photoset}{block:Quote}
  581. <div class="q-bg"><i class="fa fa-quote-left"></i></div>
  582. <div class="quote-post text-based">
  583. <h2><span style="color:{color:Accent};">❝</span> {Quote} <span style="color:{color:Accent};">❞</span></h2>
  584. {block:Source}<cite>-&nbsp;{Source}</cite>{/block:Source}
  585. </div>{/block:Quote}{block:Link}
  586. <div class="l-bg"><i class="fa fa-link"></i></div>
  587. <div class="link-post text-based">
  588. <h2><a href="{URL}" {Target}>{Name} &nbsp;<i class="fa fa-angle-right"></i></a></h2>
  589. {block:Description}{Description}{/block:Description}
  590. </div>{/block:Link}{block:Chat}
  591. <div class="c-bg"><i class="fa fa-comments"></i></div>
  592. <div class="chat-post text-based">
  593. {block:Title}<h2>{Title}</h2>{/block:Title}
  594. <ul class="chat-list">
  595. {block:Lines}
  596. <li class="{Alt}">
  597. {block:Label}<span class="label">{Label}</span>{/block:Label}
  598. {Line}</li>
  599. {/block:Lines}
  600. </ul>
  601. </div>{/block:Chat}{block:Audio}
  602. <div class="audio">
  603. <div class="albumart" style="background-image:url('http://static.tumblr.com/yxfeliq/C5Xnysfnk/cd.jpg');{block:AlbumArt}background-image:url('{AlbumArtURL}');{/block:AlbumArt}"></div>
  604. <div class="audio-button"><i class="ion-ios-musical-notes"></i></div>{/block:Audio}{block:Video}
  605. <div class="video-post">
  606. <div class="albumart" style="background-image:url('http://static.tumblr.com/yxfeliq/uWknysfvj/video_icon_0.png');{block:VideoThumbnail}background-image:url('{VideoThumbnailURL}');{/block:VideoThumbnail}"></div>
  607. <div class="audio-button"><i class="ion-ios-videocam-outline"></i></div>
  608. </div>{/block:Video}{block:Answer}
  609. <div class="a-bg"><i class="fa fa-question"></i></div>
  610. <div class="answer-post text-based">
  611. <span style="{color:Accent}; font-weight:bold;">Q:</span> {Question}
  612. <br><i style="float:right">&mdash; {Asker}</i>
  613. <br><div class="responses"><span style="{color:Accent}; font-weight:bold">A:</span> {Replies}</div>
  614. </div>{/block:Answer}
  615. </article>
  616. {/block:Posts}
  617. </section>{/block:RelatedPosts}{/block:IfRelatedPosts}
  618. </div><!--end posts-->
  619. {block:IfManualLoad}{block:IndexPage}
  620. <div id="load-more">
  621. <div id="spin"></div>
  622. <div id="words">Load More</div>
  623. </div>
  624. {/block:IndexPage}{/block:IfManualLoad}
  625. </div><!--end wrapper-->
  626.  
  627. {block:Pagination}
  628. <div class="pagination" {block:IfInfiniteScroll}style="visibility:hidden;"{/block:IfInfiniteScroll}>
  629. {block:PreviousPage}<a href="{PreviousPage}" id="prev-link"><i class="fa fa-angle-left"></i></a>{/block:PreviousPage}
  630. <span id="pagecount">{CurrentPage} / {TotalPages}</span>
  631. {block:NextPage}<a href="{NextPage}" id="next-link"><i class="fa fa-angle-right"></i></a>{/block:NextPage}
  632. </div>
  633. {/block:Pagination}
  634. {block:IndexPage}
  635. <script type="text/javascript" src="http://static.tumblr.com/yxfeliq/Lldnysg3a/jquery.cycle.all.js"></script>
  636. <script src="http://static.tumblr.com/yxfeliq/V5Dnspn2w/jquery.colorbox-min.js"></script>
  637. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>{/block:IndexPage}
  638. {block:IfInfiniteScroll}<script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>{/block:IfInfiniteScroll}
  639. <script src="http://static.tumblr.com/yxfeliq/RSoo1o2ai/false-promises.script.js"></script>
  640. <script>
  641. {block:IfManualLoad}
  642. $(document).ready(function(){
  643. $('#load-more').click(function() {
  644. $('#words').text('Loading')
  645. $(this).addClass('roll');
  646. });
  647. });{/block:IfManualLoad}
  648. {block:IndexPage}
  649. (function () {
  650. var $tumblelog = $('#posts');
  651. $tumblelog.masonry({
  652. itemSelector: 'article',
  653. isAnimated:true,
  654. columnWidth:292,
  655. gutterWidth:30,
  656. });
  657. {block:IfInfiniteScroll}
  658. $tumblelog.infinitescroll({
  659. navSelector : "div.pagination",
  660. nextSelector : ".pagination a#next-link",
  661. itemSelector : "article",
  662. loading: {
  663. finishedMsg: "NO MORE",
  664. img : null,
  665. msg: "Loading",
  666. msgText: "Loading",
  667. {block:IfManualLoad}
  668. finished: function() {
  669. $('#load-more').removeClass('roll');
  670. $('#words').text('Load More');
  671. },
  672. {/block:IfManualLoad}
  673. },
  674. {block:IfManualLoad}
  675. errorCallback: function() {
  676. $('#load-more').removeClass('roll');
  677. $('#words').text('No More');
  678. },
  679. {/block:IfManualLoad}
  680. },
  681. function( newElements ) {
  682. var $newElems = $(newElements)
  683. var $newElemsIDs = $newElems.map(function () {
  684. return this.id;
  685. }).get();
  686. $newElems.hide();
  687. $tumblelog.masonry( 'appended', $newElems, {
  688. isAnimated: true,
  689. animationOptions: {
  690. duration: 250,
  691. easing: 'linear',
  692. queue: false
  693. }
  694. },
  695. function(){
  696. $newElems.fadeIn('slow');
  697. });
  698. $(newElements).find(".group1").colorbox({
  699. rel:'group1',
  700. innerWidth:'890px',
  701. innerHeight: '540px',
  702. current:'',
  703. previous: "<i class='fa fa-angle-left'></i>",
  704. next: "<i class='fa fa-angle-right'></i>",
  705. close:'&#10005;',
  706. overlayClose:false,
  707. fixed:true,
  708. opacity:'0.75',
  709. scrolling:false,
  710. loop:false,
  711. });
  712. $(newElements).find(".inline").colorbox({
  713. inline:true,
  714. });
  715. $(newElements).find('.slideshow').cycle('fade');
  716. console.log($newElems,$newElemsIDs);
  717. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  718. });
  719. {block:IfManualLoad}
  720. $tumblelog.infinitescroll('unbind');
  721. $('#load-more').on('click', function(e) {
  722. e.preventDefault();
  723. $tumblelog.infinitescroll('retrieve');
  724. });
  725. {/block:IfManualLoad}
  726. {/block:IfInfiniteScroll}
  727. })();
  728. {/block:IndexPage}
  729. </script>
  730. <div style="display:none;"><script language="JavaScript">var fhs = document.createElement('script');var fhs_id = "5208111";
  731. var ref = (''+document.referrer+'');var pn = window.location;var w_h = window.screen.width + " x " + window.screen.height;
  732. fhs.src = "http://freehostedscripts.net/ocounter.php?site="+fhs_id+"&e1=&e2=&r="+ref+"&wh="+w_h+"&a=1&pn="+pn+"";
  733. document.head.appendChild(fhs);document.write("<span id='o_"+fhs_id+"'></span>");
  734. </script></div>
  735.  
  736. </body>
  737. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement