API tools faq
paste
Advertisement
Tryste

simple & clean theme

Tryste
Feb 9th, 2015
24
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.97 KB | None | 0 0
raw download clone embed print report
  1. <!----------------------------------------------------------------------
  2.  
  3. hello!! you're viewing fata's very first theme, simple & clean! thank you for choosing this theme.
  4.  
  5. editing of all types is allowed. you can even remove my theme credit if you'd like--this was more of a test than anything.
  6.  
  7. credit for the bubblebar goes to http://gyapo.tumblr.com/ for their wonderful coding!
  8. you can edit the bar at the very bottom of the code.
  9.  
  10. if you have any questions, need help, or find an error, please send me an ask at http://mintotea.tumblr.com/
  11.  
  12. ---------------------------------------------------------------------->
  13.  
  14. <!DOCTYPE html>
  15. <html>
  16. <head><title>{Title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  17. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  18. <link rel="shortcut icon" href="{Favicon}" />
  19. <meta name="color:Background" content="#000000" />
  20. <meta name="font:Body" content="Georgia" />
  21. <meta name="image:Background" content="" />
  22. <meta name="color:Link Color" content="#5E5E5E"/>
  23. <meta name="color:Link Hover Color" content="#191919"/>
  24. <meta name="color:Description Color" content="#E1398D"/>
  25. <meta name="color:Description Link Color" content="#D4D4D4"/>
  26. <meta name="color:Description Hover Colour" content="#FFFFFF"/>
  27. <meta name="image:Sidebar" content="" />
  28. <meta name="Infinite Scroll" content=0>
  29. <meta name="image:Side" content=""/>
  30.  
  31. <meta name="text:link 1 title" content=""/>
  32. <meta name="text:link 1 url" content=""/>
  33. <meta name="text:link 2 title" content=""/>
  34. <meta name="text:link 2 url" content=""/>
  35. <meta name="text:link 3 title" content=""/>
  36. <meta name="text:link 3 url" content=""/>
  37. <meta name="text:link 4 title" content=""/>
  38. <meta name="text: link 4 url" content=""/>
  39.  
  40.  
  41. <!--fonts!-->
  42.  
  43.  
  44. <link href='http://fonts.googleapis.com/css?family=Poiret+One' rel='stylesheet' type='text/css'>
  45. <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'>
  46. <link href='http://fonts.googleapis.com/css?family=Josefin+Sans' rel='stylesheet' type='text/css'>
  47.  
  48.  
  49.  
  50. <style type="text/css">
  51.  
  52. /*CSS text!!*/
  53.  
  54. body {
  55. background-color: {color:Background};
  56. font-family: {font:Body};
  57. background-image: url({image:Background});
  58. margin: 0;
  59. word-wrap: break-word
  60. background-attachment: fixed;
  61. }
  62.  
  63. #sidebar {
  64. background-color: transparent;
  65. width: 260px;
  66. position: absolute;
  67. top: 75px;
  68. right: 100px;
  69.  
  70. }
  71. #sidebar .title {
  72. font-family: 'Poiret One', cursive;
  73. font-size: 25px;
  74. font-style: bold;
  75. text-align: center;
  76. padding:10px;
  77. }
  78. #sidebar .title a {
  79. color: {color:Link Color};
  80. text-decoration: none;
  81. }
  82. #sidebar .image {
  83. width: 260px;
  84. height: auto;
  85. }
  86. #sidebar .description {
  87. font-family: 'Source Sans Pro', sans-serif;
  88. color: {color:Description Color};
  89. font-size: 13px;
  90. text-align: justify;
  91. padding:10px;
  92. line-height:100%;
  93. }
  94. #sidebar .description a {
  95. color: {color:Description Link Color};
  96. text-decoration: none;
  97. }
  98. #sidebar .description a:hover {
  99. color: {color:Description Hover Colour};
  100. }
  101. #sidebar .navlinks {
  102. font-family: 'Josefin Sans', sans-serif;
  103. background-color: white;
  104. font-size: 15px;
  105. text-align: center;
  106. padding: 5px 10px;
  107. margin: 5px;
  108. float: left;
  109. width: 100px;
  110.  
  111. }
  112. #sidebar .navlinks a {
  113. color: {color:Link Color};
  114. text-decoration: none;
  115. }
  116. #sidebar .navlinks a:hover {
  117. color: {color:Link Hover Color};
  118. }
  119.  
  120. #sidebar .pagination {
  121. width: 260px;
  122. text-align: center;
  123. padding: 3px 0;
  124. }
  125.  
  126. #sidebar .pagination a {
  127. color: {colorLink Color};
  128. text-decoration: none;
  129. }
  130.  
  131. #sidebar .pagination a:hover {
  132. color: {color:Link Hover Color};
  133. }
  134.  
  135.  
  136.  
  137. #content {
  138. font-family: 'Source Sans Pro', sans-serif;
  139. width: 460px;
  140. background-color: rgba(255, 255, 255, 0.4);
  141. margin: 60px 0 60px 460px;
  142. padding: 20px 0;
  143. color: {color:Description Color};
  144. }
  145.  
  146.  
  147. #content a {
  148. color: {color:Link Color};
  149. text-decoration: none;
  150. }
  151.  
  152. #content a:hover {
  153. color: {color:Link Hover Color};
  154. }
  155.  
  156. #content blockquote {
  157. border-left: solid 2px black;
  158. margin: 0;
  159. padding-left: 10px;
  160. }
  161.  
  162. #content #posts {
  163. background-color: white;
  164. width: 400px;
  165. margin: 0 auto 20px;
  166. padding: 10px;
  167. }
  168.  
  169. #content #posts .title {
  170. font-size: 15px;
  171. }
  172.  
  173. #content #posts .text {
  174. font-size: 11px;
  175. }
  176.  
  177. #content #posts #permalink {
  178. font-size: 9px;
  179. margin: 5px;
  180. text-align: right;
  181. }
  182. #content #posts #tags {
  183. font-size: 9px;
  184. }
  185.  
  186. #content #notecontainer {
  187. margin: 20px auto;
  188. width: 400px;
  189. font-size: 10px;
  190. }
  191.  
  192. #content #notecontainer ol.notes {
  193. list-style-type: none;
  194. margin: 0;
  195. padding: 5px;
  196. }
  197.  
  198. #content #notecontainer img.avatar {
  199. margin-right: 10px;
  200. width: 16px;
  201. height: 16px;
  202. }
  203.  
  204. #sideimage {
  205. margin-right: 10px;
  206. width: 100px;
  207. height: 100px;
  208.  
  209. }
  210.  
  211. img {
  212. border: 0;
  213. max-width: 100%;
  214. }
  215.  
  216.  
  217.  
  218.  
  219.  
  220. #bubblebar
  221. {font-family:lucida console;
  222. width:60px;
  223. position:fixed;
  224. right:15px;
  225. bottom:70px;
  226. z-index:999;
  227. font-size:9px;
  228. text-align:center;}
  229.  
  230. .bubble
  231. {text-align:center;
  232. color:#555;
  233. float:right;
  234. height:10px;
  235. width:34px;
  236. padding-top:12px;
  237. padding-bottom:12px;
  238. margin-top:10px;
  239. overflow:hidden;
  240. -moz-border-radius: 17px 17px 17px 17px;
  241. border-radius:17px 17px 17px 17px;
  242. -webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;}
  243. .bubble img
  244. {margin-bottom:10px;
  245. margin-top:-2px;}
  246.  
  247. #vertical
  248. {position:fixed;
  249. width:10px;
  250. right:30px;
  251. bottom:0px;
  252. height:260px;
  253. background-color:#bab2a4;
  254. -moz-border-radius: 10px 10px 0px 0px;
  255. border-radius:10px 10px 0px 0px; }
  256.  
  257. #bubble1 {border:3px solid #9ec1f2;
  258. background-color:#fff}
  259. #bubble1:hover
  260. {padding:5px;
  261. height:50px;
  262. width:120px;
  263. border:3px solid #4680d2;}
  264.  
  265. #bubble2
  266. {border:3px solid #f795bc;
  267. background-color:#fff;}
  268. #bubble2:hover
  269. {padding:5px;
  270. height:50px;
  271. width:120px;
  272. border:3px solid #be2a65;}
  273.  
  274. #music
  275. {border:3px solid #acacac;
  276. background-color:#fff;
  277. padding:14px 0px 10px 0px;}
  278. #music:hover
  279. {padding:5px;
  280. height:50px;
  281. width:50px;
  282. border:3px solid #111;}
  283. #bubbleplayer{padding:2px 0px 5px 0px;}
  284.  
  285.  
  286. {CustomCSS}
  287. </style>
  288.  
  289. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  290.  
  291. </head>
  292. <body>
  293. <img src='{image:Side}' style='position:fixed;bottom:0px;left:0px;z-index:-999'/>
  294.  
  295. <div id="sidebar">
  296. <div class="title"><a href="/">{Title}</a></div>
  297. <img class="image" src="{image:Sidebar}" />
  298. <div class="description">{Description}</div>
  299. <div class="navlinks"><a href="/ask" >Message</a></div>
  300. <div class="navlinks"><a href="/submit">Submit</a></div>
  301. <div class="navlinks"><a href="/archive">Archive</a></div>
  302. <div class="navlinks"><a href="http://mintotea.tumblr.com/">Theme</a></div>
  303. {block:Iflink1title}
  304. <div class="navlinks"><a href="{text:link 1 url}">{text:link 1 title}</a></div>
  305. {/block:Iflink1title}
  306. {block:Iflink2title}
  307. <div class="navlinks"><a href="{text:link 2 url}">{text:link 2 title}</a></div>
  308. {/block:Iflink2title}
  309. {block:Iflink3title}
  310. <div class="navlinks"><a href="{text:link 3 url}">{text:link 3 title}</a></a></div>
  311. {/block:Iflink3title}
  312. {block:Iflink4title}
  313. <div class="navlinks"><a href="{text:link 4 url}">{text:link 4 title}</a></div>
  314. {/block:Iflink4title}
  315.  
  316. </div>
  317.  
  318. <div id="content">
  319. {block:Posts}
  320. <div id="posts">
  321.  
  322. {block:Photo}
  323. {LinkOpenTag}<img src="{PhotoURL-400}" />{LinkCloseTag}
  324. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  325. {/block:Photo}
  326.  
  327. {block:Photoset}
  328. {Photoset-400}
  329. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  330. {/block:Photoset}
  331.  
  332. {block:Video}
  333. {Video-400}
  334. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  335. {/block:Video}
  336.  
  337. {block:Audio}
  338. {Audioplayer}
  339. <br />{PlayCountWithLabel}
  340. {block:Caption}<br /><div class="text">{Caption}</div>{/block:Caption}
  341. {/block:Audio}
  342.  
  343. {block:Quote}
  344. <div class="title">"{Quote}"</div>
  345. {block:Source}<div class="text"><br~ {Source}</div>{/block:Source}
  346. {/block:Quote}
  347.  
  348. {block:Text}
  349. {block:Title}<div class="title">{Title}</div>{/block:Title}
  350. <div class="text">{Body}</div>
  351. {block:Text}
  352.  
  353. {block:Answer}
  354. <div class="title">{Question}</div>
  355. <div class="text"><img src="{AskerPortraitURL-30}"> ~ {Asker}</div>
  356. <div class="text">{Answer}</div>
  357. {/block:Answer}
  358.  
  359. {block:Chat}
  360. {block:Title}{Title}<br />{/block:Title}
  361. {block:Lines}
  362. {block:Label}<strong>{Label}</strong>{/block:Label} {Line}<br />
  363. {/block:Lines}
  364. {/block:Chat}
  365.  
  366. {block:Link}
  367. <a href="{URL}" >{Name}</a>
  368. {block:Description}<br />{Description}{/block:Description}
  369. {/block:Link}
  370.  
  371. <div id="permalink">
  372. <a href="{Permalink}">
  373. {block:Date}{lang:Posted TimeAgo}{/block:Date}
  374. {block:NoteCount} with {NoteCountWithLabel}{/block:NoteCount}
  375. </a>
  376. </div>
  377.  
  378. {block:HasTags}<div id="tags">
  379. {block:Tags}
  380. <a href="{TagURL}">#{Tag} </a>
  381. {/block:Tags}
  382. </div>
  383. {/block:HasTags}
  384.  
  385.  
  386. </div>
  387.  
  388. {block:PostNotes}
  389. <div id="notecontainer">{PostNotes}</div>
  390. {/block:PostNotes}
  391.  
  392. {/block:Posts}
  393.  
  394. </div>
  395.  
  396. <div class="Pagination">
  397. {block:PreviousPage}<a href="{PreviousPage}">{lang:Previous page}</a>{/block:PreviousPage}
  398. {block:NextPage}<a href="{NextPage}">{lang:Next page}</a>{/block:NextPage}
  399. </div>
  400.  
  401. </div>
  402.  
  403. <div id='vertical'></div>
  404. <div id='bubblebar'>
  405. <div class='bubble' id='bubble1'><img src="http://media.tumblr.com/tumblr_lkl6900eU61qfamg6.gif"/>
  406. <div>hello sweetheart!</div>
  407. </div><!--bubble1-->
  408.  
  409. <div class='bubble' id='bubble2'><img src="http://i11.photobucket.com/albums/a168/evelynregly/minigifs/minicaderno2.gif"/>
  410. <div>i hope you're having a good day!</div>
  411. </div><!--bubble2-->
  412.  
  413. <div class='bubble' id='music'><img src="http://static.tumblr.com/rltvkjt/jwflmr3vh/marcadores71.gif"/>
  414. <div id='bubbleplayer'></div>
  415. </div><!--music bubble-->
  416. </div><!--bubbleblar-->
  417. </body>
  418. </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!