API tools faq
paste
elshel

Niall Horan ! theme (vertical)

elshel
Jun 25th, 2014
367
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.58 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--------NIALL HORAN !---------
  6. MADE BY irrelevantdivision.tumblr.com
  7. --------------------------------
  8. last update (m/d/y): 12/14/14
  9.  
  10. rules of usage:
  11. -DO NOT REMOVE CREDIT
  12. -DO NOT USE AS A BASE, THEN CLAIM AS YOUR OWN
  13. -DO NOT REDISTRIBUTE
  14.  
  15. JUST DON'T BECAUSE I WILL FIND YOU BUT THE COPS WON'T FIND YOUR BODY
  16. THANKS
  17. ------------------------------->
  18.  
  19. <title>{Title}</title>
  20. <link rel="shortcut icon" href="{Favicon}">
  21. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  22. <meta name="description" content="" />
  23. <meta http-equiv="x-dns-prefetch-control" content="off"/>
  24.  
  25. <link href='http://fonts.googleapis.com/css?family=Roboto+Condensed:300italic,300' rel='stylesheet' type='text/css'>
  26. <link href="//fonts.googleapis.com/css?family=Pacifico:400" rel="stylesheet" type="text/css">
  27.  
  28. <meta name="if:Always Show Description" content="0"/>
  29. <meta name="if:Show Note Count" content="0"/>
  30. <meta name="if:Show Reblog Link" content="1"/>
  31. <meta name="if:Uppercase" content="1"/>
  32.  
  33. <meta name="text:Title Font" content="Pacifico"/>
  34. <meta name="color:Main Color" content="#000"/>
  35. <meta name="color:Main Color 2" content="#fff"/>
  36. <meta name="color:Accent 1" content="#e1612f"/>
  37. <meta name="color:Accent 2" content="#00af16"/>
  38.  
  39. <meta name="image:Header Image" content="https://31.media.tumblr.com/b59f4399921919269767824eb4a00ff8/tumblr_n7i9sdxRZf1rm1fjeo2_r3_250.png"/>
  40.  
  41. <meta name="text:Link 1 URL" content="http://"/>
  42. <meta name="text:Link 1 Name" content=""/>
  43. <meta name="text:Link 2 URL" content="http://"/>
  44. <meta name="text:Link 2 Name" content=""/>
  45. <meta name="text:Link 3 URL" content="http://"/>
  46. <meta name="text:Link 3 Name" content=""/>
  47. <meta name="text:Link 4 URL" content="http://"/>
  48. <meta name="text:Link 4 Name" content=""/>
  49.  
  50. <style>
  51.  
  52. @font-face {
  53. font-family: "never let go";
  54. src: url("http://static.tumblr.com/idxyunh/jnnnd499f/neverletgo.ttf");
  55. }
  56. body {
  57. font-family: arial;
  58. }
  59. a {
  60. text-decoration: none;
  61. color: {color:Accent 1};
  62. -moz-transition-duration: 0.6s;
  63. -o-transition-duration: 0.6s;
  64. -webkit-transition-duration: 0.6s;
  65. transition-duration: 0.6s;
  66. }
  67. a:hover {
  68. color: {color:Accent 2};
  69. -moz-transition-duration: 0.6s;
  70. -o-transition-duration: 0.6s;
  71. -webkit-transition-duration: 0.6s;
  72. transition-duration: 0.6s;
  73. }
  74. .sidebar {
  75. width: 100%;
  76. height: 200px;
  77. background-color: {color:Main Color};
  78. position: fixed;
  79. z-index: 100;
  80. top: 0;
  81. left: 0;
  82. }
  83. .sidebar img {
  84. width: auto;
  85. max-height: 200px;
  86. position: fixed;
  87. z-index: 100;
  88. top: 0;
  89. left: 200px;
  90. }
  91. .title {
  92. font-family: "never let go", {text:Title Font};
  93. font-size: 72px;
  94. color: {color:Main Color};
  95. top: 172px;
  96. padding-left: 440px;
  97. position: fixed;
  98. z-index: 102;
  99. }
  100. /*BLOG INFO*/
  101. .desc {
  102. {block:ifNotAlwaysShowDescription}opacity: 0;{/block:ifNotAlwaysShowDescription}
  103. width: 450px;
  104. margin: 80px 460px;
  105. font-size: 10px;
  106. letter-spacing: +1px;
  107. text-align: justify;
  108. color: {color:Main Color 2};
  109. position: fixed;
  110. z-index: 100;
  111. -moz-transition-duration: 0.7s;
  112. -o-transition-duration: 0.7s;
  113. -webkit-transition-duration: 0.7s;
  114. transition-duration: 0.7s;
  115. }
  116. .mainlinks {
  117. font-size: 10px;
  118. }
  119. {block:ifNotAlwaysShowDescription}
  120. .desc:hover {
  121. opacity: 1;
  122. -moz-transition-duration: 0.4s;
  123. -o-transition-duration: 0.4s;
  124. -webkit-transition-duration: 0.4s;
  125. transition-duration: 0.4s;
  126. }
  127. {/block:ifNotAlwaysShowDescription}
  128. .container {
  129. margin-top: 260px;
  130. }
  131. .posts {
  132. width: 500px;
  133. border-bottom: solid 2px {color:Main Color};
  134. position: relative;
  135. margin-left: auto;
  136. margin-right: auto;
  137. margin-bottom: 5px;
  138. padding: 5px 15px;
  139. letter-spacing: +1px;
  140. font-size: 10px;
  141. }
  142. .posts li {
  143. list-style: circle;
  144. }
  145. .posts img {
  146. margin: auto;
  147. }
  148. .posts blockquote {
  149. border-left: 2px solid {color:Accent 2};
  150. padding-left: 6px;
  151. }
  152. .posts img, .posts li, .posts blockquote {max-width: 100%;}
  153. /*DATE/TIME*/
  154. .date {
  155. opacity: 0.7;
  156. font-size: 10px;
  157. margin-bottom: 6px;
  158. margin-top: 2px;
  159. text-align: center;
  160. {block:ifUppercase}text-transform: uppercase;{/block:ifUppercase}
  161. }
  162. /*NAVIGATION*/
  163. .minicon {
  164. width: 500px;
  165. margin: 0 auto 10px auto;
  166. }
  167. .navigation {
  168. font-size: 10px;
  169. position: relative;
  170. text-align: center;
  171. }
  172. .current_page {
  173. color: {color:Accent 2};
  174. background-color: {color:Main Color 2};
  175. border: solid 1px {color:Accent 2};
  176. margin: 0 -1px;
  177. padding: 1px 5px 1px 6px;
  178. }
  179. .jump_page {
  180. color: {color:Main Color 2};
  181. background-color: {color:Accent 2};
  182. border: solid 1px {color:Accent 2};
  183. margin: 0 -1px;
  184. padding: 1px 5px 1px 6px;
  185. -moz-transition-duration: 0.4s;
  186. -o-transition-duration: 0.4s;
  187. -webkit-transition-duration: 0.4s;
  188. transition-duration: 0.4s;
  189. }
  190. .jump_page:hover {
  191. color: {color:Accent 2};
  192. background-color: {color:Main Color 2};
  193. -moz-transition-duration: 0.4s;
  194. -o-transition-duration: 0.4s;
  195. -webkit-transition-duration: 0.4s;
  196. transition-duration: 0.4s;
  197. }
  198. .next {
  199. border: solid 1px {color:Accent 1};
  200. padding: 0 10px;
  201. margin: 0 50px;
  202. }
  203. .next:hover {
  204. border: solid 1px {color:Accent 2};
  205. }
  206. /*PHOTO*/
  207. .photo img {
  208. max-width: 100%;
  209. margin: auto;
  210. }
  211. /*QUOTE*/
  212. .quotetext_short {
  213. font-size: 28px;
  214. font-style: italic;
  215. margin-bottom: 8px;
  216. }
  217. .quotetext_medium {
  218. font-size: 24px;
  219. font-style: italic;
  220. margin-bottom: 8px;
  221. }
  222. .quotetext_long {
  223. font-size: 18px;
  224. font-style: italic;
  225. margin-bottom: 8px;
  226. }
  227. .source {
  228. text-align: right;
  229. }
  230. /*ASKS*/
  231. .question {
  232. border-top: {color:Accent 2} solid 6px;
  233. border-bottom: {color:Accent 1} solid 6px;
  234. }
  235. #asker {
  236. font-style: italic;
  237. }
  238. /*LINKS*/
  239. h2 {
  240. font-size: 13px;
  241. text-align: center;
  242. padding: 6px 0;
  243. border-top: {color:Accent 2} solid 6px;
  244. border-bottom: {color:Accent 1} solid 6px;
  245. }
  246. h2 a {
  247. {block:ifUppercase}text-transform: uppercase;{/block:ifUppercase}
  248. color: {color:Main Color};
  249. }
  250. /*AUDIO*/
  251. .cover {
  252. width: 125px;
  253. position: relative;
  254. z-index: 1;
  255. margin-top: 3px;
  256. }
  257. .playbox {
  258. background-color: #000;
  259. overflow: hidden;
  260. position: absolute;
  261. z-index: 10;
  262. margin-top: 34px;
  263. margin-left: 33px;
  264. opacity: 0.7;
  265. -moz-transition-duration: 0.6s;
  266. -o-transition-duration: 0.6s;
  267. -webkit-transition-duration: 0.6s;
  268. transition-duration: 0.6s;
  269. }
  270. .playbox:hover {
  271. opacity: 0.9;
  272. -moz-transition-duration: 0.7s;
  273. -o-transition-duration: 0.7s;
  274. -webkit-transition-duration: 0.7s;
  275. transition-duration: 0.7s;
  276. }
  277. .playbutton {
  278. width: 20px;
  279. overflow: hidden;
  280. position: relative;
  281. z-index: 10;
  282. margin: 15px 23px 13px 16px;
  283. }
  284. .audioinfo {
  285. font-size: 10px;
  286. text-align: center;
  287. max-width: 350px;
  288. top: -97px;
  289. left: 150px;
  290. position: relative;
  291. z-index: 11;
  292. border-top: {color:Accent 2} solid 6px;
  293. border-bottom: {color:Accent 1} solid 6px;
  294. }
  295. .song {
  296. font-size:13px;
  297. {block:ifUppercase}text-transform: uppercase;{/block:ifUppercase}
  298. padding-top: 2px;
  299. }
  300. .album {
  301. font-size: 7px;
  302. {block:ifUppercase}text-transform: uppercase;{/block:ifUppercase}
  303. padding-bottom: 2px;
  304. }
  305. /*TAGS*/
  306. .tags {
  307. position: relative;
  308. margin-bottom: 35px;
  309. text-align: center;
  310. {block:ifUppercase}text-transform: uppercase;{/block:ifUppercase}
  311. font-size: 8px;
  312. }
  313. .tags a {
  314. color: {color:Main Color};
  315. padding: 0 4px;
  316. -moz-transition-duration: 0.4s;
  317. -o-transition-duration: 0.4s;
  318. -webkit-transition-duration: 0.4s;
  319. transition-duration: 0.4s;
  320. }
  321. .tags a:nth-child(odd):hover {
  322. color: {color:Accent 2};
  323. -moz-transition-duration: 0.4s;
  324. -o-transition-duration: 0.4s;
  325. -webkit-transition-duration: 0.4s;
  326. transition-duration: 0.4s;
  327. }
  328. .tags a:nth-child(even):hover {
  329. color: {color:Accent 1};
  330. -moz-transition-duration: 0.4s;
  331. -o-transition-duration: 0.4s;
  332. -webkit-transition-duration: 0.4s;
  333. transition-duration: 0.4s;
  334. }
  335. /*POST NOTES*/
  336. .postnotes ol {
  337. list-style: none;
  338. font-size: 10px;
  339. font-family: arial;
  340. max-width: 500px;
  341. margin: 0 auto;
  342. }
  343. /*SCROLLBAR*/
  344. ::-webkit-scrollbar-thumb:vertical {background-color: #fff; height: 10px;}
  345. ::-webkit-scrollbar-thumb:horizontal {background-color: #fff; height:10px!important;}
  346. ::-webkit-scrollbar {background-color: #000; height:8px; width:5px;}
  347.  
  348. iframe#tumblr_controls {-webkit-transition: opacity 0.7s linear;opacity: 1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out; right:3px !important; position: fixed !important;}
  349. /* Custom CSS */
  350. {CustomCSS}
  351. </style>
  352. </head>
  353.  
  354.  
  355. <body>
  356.  
  357. <div class="sidebar">
  358.  
  359. <div class="title">{Title}</div>
  360. <div class="desc">{Description}<br /><br />
  361. <span class="mainlinks"><a href="/">home</a>
  362. {block:AskEnabled} - <a href="/ask">ask</a>{/block:AskEnabled}
  363. - <a href="/archive">archive</a>
  364. {block:SubmissionsEnabled} - <a href="/submit">submit</a>{/block:SubmissionsEnabled}
  365. {block:ifLink1Name} - <a href="{text:Link 1 URL}">{text:Link 1 Name}</a>{/block:ifLink1Name}
  366. {block:ifLink2Name} - <a href="{text:Link 2 URL}">{text:Link 2 Name}</a>{/block:ifLink2Name}
  367. {block:ifLink3Name} - <a href="{text:Link 3 URL}">{text:Link 3 Name}</a>{/block:ifLink3Name}
  368. {block:ifLink4Name} - <a href="{text:Link 4 URL}">{text:Link 4 Name}</a>{/block:ifLink4Name}
  369. {block:ifLink5Name} - <a href="{text:Link 5 URL}">{text:Link 5 Name}</a>{/block:ifLink5Name}
  370. - <a href="http://irrelevantdivision.tumblr.com">&copy;</a>
  371. </span>
  372. </div>
  373.  
  374. <a href="/"><img src="{image:Header Image}"></a>
  375.  
  376. </div>
  377.  
  378. <div class="container">
  379. {block:Posts}
  380. <div class="posts">
  381. <div class="date">{block:Date}<a href="{Permalink}">{MonthNumberWithZero}.{DayOfMonth}.{ShortYear}</a> - <a href="{Permalink}">{24Hour}:{Minutes}{CapitalAmPm}</a>{/block:Date}
  382. {block:ifShowNoteCount} - <a href="{Permalink}">{block:NoteCount}{NoteCount}{/block:NoteCount} </a>{/block:ifShowNoteCount}
  383. {block:ifShowReblogLink} - <a href="{ReblogURL}" target="_blank" class="details">reblog</a>{/block:ifShowReblogLink}
  384. </div>
  385.  
  386. {block:Text}
  387. {block:Title}{Title}{/block:Title}
  388. {Body}
  389. {/block:Text}
  390.  
  391. {block:Quote}
  392. <div class="quote">
  393. <div class="quotetext_{Length}">"{Quote}"</div>
  394. {block:Source}<div class="source">- {Source}</div>{/block:Source}
  395. </div>
  396. {/block:Quote}
  397.  
  398. {block:Link}
  399. <h2><a class="link" href="{LinkURL}">{Name}</a></h2>
  400. {block:Description}{Description}{/block:Description}
  401. {/block:Link}
  402.  
  403. {block:Chat}
  404. {block:Title}{Title}{/block:Title}
  405. <ul>{block:Lines}
  406. <li>{block:Label}{Label}{/block:Label}
  407. {Line}</li>
  408. {/block:Lines}
  409. </ul>
  410. {/block:Chat}
  411.  
  412. {block:Answer}
  413. <div class="question">
  414. <table style="padding-bottom:5px; padding-top: 5px; margin-left:3px;">
  415. <tr>
  416. <td style="vertical-align:top; padding-right:10px; width:64px; height: auto;"><img src="{AskerPortraitURL-48}"></td>
  417. <td style="vertical-align:top;"><span id="asker"><strong>{Asker} asked:</strong> {Question}</span></td>
  418. </tr>
  419. </table>
  420. </div>
  421. {Answer}
  422. {/block:Answer}
  423.  
  424. <div class="photo">
  425. {block:Photo}{LinkOpenTag}
  426. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  427. {LinkCloseTag}
  428. {/block:Photo}
  429. </div>
  430.  
  431. {block:Photoset}
  432. {Photoset-500}
  433. {/block:Photoset}
  434.  
  435. {block:Video}
  436. {Video-500}
  437. {/block:Video}
  438.  
  439. {block:Panorama}
  440. {LinkOpenTag}<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}" />{LinkCloseTag}
  441. {block:Caption}{Caption}{/block:Caption}
  442. {/block:Panorama}
  443.  
  444.  
  445. {block:AudioPlayer}<div class="playbox"><div class="playbutton">{AudioPlayerBlack}</div></div>
  446. {block:AlbumArt}
  447. <img src="{AlbumArtURL}" class="cover">
  448. {/block:AlbumArt}
  449.  
  450. <div class="audioinfo">
  451. <span class="song"><strong>{block:TrackName}{TrackName}{/block:TrackName}</strong></span><br />
  452. <div class="album">
  453. {block:Album}{Album}-{/block:Album} {block:Artist}{Artist}-{/block:Artist} {block:PlayCount}{PlayCount}{/block:PlayCount}
  454. </div>
  455. </div>
  456. {/block:AudioPlayer}
  457. {block:Caption}{Caption}{/block:Caption}
  458.  
  459. </div>
  460. <div class="tags">
  461. {block:HasTags}
  462. {block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}
  463. {/block:HasTags}
  464. </div>
  465.  
  466. <div class="postnotes">{block:PostNotes}{PostNotes}{/block:PostNotes}</div>
  467.  
  468. {/block:Posts}
  469. <div class="minicon">
  470. <div class="navigation">
  471. {block:Pagination}{block:PreviousPage}
  472. <a class="next" href="{PreviousPage}">Back</a>
  473. {/block:PreviousPage}
  474. {block:JumpPagination length="5"}{block:CurrentPage}
  475. <span class="current_page">{PageNumber}</span>
  476. {/block:CurrentPage}{block:JumpPage}
  477. <a class="jump_page" href="{URL}">{PageNumber}</a>
  478. {/block:JumpPage}{/block:JumpPagination}{block:NextPage}
  479. <a class="next" href="{NextPage}">Next</a>
  480. {/block:NextPage}{/block:Pagination}
  481. </div>
  482. </div>
  483. </div>
  484.  
  485.  
  486.  
  487.  
  488.  
  489.  
  490. </body>
  491. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!