API tools faq
paste
thanksamber

Theme 006

thanksamber
Jun 27th, 2015
1,294
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.16 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2.  
  3. <!-- macfustythemes -->
  4. <head>
  5. <title>{Title}</title>
  6. {block:Description}
  7. <meta name="description" content="{MetaDescription}">
  8. {/block:Description}
  9.  
  10. <meta name="image:Background" content="">
  11. <meta name="image:Icon" content="">
  12.  
  13. <meta name="color:Background" content="#fff">
  14. <meta name="color:Text" content="#444444">
  15. <meta name="color:Links" content="#b0b0b0">
  16. <meta name="color:Hover" content="#000000">
  17. <meta name="color:Border" content="#bebebe">
  18. <meta name="color:Post Container" content="#eaeaea">
  19. <meta name="color:Side Text" content="#5a5a5a">
  20. <meta name="color:Side Text Hover" content="#0a0a0a">
  21. <meta name="color:Side Text 2" content="#797979">
  22. <meta name="color:Post Info" content="#000">
  23.  
  24. <meta name="text:Link 1 URL" content="/">
  25. <meta name="text:Link 1" content="Home">
  26. <meta name="text:Link 2 URL" content="/">
  27. <meta name="text:Link 2" content="Link 2">
  28. <meta name="text:Link 3 URL" content="/">
  29. <meta name="text:Link 3" content="Link 3">
  30. <meta name="text:Link 4 URL" content="/">
  31. <meta name="text:Link 4" content="Link 4">
  32. <meta name="text:Link 5 URL" content="/">
  33. <meta name="text:Link 5" content="Link 5">
  34.  
  35. <meta name="image:Category Icon 1" content="">
  36. <meta name="text:Category Tag 1" content="">
  37. <meta name="image:Category Icon 2" content="">
  38. <meta name="text:Category Tag 2" content="">
  39. <meta name="image:Category Icon 3" content="">
  40. <meta name="text:Category Tag 3" content="">
  41. <meta name="image:Category Icon 4" content="">
  42. <meta name="text:Category Tag 4" content="">
  43. <meta name="image:Category Icon 5" content="">
  44. <meta name="text:Category Tag 5" content="">
  45.  
  46. <link rel="shortcut icon" href="{Favicon}">
  47.  
  48.  
  49. <link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
  50.  
  51. <!-- HTML5 Shiv -->
  52. <!--[if lt IE 9]>
  53. <script src="http://static.tumblr.com/hriofhd/Qj0m8pn7q/html5shiv.js"></script>
  54. <![endif]-->
  55.  
  56. <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
  57.  
  58. <style>
  59.  
  60. body {
  61. background-color: {color:Background};
  62. background-image: url('{image:Background}');
  63. background-repeat: no-repeat;
  64. background-attachment: fixed;
  65. color: {color:Text};
  66. font-size: 11px;
  67. font-family: 'Calibri', sans-serif;
  68. line-height: 18px;
  69. }
  70.  
  71. a {
  72. color: {color:Links};
  73. text-decoration: none;
  74. -moz-transition: all 0.5s ease;
  75. -o-transition: all 0.5s ease;
  76. -webkit-transition: all 0.5s ease;
  77. transition: all 0.5s ease;
  78. }
  79.  
  80. a:hover {
  81. color: {color:Hover};
  82. text-decoration: underline;
  83. }
  84.  
  85. .clear {
  86. clear: both;
  87. }
  88.  
  89. blockquote {
  90. border-left: 1px solid {color:Border};
  91. padding: 5px 10px;
  92. }
  93.  
  94. #sidebar {
  95. position: fixed;
  96. width: 95px;
  97. height: 425px;
  98. bottom: 0;
  99. right: 15px;
  100. }
  101.  
  102. img.icon {
  103. width: 75px;
  104. height: 75px;
  105. padding: 10px;
  106. border: 1px solid {color:Border};
  107. }
  108.  
  109. ul.nav {
  110. position: absolute;
  111. bottom: 0;
  112. padding: 0;
  113. }
  114.  
  115. ul.nav li {
  116. list-style-type: none;
  117. margin-top: 5px;
  118. font-size: 9px;
  119. text-transform: uppercase;
  120. }
  121.  
  122. .bullet {
  123. float: left;
  124. border-radius: 100%;
  125. width: 10px;
  126. height: 10px;
  127. border: 1px solid {color:Side Text 2};
  128. margin: 3px 5px 0 0;
  129. -moz-transition: all 0.5s ease;
  130. -o-transition: all 0.5s ease;
  131. -webkit-transition: all 0.5s ease;
  132. transition: all 0.5s ease;
  133. }
  134.  
  135. ul.nav li a:hover > .bullet {
  136. background-color: {color:Side Text 2};
  137. }
  138.  
  139. ul.nav li a {
  140. color: {color:Side Text};
  141. }
  142.  
  143. ul.nav li a:hover {
  144. color: {color:Side Text Hover};
  145. text-decoration: none;
  146. }
  147.  
  148.  
  149. #titlecontainer {
  150. position: fixed;
  151. width:545px;
  152. overflow: hidden;
  153. bottom: 455px;
  154. right: 125px;
  155. text-align: right;
  156. }
  157.  
  158. .mtitle {
  159. font-family: 'Roboto', sans-serif;
  160. letter-spacing: 4px;
  161. font-size: 22px;
  162. text-transform: uppercase;
  163. color: {color:Side Text};
  164. margin-bottom: 0px;
  165. }
  166.  
  167. .subtitle {
  168. height: 14px;
  169. overflow: hidden;
  170. font-size: 10px;
  171. color: {color:Side Text 2};
  172. text-transform: lowercase;
  173. margin-right: 5px;
  174. font-family: 'Roboto', sans-serif;
  175. }
  176.  
  177. #container {
  178. position: fixed;
  179. width:510px;
  180. height: 425px;
  181. padding: 10px;
  182. bottom: 0;
  183. right: 125px;
  184. border: 1px solid {color:Border};
  185. background-color: {color:Post Container};
  186. overflow: auto;
  187. }
  188.  
  189. #container::-webkit-scrollbar-track
  190. {
  191. background-color: {color:Post Container};
  192. }
  193.  
  194. #container::-webkit-scrollbar
  195. {
  196. width: 4px;
  197. }
  198.  
  199. #container::-webkit-scrollbar-thumb
  200. {
  201. background-color: {color:Background};
  202. }
  203.  
  204. .post {
  205. float: right;
  206. position: relative;
  207. width: 400px;
  208. text-align: justify;
  209. margin: 35px 10px 0 0;
  210. }
  211.  
  212. .post img {
  213. max-width: 100%;
  214. }
  215.  
  216. #date {
  217. text-align: right;
  218. text-transform: lowercase;
  219. letter-spacing: 2px;
  220. margin-bottom: 10px;
  221. }
  222.  
  223. #date a {
  224. color: {color:Post Info};
  225. }
  226.  
  227. #date a:hover {
  228. color: {color:Text};
  229. }
  230.  
  231. #pinfo a {
  232. color: {color:Post Info};
  233. text-transform: lowercase;
  234. }
  235.  
  236. #pinfo a:hover {
  237. color: {color:Text};
  238. }
  239.  
  240. #postinfo a.notecount {
  241. color: {color:Text};
  242. }
  243.  
  244. #postinfo a.notecount:hover {
  245. color: {color:Post Info};
  246. }
  247.  
  248. ol.notes {
  249. padding: 0px;
  250. margin: 25px 0px;
  251. list-style-type: none;
  252. }
  253.  
  254. ol.notes li.note {
  255. padding: 10px 0;
  256. }
  257.  
  258. ol.notes li.note img.avatar {
  259. vertical-align: -4px;
  260. margin-right: 10px;
  261. width: 16px;
  262. height: 16px;
  263. }
  264.  
  265. ol.notes li.note span.action {
  266. font-weight: bold;
  267. }
  268.  
  269. ol.notes li.note .answer_content {
  270. font-weight: normal;
  271. }
  272.  
  273. ol.notes li.note blockquote {
  274. padding: 4px 10px;
  275. margin: 10px 0px 0px 25px;
  276. }
  277.  
  278. ol.notes li.note blockquote a {
  279. text-decoration: none;
  280. }
  281.  
  282. h1 {
  283. font-family: 'Roboto', sans-serif;
  284. font-weight: normal;
  285. text-transform: lowercase;
  286. font-variant: small-caps;
  287. letter-spacing: 2px;
  288. font-size: 16px;
  289. }
  290.  
  291. #quomark {
  292. float: left;
  293. color: {color:Links};
  294. font-size: 100px;
  295. margin: 30px 10px 0 0;
  296. }
  297.  
  298. #quo {
  299. font-family: 'Roboto', sans-serif;
  300. font-weight: normal;
  301. text-transform: lowercase;
  302. font-variant: small-caps;
  303. letter-spacing: 2px;
  304. font-size: 16px;
  305. }
  306.  
  307. #source {
  308. margin-top: 5px;
  309. text-align: right;
  310. }
  311.  
  312. .audpost {
  313. float: left;
  314. width: 50px;
  315. height: 50px;
  316. border: 1px solid {color:Border};
  317. margin-right: 10px;
  318. }
  319.  
  320. .player {
  321. width: 30px;
  322. height: 30px;
  323. overflow: hidden;
  324. margin: 10px 0 0 10px;
  325. }
  326.  
  327. .atrack{
  328. font-family: 'Roboto', sans-serif;
  329. font-size: 14px;
  330. margin-top: 25px;
  331. text-transform: uppercase;
  332. letter-spacing: 3px;
  333. }
  334.  
  335. .aartist {
  336. letter-spacing: 2px;
  337. text-transform: lowercase;
  338. }
  339.  
  340. #question {
  341. text-transform: lowercase;
  342. font-variant: small-caps;
  343. text-align: left;
  344. letter-spacing: 1px;
  345. color: {color:Post Info};
  346. }
  347.  
  348. #answer {
  349. margin-top: 20px;
  350. text-align: right;
  351. }
  352.  
  353. #pagination {
  354. padding: 20px 0;
  355. text-align: center;
  356. text-transform: uppercase;
  357. font-family: 'Roboto', sans-serif;
  358. font-size: 12px;
  359. }
  360.  
  361. #pagination a {
  362. color: {color:Text};
  363. }
  364.  
  365. #pagination a:hover {
  366. color: {color:Links};
  367. }
  368.  
  369. #category {
  370. width: 75px;
  371. height: 75px;
  372. position: absolute;
  373. left: -90px;
  374. background-size: 75px 75px;
  375. background-repeat: no-repeat;
  376. }
  377.  
  378. #category.{text:Category Tag 1} {
  379. background-image: url('{image:Category Icon 1}');
  380. }
  381.  
  382. #category.{text:Category Tag 2} {
  383. background-image: url('{image:Category Icon 2}');
  384. }
  385.  
  386. #category.{text:Category Tag 3} {
  387. background-image: url('{image:Category Icon 3}');
  388. }
  389.  
  390. #category.{text:Category Tag 4} {
  391. background-image: url('{image:Category Icon 4}');
  392. }
  393.  
  394. #category.{text:Category Tag 5} {
  395. background-image: url('{image:Category Icon 5}');
  396. }
  397.  
  398. </style>
  399. <body>
  400. <div id="titlecontainer">
  401. <div class="mtitle">{Title}</div>
  402. <div class="subtitle">{Description}</div>
  403. </div>
  404. <div id="container">
  405. {block:Posts}
  406. <div class="post">
  407. {block:Date}
  408. <div id="date"><a href="{Permalink}">{DayofWeek} {DayofMonth}{DayofMonthSuffix} {Month} {Year}</a></div>
  409. {/block:Date}
  410.  
  411. <div id="category" class="{TagsAsClasses}"></div>
  412.  
  413. {block:Text}
  414. {block:Title}<h1>{Title}</h1>{/block:Title}
  415. {Body}
  416. {/block:Text}
  417.  
  418. {block:Photo}
  419. <img src="{PhotoURL-400}">
  420. {block:Caption}{Caption}{/block:Caption}
  421. {/block:Photo}
  422.  
  423. {block:Photoset}
  424. {Photoset-400}
  425. {block:Caption}{Caption}{/block:Caption}
  426. {/block:Photoset}
  427.  
  428. {block:Quote}
  429. <div id="quomark">&ldquo;</div>
  430. <div id="quo">{Quote}</div>
  431. <div class="clear"></div>
  432. {block:Source}
  433. <div id="source">- {Source}</div>
  434. {/block:Source}
  435. {/block:Quote}
  436.  
  437. {block:Link}
  438. <h1><a href="{URL}">{Name}</a></h1>
  439. {block:Description}{Description}{/block:Description}
  440. {/block:Link}
  441.  
  442. {block:Chat}
  443. {block:Title}<h1>{Title}</h1>{/block:Title}
  444. {block:Lines}
  445. <p>{block:Label}<span style="text-transform: uppercase; color: {color:Links};">{Label}</span>{/block:Label}
  446. {Line}
  447. {/block:Lines}
  448. {/block:Chat}
  449.  
  450. {block:Audio}
  451. {block:AudioEmbed}{AudioEmbed-400}{/block:AudioEmbed}
  452. {block:AudioPlayer}
  453. <div class="audpost">
  454. <div class="player">{AudioPlayer}</div>
  455. </div>
  456. {/block:AudioPlayer}
  457. <div class="atrack">{block:TrackName}{TrackName}{/block:TrackName}</div>
  458. <div class="aartist">{block:Artist}{Artist}{/block:Artist}</div>
  459. <div class="clear"></div>
  460. {block:Caption}{Caption}{/block:Caption}
  461. {/block:Audio}
  462.  
  463. {block:Video}
  464. {Video-400}
  465. {block:Caption}{Caption}{/block:Caption}
  466. {/block:Video}
  467.  
  468. {block:Answer}
  469. <div id="question"><b>{Asker} said:</b> {Question}</div>
  470. <div id="answer">{Answer}</div>
  471. {/block:Answer}
  472.  
  473. <div id="pinfo">
  474. {block:ContentSource}<br>source: <a href="{SourceURL}">{SourceTitle}</a>{/block:ContentSource} {block:RebloggedFrom}<br>via <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}
  475. <br><a href="{Permalink}">{NoteCountWithLabel} </a> {block:HasTags}- {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}
  476. {/block:HasTags}
  477. </div>
  478. {block:PostNotes}
  479. {PostNotes}
  480. {/block:PostNotes}
  481. </div>
  482. {/block:Posts}
  483. <div class="clear"></div>
  484. <div id="pagination">
  485. {block:Pagination}
  486. {block:PreviousPage}<a href="{PreviousPage}">Prev</a> / {/block:PreviousPage}{block:NextPage}<a href="{NextPage}">Next</a>{/block:NextPage}
  487. {/block:Pagination}
  488. </div>
  489. </div>
  490. <div id="sidebar">
  491. {block:ifIcon}
  492. <img class="icon" src="{image:Icon}">
  493. {/block:ifIcon}
  494. <ul class="nav">
  495. {block:ifLink1URL}
  496. <li><a href="{text:Link 1 URL}"><div class="bullet"></div>{text:Link 1}</a></li>
  497. {/block:ifLink1URL}
  498. {block:ifLink2URL}
  499. <li><a href="{text:Link 2 URL}"><div class="bullet"></div>{text:Link 2}</a></li>
  500. {/block:ifLink2URL}
  501. {block:ifLink3URL}
  502. <li><a href="{text:Link 3 URL}"><div class="bullet"></div>{text:Link 3}</a></li>
  503. {/block:ifLink3URL}
  504. {block:ifLink4URL}
  505. <li><a href="{text:Link 4 URL}"><div class="bullet"></div>{text:Link 4}</a></li>
  506. {/block:ifLink4URL}
  507. {block:ifLink5URL}
  508. <li><a href="{text:Link 5 URL}"><div class="bullet"></div>{text:Link 5}</a></li>
  509. {/block:ifLink5URL}
  510. <li><a href="http://macfustythemes.tumblr.com/"><div class="bullet"></div>Theme</a></li>
  511. </ul>
  512. </div>
  513. </body>
  514. </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!