API tools faq
paste
Advertisement
thewisepotato

Cities Tumblr Theme

thewisepotato
Jul 14th, 2014
831
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.40 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <title> {Title} {block:TagPage}| Posts tagged {Tag}{/block:TagPage}{block:PostSummary}| {PostSummary}{/block:PostSummary}</title>
  6. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  7. <link rel="shortcut icon" href="{Favicon}"/>
  8.  
  9. <meta name="color:Background" content="#ffffff"/>
  10. <meta name="color:Accent" content="#cdcdcd"/>
  11. <meta name="color:Sidebar BG 1" content="#000000"/>
  12. <meta name="color:Sidebar BG 2" content="#222222"/>
  13. <meta name="color:Sidebar Text" content="#ffffff"/>
  14.  
  15. <meta name="color:Post BG 1" content="#111111"/>
  16. <meta name="color:Post BG 2" content="#222222"/>
  17. <meta name="color:Post Text" content="#ffffff"/>
  18.  
  19. <meta name="image:Background" content=""/>
  20. <meta name="image:Default Album Art" content="http://cdn.last.fm/flatness/responsive/2/noimage/default_album_300_g4.png"/>
  21. <meta name="image:Sidebar" content=""/>
  22.  
  23. <meta name="if:Wide Posts" content="0"/>
  24. <meta name="if:Infinite Scroll" content="0"/>
  25. <meta name="if:Open Full Size Images" content="1"/>
  26. <meta name="if:Show Tags On Hover" content="1"/>
  27. <meta name="if:Stretch Background" content="0"/>
  28.  
  29. <meta name="text:Menu Description" content=""/>
  30. <meta name="text:Menu Title" content=""/>
  31.  
  32. {block:ifInfiniteScroll}
  33. <script type="text/javascript" src="http://static.tumblr.com/q0etgkr/EIBmz7s0p/infinitescrolling.js"></script>
  34. {/block:ifInfiniteScroll}
  35.  
  36. <link href='http://fonts.googleapis.com/css?family=Lato:300|Lato:400' rel='stylesheet' type='text/css'>
  37.  
  38. <script type="text/javascript"
  39. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  40. <script>
  41. $(document).ready(function() {
  42. $('a.poplight[href^=#]').click(function() {
  43. var popID = $(this).attr('rel'); //Get Popup Name
  44. var popURL = $(this).attr('href'); //Get Popup href to define size
  45. var query= popURL.split('?');
  46. var dim= query[1].split('&');
  47. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  48. //.fadeIn()
  49. $('#' + popID).css({ 'width': Number( popWidth ), 'left':0 }).prepend('<a href="#" class="close"><img src="http://static.tumblr.com/puls2hm/pgfn8p9ok/close.png" class="btn_close" title="Close Window" alt="Close" style="background-color: transparent; padding: 2px; color:#555;" /></a>');
  50. $('body').append('<div id="fade"></div>');
  51. $('#info div').css('height',$('#info').outerHeight() - 115+'px');
  52. var spad = (($(window).height() * 0.07) - 20) /2;
  53. $('#menu form').css('padding',spad+'px 5px')
  54. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  55. return false;
  56. });
  57. $('a.close, #fade').live('click', function() {
  58. $('.popup_block').css('left','-250px');
  59. $('#fade').fadeOut(function() {
  60. $('#fade, a.close').remove(); //fade them both out
  61. });
  62. return false;
  63. });
  64. $(window).resize(function(){
  65. var mdh = $('#info').outerHeight() - 115;
  66. $('#info div').css('height',mdh+'px');
  67. });
  68. });
  69. </script>
  70.  
  71. <style type="text/css">
  72.  
  73. * {-webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease; font-family:Lato; font-weight:300;}
  74.  
  75. body {background:{color:Background} url({image:Background}) fixed; {block:ifStretchBackground}background-size:100% 100%;{/block:ifStretchBackground}}
  76.  
  77. a {text-decoration:none; color:inherit;}
  78.  
  79. a:hover {color:{color:Accent};}
  80.  
  81. b, strong {font-weight:initial;}
  82.  
  83. h2 {font-family:sans-serif; font-weight:lighter; text-transform:uppercase;}
  84.  
  85. #side {position:fixed; bottom:0; left:100px; height:100%; width:150px; background:{color:Sidebar BG 2}; z-index:-1;}
  86.  
  87. #side img:first-child {height:49%; width:150px;}
  88.  
  89. #side div {color:{color:Sidebar Text}; padding:0 10px; height:51%; overflow:auto; width:130px;}
  90.  
  91. #nav {position:fixed; top:0; left:0; height:100%; width:100px; background:{color:Sidebar BG 1}; vertical-align:middle;}
  92.  
  93. #nav a {display:block; height:50px; width:50px; border:solid 2px rgba({RGBcolor:Sidebar Text},0.5); border-radius:200%; text-align:center; font-weight:lighter; margin:23px; background:transparent center center no-repeat;}
  94.  
  95. #nav a:hover {background-color:{color:Sidebar Text};}
  96.  
  97. #nav a + span {display:block; border:solid {color:Sidebar Text}; border-width:1px 0; position:fixed; bottom:60px; left:0; width:90px; padding:10px 5px; z-index:999; text-align:center; text-transform:uppercase; background:{color:Sidebar BG 1}; opacity:0; color:{color:Sidebar Text};}
  98.  
  99. #nav a:hover + span {opacity:1;}
  100.  
  101. #fade {display:none; background:#000; position:fixed; left:0; top:0; width:100%; height:100%; opacity:0; z-index:999;}
  102.  
  103. .popup_block {background:{color:Sidebar BG 1}; color:{color:Sidebar Text}; position:fixed; top:0; left:-250px; z-index:99999; height:100%; padding:0 25px; overflow:auto;}
  104.  
  105. img.btn_close {position:absolute; top:5px; right:5px;}
  106.  
  107. *html #fade {position:absolute;}
  108.  
  109. *html .popup_block {position:absolute;}
  110.  
  111. #menu #info {height:53%; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; border-top:solid 25px transparent;}
  112.  
  113. #info img:first-of-type {height:75px; width:75px; margin:0 0 15px 62px;}
  114.  
  115. #info h2.t {position:absolute; width:200px; height:45px; overflow:hidden; margin:0; padding:15px 0; background:{color:Sidebar BG 1}; opacity:0;}
  116.  
  117. #info h2.t:hover {opacity:1;}
  118.  
  119. #info div {width:200px; overflow:auto; clear:both;}
  120.  
  121. #info div p:first-of-type {margin-top:0;}
  122.  
  123. #menu form {padding:0 5px;}
  124.  
  125. #menu form input {border:none; padding:0; background:transparent; height:20px; line-height:20px; width:165px; border-bottom:solid 1px transparent; color:{color:Sidebar Text}; letter-spacing:1px; text-transform:uppercase;}
  126.  
  127. #menu form input:focus {outline:none; border-bottom-color:{color:Sidebar Text};}
  128.  
  129. #menu form input:last-of-type {background:transparent url(http://static.tumblr.com/puls2hm/q7On7b1u4/sbicon.png) center center no-repeat; width:20px;}
  130.  
  131. #menu #xlinks {height:40%; overflow:auto;}
  132.  
  133. #xlinks a {display:block; text-transform:uppercase; border:solid 1px {color:Sidebar Text}; text-align:center; padding:5px 0; margin:5px 0; font-size:0.9em; font-family:sans-serif; font-weight:lighter;}
  134.  
  135. #xlinks a:hover {background:{color:Sidebar Text}; color:{color:Sidebar BG 2};}
  136.  
  137. /*----POSTS----*/
  138.  
  139. #posts {position:absolute; top:15px; left:350px; font-size:0.85em; width:570px;}
  140.  
  141. #entry {padding:10px; width:500px; height:auto; background:{color:Post BG 2};}
  142.  
  143. #ewrap {color:{color:Post Text}; background:{color:Post BG 1}; padding:25px; margin:25px 0; position:relative;}
  144.  
  145. #entry * {max-width:100%;}
  146.  
  147. h2 {text-align:center; margin-top:0; padding:5px; text-transform:uppercase;}
  148.  
  149. #posts a {font-weight:initial;}
  150.  
  151. #entry b {text-transform:uppercase; font-size:0.95em;}
  152.  
  153. #entry table {max-width:500px;}
  154.  
  155. blockquote {border-left:solid 1px rgba({RGBcolor:Post Text},0.5); padding-left:15px; margin-left:15px; margin-top:-10px;}
  156.  
  157. /*----TITLE + PERMALINK PAGINATION----*/
  158.  
  159. #posts h1 {text-transform:uppercase; font-size:40px; text-align:center; color:{color:Post BG 1};}
  160.  
  161. a.pn {background:{color:Post Text}; border-radius:100%; font-size:20px; border:solid 1px {color:Post BG 1}; color:{color:Post BG 1};}
  162.  
  163. a.pn.p {position:absolute; padding:2px 11px 4px 9px; top:50%; left:-45px; margin-top:-15px;}
  164.  
  165. a.pn.n {position:absolute; padding:2px 9px 4px 11px; top:50%; left:100%; margin-left:15px; margin-top:-15px;}
  166.  
  167. a.pn:hover {color:{color:Post Text}; background:{color:Accent};}
  168.  
  169. /*----CHAT POSTS----*/
  170.  
  171. ul.chat {padding-left:15px; list-style-type:none;}
  172.  
  173. /*----LINK POSTS----*/
  174.  
  175. a.link h2 {word-break:break-all;}
  176.  
  177. a.link h2:after {content:' ❯'; color:{color:Accent};}
  178.  
  179. /*----AUDIO POSTS----*/
  180.  
  181. .audio {float:left;}
  182.  
  183. .audio img {height:80px; width:80px; padding:5px; display:block;}
  184.  
  185. .aud {height:28px; width:28px; overflow:hidden; margin:-60px 0 31px 31px; opacity:0.6;}
  186.  
  187. .audio:hover .aud {opacity:1;}
  188.  
  189. .audin {float:left; height:70px; width:385px; padding:10px; margin-bottom:15px;}
  190.  
  191. /*----QUOTE POSTS----*/
  192.  
  193. h2.short {font-size:1.25em;}
  194.  
  195. h2.medium, h2.long {text-align:left; text-transform:none;}
  196.  
  197. h2.long {font-size:1.15em;}
  198.  
  199. /*----ASK POSTS----*/
  200.  
  201. div.ask b {text-align:center; display:block;}
  202.  
  203. div.answer b {display:block;}
  204.  
  205. div.ask {padding:10px;}
  206.  
  207. div.answer {padding:10px; font-size:0.95em;}
  208.  
  209. /*--------*/
  210.  
  211. /*----PERMALINK----*/
  212.  
  213. #perm {width:100%; line-height:18px; text-transform:uppercase; font-size:0.9em; text-align:center; padding-bottom:3px;}
  214.  
  215. #perm a, #perm div {display:inline-block !important; width:33%; font-family:sans-serif; font-weight:lighter; padding-bottom:3px; font-size:12px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; background:{color:Post BG 2};}
  216.  
  217. #perm div {position:relative; top:3px; padding:0;}
  218.  
  219. #perm div iframe {-webkit-transform: scale(0.77); -ms-transform: scale(0.77); transform: scale(0.77);}
  220.  
  221. #perm a:hover, #perm div:hover {background:{color:Post Text}; color:{color:Post BG 2};}
  222.  
  223. #tags {width:100%; text-align:center; padding:10px 0; font-size:0.9em; text-transform:uppercase; font-family:sans-serif; font-weight:lighter; opacity:0; margin-bottom:-20px; {block:PermalinkPage}opacity:0.75;{/block:PermalinkPage} {block:ifNotShowTagsOnHover}opacity:0.75;{/block:ifNotShowTagsOnHover}}
  224.  
  225. #ewrap:hover #tags {opacity:0.75;}
  226.  
  227. #date {text-transform:uppercase; font-family:sans-serif; font-weight:lighter; font-size:0.9em;}
  228.  
  229. #date div {float:right;}
  230.  
  231. /*--------*/
  232.  
  233. /*----NOTES----*/
  234.  
  235. ol.notes {padding-left:0; list-style-type:none; font-weight:bold; text-transform:uppercase; font-size:0.95em; color:{color:Post BG 1};}
  236.  
  237. ol.notes li {margin:15px;}
  238.  
  239. img.avatar {margin-right:15px; vertical-align:middle;}
  240.  
  241. ol.notes li blockquote {margin-top:10px; margin-left:7px; font-weight:initial;}
  242.  
  243. /*--------*/
  244.  
  245. /*----CREDIT - PLEASE DON'T REMOVE!----*/
  246.  
  247. a.cred {display:block; padding:2px 8px; color:white; background:black; position:fixed; font-size:16px; bottom:-3px; right:-3px; font-weight:lighter; border:solid 2px black; cursor:help;}
  248.  
  249. a.cred:hover {background:{color:Accent};}
  250.  
  251. a.cred span {color:black; background:white; border:solid 2px black; position:fixed; bottom:-27px; right:25px; z-index:-1; padding:2px 5px; font-variant:small-caps; font-weight:initial;}
  252.  
  253. a.cred:hover span {bottom:-3px;}
  254.  
  255. /*--------*/
  256.  
  257. {CustomCSS}
  258. </style>
  259.  
  260. </head>
  261. <body>
  262.  
  263. <div id="nav">
  264. <a href="/" style="background-image:url(http://static.tumblr.com/puls2hm/S4Ln7b7s8/home-24.png)"></a>
  265. <span>home</span>
  266. <a href="#?w=200" rel="menu" class="poplight" style="background-image:url(http://static.tumblr.com/puls2hm/sHUn7b7ub/message-information-24__1_.png)"></a>
  267. <span>menu</span>
  268. {block:AskEnabled}<a href="/ask" style="background-image:url(http://static.tumblr.com/puls2hm/imYn7b7sm/message-information-24.png)"></a>
  269. <span>ask</span>{/block:AskEnabled}
  270. <a href="/" style="background-image:url(http://static.tumblr.com/puls2hm/vLXn7b7th/calendar-date-01-24.png)"></a>
  271. <span>archive</span>
  272. {block:SubmissionsEnabled}<a href="/submit" style="background-image:url(http://static.tumblr.com/puls2hm/l0Bn7b7t1/message-edit-24.png)"></a>
  273. <span>submit</span>{/block:SubmissionsEnabled}
  274. {block:Pagination}
  275. {block:PreviousPage}
  276. <a href="{PreviousPage}" style="background-image:url(http://static.tumblr.com/puls2hm/jB3n7er05/arrowhead-left-01-24.png)"></a>
  277. <span>previous page</span>
  278. {/block:PreviousPage}
  279. {block:NextPage}
  280. <a href="{NextPage}" style="background-image:url(http://static.tumblr.com/puls2hm/ATcn7er0g/arrowhead-right-01-24.png)"></a>
  281. <span>next page</span>
  282. {/block:NextPage}
  283. {/block:Pagination}
  284. </div>
  285.  
  286. <div id="side">
  287. <img src="{image:Sidebar}" alt="Sidebar Image"/>
  288. <div><p>{Description}</p></div>
  289. </div>
  290.  
  291. <div id="menu" class="popup_block">
  292. <div id="info">
  293. <img src="{PortraitURL-64}" align="left"/>
  294. <h2 class="t">{text:Menu Title}</h2>
  295. <div>{text:Menu Description}</div>
  296. </div>
  297. <form action="/search" method="get">
  298. <input type="text" name="q" value="{SearchQuery}"/>
  299. <input type="submit" value=""/>
  300. </form>
  301.  
  302. <div id="xlinks">
  303. {block:HasPages}
  304. {block:Pages}
  305. <a href="{URL}">{Label}</a>
  306. {/block:Pages}
  307. {/block:HasPages}
  308. </div>
  309. </div>
  310.  
  311. <!----------------------------------POSTS---------------------------------->
  312.  
  313.  
  314. <div id="posts">
  315.  
  316. <h1>{Title}</h1>
  317.  
  318. {block:Posts}
  319. <div id="ewrap">
  320.  
  321. {block:PermalinkPagination}
  322. {block:PreviousPost}<a class="pn p" href="{PreviousPost}">❮</a>{/block:PreviousPost}
  323. {block:NextPost}<a class="pn n" href="{NextPost}">❯</a>{/block:NextPost}
  324. {/block:PermalinkPagination}
  325.  
  326. {block:Date}<div id="date">
  327. <a href="{Permalink}">posted on {DayOfMonth}{DayOfMonthSuffix} {Month} {Year} at {12Hour}:{Minutes}{AmPm}</a>
  328. {block:RebloggedFrom}<div><a href="{ReblogParentURL}">VIA</a> | <a href="{ReblogRootURL}">SOURCE</a></div>{/block:RebloggedFrom}
  329. </div>{/block:Date}
  330.  
  331. <div id="entry" style="{block:Quote}text-align:center;{/block:Quote}">
  332.  
  333. <!---posts--->
  334. {block:Text}
  335. {block:Title}<h2>{Title}</h2>{/block:Title}
  336. {Body}
  337. {/block:Text}
  338.  
  339. {block:Audio}
  340. <div class="audio">
  341. <img src="{image:Default Album Art}" {block:AlbumArt}style="display:none"{/block:AlbumArt}/>
  342. {block:AlbumArt}<img src="{AlbumArtURL}"/>{/block:AlbumArt}
  343. <div class="aud">{AudioPlayerWhite}</div>
  344. </div>
  345. <div class="audin">
  346. {block:TrackName}<b>Track Name</b> {TrackName}<br/>{/block:TrackName}
  347. {block:Artist}<b>Artist</b> {Artist}<br/>{/block:Artist}
  348. {block:Album}<b>Album</b> {Album}<br/>{/block:Album}
  349. {block:PlayCount}<b>Plays</b> {FormattedPlayCount}{/block:PlayCount}
  350. </div>
  351. {block:Caption}{Caption}{/block:Caption}
  352. {/block:Audio}
  353.  
  354. {block:Video}
  355. {Video-500}
  356. {block:Caption}{Caption}{/block:Caption}
  357. {/block:Video}
  358.  
  359. {block:Photo}
  360. {block:ifOpenFullSizeImages}
  361. {LinkOpenTag}
  362. {/block:ifOpenFullSizeImages}
  363. <img src="{PhotoURL-500}">
  364. {block:ifOpenFullSizeImages}
  365. {LinkCloseTag}
  366. {/block:ifOpenFullSizeImages}
  367. {block:Caption}{Caption}{/block:Caption}
  368. {/block:Photo}
  369.  
  370. {block:Photoset}
  371. {Photoset-500}
  372. {block:Caption}{Caption}{/block:Caption}
  373. {/block:Photoset}
  374.  
  375. {block:Panorama}
  376. {LinkOpenTag}<img src="{PhotoURL-Panorama}"/>{LinkCloseTag}
  377. {block:Caption}{Caption}{/block:Caption}
  378. {/block:Panorama}
  379.  
  380. {block:Quote}
  381. <h2 class="{Length} qu">"{Quote}"</h2>
  382. {block:Source}{Source}{/block:Source}
  383. {/block:Quote}
  384.  
  385. {block:Link}
  386. <a href="{URL}" class="link"><h2>{Name}</h2></a>
  387. {block:Description}{Description}{/block:Description}
  388. {/block:Link}
  389.  
  390. {block:Chat}
  391. {block:Title}<h2>{Title}</h2>{/block:Title}
  392. <ul class="chat">
  393. {block:Lines}
  394. <li class="{Alt}">{block:Label}<b>{Label}</b> {/block:Label}{Line}</li>
  395. {/block:Lines}
  396. </ul>
  397. {/block:Chat}
  398.  
  399. {block:Answer}
  400. <div class="ask">
  401. <b>{Asker} asked:</b>{Question}
  402. </div>
  403. <div class="answer">
  404. {block:Answerer}<b>{Answerer} replied:</b>{/block:Answerer}
  405. {Answer}
  406. </div>
  407.  
  408. {block:Answerer}{Replies}{/block:Answerer}
  409. {/block:Answer}
  410.  
  411. </div><!--entry-->
  412.  
  413. {block:Date}<div id="perm">
  414. <a href="{Permalink}">{NoteCount}</a>
  415. <a href="{ReblogURL}">reblog</a>
  416. {LikeButton color="grey" size="16"}
  417. </div>{/block:Date}
  418.  
  419. {block:HasTags}
  420. <div id="tags" class="date">
  421. {block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;{/block:Tags}
  422. </div>
  423. {/block:HasTags}
  424.  
  425. </div><!--ewrap-->
  426. {/block:Posts}
  427.  
  428. {block:PostNotes}
  429. {PostNotes}
  430. {/block:PostNotes}
  431.  
  432. </div><!--posts-->
  433.  
  434. <a href="//syntaxthemes.tumblr.com" class="cred">?<span>theme by syntaxthemes</span></a>
  435.  
  436. </body>
  437. </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!