aubrieta

04 theme: fırtına

Nov 28th, 2015
6,881
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.10 KB | None | 0 0
  1. <!---
  2.  
  3. theme: fırtına
  4.  
  5. do not steal, claim as your own, redistribute.
  6. do not remove the credit.
  7.  
  8. coded by
  9. aubretia (ifallontragedy)
  10.  
  11. --->
  12.  
  13.  
  14.  
  15. <!DOCTYPE html>
  16. <head>
  17.  
  18. <title>{Title}</title>
  19.  
  20. <link rel="shortcut icon" href="{Favicon}">
  21. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  22. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  23.  
  24. <!--Default Variables-->
  25.  
  26. <meta name="color:background" content="#f6f6f6"/>
  27. <meta name="color:post bg" content="#fff"/>
  28. <meta name="color:text" content="#444444"/>
  29. <meta name="color:link" content="#a2a2a2"/>
  30. <meta name="color:hover" content="#aa9f7c"/>
  31. <meta name="color:border" content="#e7e7e7"/>
  32. <meta name="color:accent" content="#a56d68"/>
  33.  
  34. <meta name="image:background" content="" />
  35.  
  36. <meta name="text:main font" content="'hind', sans-serif" />
  37. <meta name="text:secondary font" content="georgia, serif" />
  38. <meta name="text:title" content="title" />
  39. <meta name="text:link i" content="" />
  40. <meta name="text:link ii" content="" />
  41. <meta name="text:link iii" content="" />
  42. <meta name="text:link iv" content="" />
  43. <meta name="text:link i text" content="link i" />
  44. <meta name="text:link ii text" content="link ii" />
  45. <meta name="text:link iii text" content="link iii" />
  46. <meta name="text:link iv text" content="link iv" />
  47.  
  48. <meta name="if:500px posts" content="0"/>
  49.  
  50.  
  51. <!-- jquery for tooltips-->
  52.  
  53.  
  54. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  55.  
  56. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  57.  
  58. <link href='https://fonts.googleapis.com/css?family=Hind:400,300,700' rel='stylesheet' type='text/css'>
  59.  
  60. <style type="text/css">
  61.  
  62. /*scrollbar and selection*/
  63. #s-m-t-tooltip{
  64. color: {color:text};
  65. width: auto;
  66. font-size: 7px;
  67. padding: 2px 4px;
  68. text-transform: uppercase;
  69. background-color: {color:background};
  70. z-index: 100;
  71. border: 1px solid {color:border};
  72. position: absolute;
  73. display:inline-block;
  74. margin-top: 20px;
  75. margin-left: 10px;
  76. }
  77.  
  78. ::-webkit-scrollbar-thumb:vertical {
  79. background-color: {color:accent};
  80. width:1px;
  81. height:2px;
  82. border-left: 9px solid {color:background};
  83. border-right: 9px solid {color:background};
  84. }
  85.  
  86. ::-webkit-scrollbar-thumb:horizontal {
  87. background-color:{color:background};
  88.  
  89. }
  90.  
  91. ::-webkit-scrollbar {
  92. width: 19px;
  93. background-color:{color:background};
  94.  
  95. }
  96.  
  97. ::-webkit-scrollbar-track {
  98. background-color: #ddd;
  99. border-left: 9px solid {color:background};
  100. border-right: 9px solid {color:background};
  101. border-top: 0px solid {color:background};
  102. border-bottom: 0px solid {color:background};
  103. }
  104.  
  105.  
  106. ::selection {
  107. color:{color:background};
  108. background-color: {color:accent};
  109. }
  110.  
  111. ::-moz-selection {
  112. color:{color:background};
  113. background-color: {color:accent};
  114. }
  115.  
  116.  
  117.  
  118. /*main*/
  119. body {
  120. background:{color:background};
  121. {block:ifbackgroundimage}background-image:url('{image:background}');{/block:ifbackgroundimage}
  122. color:{color:text};
  123. font-family: {text:main font};
  124. font-size: 9.5px;
  125. letter-spacing: 0.2px;
  126. font-weight:300;
  127. -webkit-font-smoothing: antialiased;
  128. word-spacing: 2px;
  129. text-align:justify;
  130. line-height:1.1em;
  131. margin: 0;
  132. overflow-y: scroll;
  133. overflow-x: hidden;
  134. }
  135.  
  136. a {
  137. color:{color:link};
  138. text-decoration: none;
  139. }
  140.  
  141. a:hover {
  142. color: {color:hover};
  143. }
  144.  
  145. #entries {
  146. position:relative;
  147. height: 100%;
  148. margin-left: 450px;
  149. padding-bottom: 10px;
  150. padding-top: 120px;
  151. line-height:130%;
  152. {block:ifnot500pxposts}width: 400px;{/block:ifnot500pxposts}
  153. {block:if500pxposts}width: 500px;{/block:if500pxposts}
  154. }
  155.  
  156. #posts {
  157. padding: 15px;
  158. text-align: justify;
  159. height: 100%;
  160. background: {color:post bg};
  161. border: 1px solid {color:border};
  162. line-height:130%;
  163. {block:ifnot500pxposts}width: 400px;{/block:ifnot500pxposts}
  164. {block:if500pxposts}width: 500px;{/block:if500pxposts}
  165. position: relative;
  166. margin-bottom: 9px;
  167. }
  168.  
  169. #posts img {
  170. {block:ifnot500pxposts}max-width: 400px!important;{/block:ifnot500pxposts}
  171. {block:if500pxposts}max-width: 500px!important;{/block:if500pxposts}
  172. margin: auto;
  173. }
  174.  
  175. #permalink {
  176. word-spacing: 3px;
  177. margin-top: 15px;
  178. border-top: 1px solid {color:border};
  179. font-size: 9px;
  180. padding-top: 10px;
  181. letter-spacing: 0.5px;
  182. color: silver;
  183. }
  184.  
  185.  
  186. #permalink a {
  187. color: silver;
  188. }
  189.  
  190. .date {
  191. text-transform: uppercase;
  192. margin-right: 3px;
  193. font-weight: bold;
  194. }
  195.  
  196. .date .dt a {
  197. padding: 1px 5px 0px 5px;
  198. background: {color:accent};
  199. color: {color:post bg}!important;
  200. }
  201.  
  202. .tags {
  203. margin-top: 4px;
  204. text-align: justify;
  205. }
  206.  
  207. .tags a {
  208. padding-right: 3px;
  209. color: silver;
  210. }
  211.  
  212. .tags a:hover {
  213. color: {color:hover}!important;
  214. }
  215.  
  216. .tags a::before {
  217. content: '#';
  218. opacity: 0.5;
  219. }
  220.  
  221. .tags a::after {
  222. margin-right: 10px;
  223. }
  224.  
  225.  
  226. /*LEFT SIDE*/
  227. #left {
  228. position: fixed;
  229. width: 130px;
  230. margin-top: 120px;
  231. margin-left: 270px;
  232. background: {color:post bg};
  233. border: 1px solid {color:border};
  234. padding: 30px 20px;
  235. }
  236.  
  237. #left b {
  238. color: {color:text};
  239. }
  240.  
  241. .dsc {
  242. margin-top: 10px;
  243. }
  244.  
  245. .title a, .title {
  246. font-family: {text:secondary font};
  247. text-align: center;
  248. margin-bottom: 10px;
  249. font-size: 13px;
  250. color: {color:text};
  251. }
  252.  
  253. .border {
  254. width: 50px;
  255. height: 2px;
  256. background: {color:accent};
  257. margin: auto;
  258. margin-bottom: 10px;
  259. text-align: auto;
  260. }
  261.  
  262. .links {
  263. text-align: center;
  264. margin-bottom: 15px;
  265. }
  266.  
  267. .links a {
  268. display: inline-block;
  269. font-weight: normal;
  270. font-weight: bold;
  271. text-transform: uppercase;
  272. text-align: left;
  273. font-size: 7px;
  274. font-family: {text:main font};
  275. letter-spacing: 1px;
  276. padding: 0px 2.5px;
  277. }
  278.  
  279. .right { text-align: center; }
  280.  
  281. .right img { width: 70px; }
  282.  
  283. /*pagination*/
  284. #pag {
  285. position: fixed;
  286. text-transform: uppercase;
  287. font-size: 8px;
  288. text-align: center;
  289. width: 170px;
  290. top: 100px;
  291. left: 270px;
  292. }
  293.  
  294. #pag a {
  295. color: {color:links};
  296. font-weight: bold;
  297. }
  298.  
  299. #pag a:hover {
  300. color: {color:hover};
  301. }
  302.  
  303.  
  304. /*inside posts*/
  305. #posts img, #posts img a {
  306. {block:ifnot500pxposts}max-width: 400px;{/block:ifnot500pxposts}
  307. {block:if500pxposts}max-width: 500px;{/block:if500pxposts}
  308. }
  309.  
  310. bold, strong, b {
  311. color: {color:accent};
  312. }
  313.  
  314. i, italic, em {
  315. font-style: italic;
  316. }
  317.  
  318. small, sub, big, sup {
  319. font-size: 9.5px;
  320. }
  321.  
  322. code {
  323. font-family: courier new;
  324. letter-spacing: 0px;
  325. font-size: 12px;
  326. }
  327.  
  328. blockquote {
  329. border-left: 1px solid {color:border};
  330. padding-left: 10px;
  331. margin-left: 5px;
  332. max-width: 400px!important;
  333. margin-right: 5px;
  334. }
  335.  
  336. ul li {
  337. list-style: circle;
  338. list-style-position: outside;
  339. }
  340.  
  341. ol li {
  342. list-style: lower-roman;
  343. list-style-position: outside;
  344. }
  345.  
  346. .chat {
  347. font-family: courier new;
  348. }
  349.  
  350. .chat b {
  351. font-family: {text:main font};
  352. }
  353.  
  354. /*notes*/
  355. ol.notes {
  356. list-style-type:none;
  357. margin-left: -40px;
  358. {block:ifnot500pxposts}width: 430px;{/block:ifnot500pxposts}
  359. {block:if500pxposts}width: 530px;{/block:if500pxposts}
  360. }
  361.  
  362. ol.notes li.note {
  363. list-style-type:none;
  364. border-bottom: 1px solid {color:border};
  365. padding: 5px;
  366. }
  367.  
  368. ol.notes li.note img {
  369. display: none;
  370. }
  371.  
  372. img {
  373. filter: none;
  374. }
  375.  
  376. /*post title*/
  377. .ptitle {
  378. line-height: 130%;
  379. color: {color:accent};
  380. font-size: 14px;
  381. font-family: {text:secondary font};
  382. }
  383.  
  384. .ptitle a {
  385. color: {color:accent};
  386. }
  387.  
  388. .ptitle a:hover {
  389. color: {color:hover};
  390. }
  391.  
  392. /*quote*/
  393. .quote {
  394. text-align: center;
  395. font-size: 16.5px;
  396. font-family: {text:secondary font};
  397. line-height: 1.3em;
  398. margin-bottom: 20px;
  399. word-spacing: 3px;
  400. color: {color:accent};
  401. }
  402.  
  403. .source {
  404. width: 250px;
  405. border-top: 1px solid {color:border};
  406. font-style: normal;
  407. margin-bottom: 10px;
  408. text-align: center;
  409. margin-top:-5px;
  410. text-transform: uppercase;
  411. font-size: 9px;
  412. letter-spacing: 1;
  413. }
  414.  
  415. /*ask*/
  416. #ask {
  417. padding-bottom: 15px;
  418. padding-top: 10px;
  419. margin-bottom:7px;
  420. border-bottom: 1px solid {color:border};
  421. text-align: center;
  422. }
  423.  
  424. .asker {
  425. text-transform: uppercase;
  426. letter-spacing: 1px;
  427. font-size: 7px;
  428. font-family: {text:secondary font};
  429. text-align: right;
  430. }
  431.  
  432. .asker a {
  433. color: {color:accent};
  434. }
  435.  
  436. .asker a:hover {
  437. color: {color:hover};
  438. }
  439.  
  440. .askicon {
  441. float: right;
  442. filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
  443. filter: gray; /* IE6-9 */
  444. -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
  445. -webkit-border-radius: 100%;
  446. border-radius: 100%;
  447. -moz-border-radius: 100%;
  448. margin-left: 5px;
  449. width: 16px;
  450. }
  451.  
  452. /*audio*/
  453. .albumart img {
  454. width: 70px;
  455. float: right;
  456. padding: 3px;
  457. border: 1px solid {color:border};
  458. }
  459.  
  460. .albumart {
  461. text-align: center;
  462. }
  463.  
  464. .audio {
  465. margin-bottom: 5px;
  466. }
  467.  
  468. #play {
  469. opacity: 0.5;
  470. background-color: white;
  471. z-index: 1000;
  472. {block:ifnot500pxposts}margin: 2px 340px;{/block:ifnot500pxposts}
  473. {block:if500pxposts}margin: 2px 440px;{/block:if500pxposts}
  474. position: absolute;
  475. top: 30px;
  476. -moz-border-radius: 100%;
  477. -webkit-border-radius: 100%;
  478. border-radius: 100%;
  479. left: 15px;
  480. -moz-transition-duration:0.6s;
  481. -webkit-transition-duration:0.6s;
  482. -o-transition-duration:0.6s;
  483. }
  484.  
  485. .button {
  486. width: 18px;
  487. height: 30px;
  488. overflow: hidden;
  489. position: relative;
  490. z-index: 1000;
  491. margin: 8px 16px 5px 8px;
  492. }
  493.  
  494. #play:hover {
  495. opacity: 1;
  496. -moz-transition-duration:0.6s;
  497. -webkit-transition-duration:0.6s;
  498. -o-transition-duration:0.6s;
  499. }
  500.  
  501. /*credit*/
  502. #credit {
  503. font-size:8px;
  504. padding-bottom: 60px;
  505. top: 20px;
  506. {block:ifnot500pxposts}width: 420px;{/block:ifnot500pxposts}
  507. {block:if500pxposts}width: 520px;{/block:if500pxposts}
  508. margin-left: 450px;
  509. line-height: 100%;
  510. text-align: center;
  511. letter-spacing: 0.5px;
  512. text-transform: uppercase;
  513. }
  514.  
  515. #credit a {
  516. font-weight: bold;
  517. color: {color:accent};
  518. }
  519.  
  520. #credit a:hover {
  521. color: {color:hover};
  522. }
  523.  
  524.  
  525. {CustomCSS}
  526.  
  527.  
  528. </style>
  529. </head>
  530.  
  531.  
  532. <body>
  533. <div id="content">
  534. <div id="left">
  535. <div class="right"><a href="/"><img src="{PortraitURL-96}"></div></a>
  536. <div class="dsc"><div class="title"><a href="/">{text:title}</a></div>
  537. <div class="border"></div>
  538. <div class="links"><a href="{text:link i}">{text:link i text}</a> <a href="{text:link ii}">{text:link ii text}</a> <a href="{text:link iii}">{text:link iii text}</a> <a href="{text:link iv}">{text:link iv text}</a></div>
  539. {description}</div>
  540. </div>
  541.  
  542. <div id="pag">{block:Pagination}
  543. {block:PreviousPage}
  544. <a href="{PreviousPage}">sooner</a>
  545. {/block:PreviousPage} <i>or</i> {block:NextPage}
  546. <a href="{NextPage}">later</a>
  547. {/block:NextPage}{/block:Pagination}
  548. </div>
  549.  
  550. <div id="entries">
  551.  
  552. {block:Posts}
  553.  
  554. <div id="posts">
  555.  
  556. <div class="cont">
  557.  
  558. {block:Text}<div class="capt">
  559. {block:Title}<div class="ptitle">{Title}<br></div>{/block:Title}
  560. {Body}</div>
  561. {/block:Text}
  562.  
  563. {block:Link}<div class="capt">
  564. <div class="ptitle"><a href="{URL}" {Target}>{Name} →</a></div>
  565. {block:Description}{Description}{/block:Description}</div>
  566. {/block:Link}
  567.  
  568. {block:Quote}<div class="capt">
  569. <center><div class="quote">{Quote}</div>
  570. {block:Source}
  571. <div class="source"><br>{Source}</div></center>
  572. {/block:Source}</div>
  573. {/block:Quote}
  574.  
  575. {block:Chat}<div class="capt"><div class="chat">
  576. {block:Title}<div class="ptitle">{Title}</div><p>{/block:Title}
  577. {block:Lines}<div style="padding: 10px 0px; border-bottom: 1px solid {color:border}"><div class="{Alt} user_{UserNumber}">
  578. {block:Label}<b>{Label}</b>{/block:Label}</div>
  579. {Line}<br></div>{/block:Lines}<p></p></div></div>{/block:Chat}
  580.  
  581. {block:Photo}{LinkOpenTag}
  582. {block:ifnot500pxposts}<img src="{PhotoURL-400}">{/block:ifnot500pxposts}
  583. {block:if500pxposts}<img src="{PhotoURL-500}">{/block:if500pxposts}
  584. {LinkCloseTag}
  585. {block:Caption}<div class="capt">
  586. {Caption}</div>
  587. {/block:Caption}
  588. {/block:Photo}
  589.  
  590. {block:Photoset}
  591. {block:ifnot500pxposts}{Photoset-400}{/block:ifnot500pxposts}
  592. {block:if500pxposts}{Photoset-500}{/block:if500pxposts}
  593. {block:Caption}<div class="capt">
  594. {Caption}</div>
  595. {/block:Caption}
  596. {/block:Photoset}
  597.  
  598. {block:Video}
  599. {block:ifnot500pxposts}{Video-400}{/block:ifnot500pxposts}
  600. {block:if500pxposts}{Video-500}{/block:if500pxposts}
  601. {block:Caption}<div class="capt">
  602. {Caption}</div>
  603. {/block:Caption}
  604. {/block:Video}
  605.  
  606. {block:Audio}<div class="capt">
  607. <div class="albumart">{block:AlbumArt}<img src="{AlbumArtURL}" width="100">{/block:AlbumArt}</div>
  608. <div class="audio"><div id="play">
  609. <div class="button">{AudioPlayerWhite}</div></div>
  610. <div style="padding-top: 20px; {block:ifnot500pxposts}width: 316px;{/block:ifnot500pxposts} {block:if500pxposts}width: 416px;{/block:if500pxposts} text-align: center; padding-bottom: 20px; border: 1px solid {color:border}; max-height: 70px;"><b>Track:</b> {block:TrackName}{TrackName}{/block:TrackName}<br>
  611. <b>Artist:</b> {block:Artist}{Artist}{/block:Artist}<br>
  612. <b>Album:</b> {block:Album}{Album}{/block:Album}</div></div>
  613. {block:Caption}{Caption}{/block:Caption}</div>{/block:Audio}
  614.  
  615.  
  616.  
  617. {block:Answer}<div class="capt">
  618. <div id="ask">{Question}</div>
  619. <div class="asker">asked by {Asker}</div>
  620. {Answer}</div>{/block:Answer}
  621.  
  622.  
  623. <div id="permalink">
  624. {block:Date}
  625.  
  626. <div class="date"><span class="dt"><a href="{Permalink}">{DayOfMonth}.{MonthNumber}.{ShortYear}</a></span>{block:NoteCount}<a href="{Permalink}"> {NoteCountWithLabel}</a>{/block:NoteCount}{block:PermalinkPage}{block:RebloggedFrom} · <a href="{ReblogParentURL}" title="reblogged from">{ReblogParentName}</a>{block:ContentSource} / <a href="{ReblogRootURL}" title="originally by">{ReblogRootName}</a>{/block:ContentSource}{/block:RebloggedFrom}{/block:PermalinkPage}</div>
  627.  
  628. {/block:Date}
  629. {block:HasTags}<div class="tags">{block:Tags}<a href="{TagUrl}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  630.  
  631.  
  632. </div>
  633. </div>
  634. </div>
  635.  
  636. {block:PostNotes}
  637. {PostNotes}
  638. {/block:PostNotes}
  639.  
  640.  
  641. {/block:Posts}
  642.  
  643.  
  644.  
  645. {block:ContentSource}
  646. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  647. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  648. {/block:SourceLogo}
  649. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  650. {/block:ContentSource}
  651.  
  652. </div>
  653.  
  654. <div id="credit">coded by <a href="http://aubrieta.tumblr.com">ifallontragedy</a></div>
  655.  
  656. </div>
  657.  
  658. </div>
  659.  
  660. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment