Advertisement
getnakedmiley

The Lucky One theme

Jun 15th, 2013
3,831
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.93 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5.  
  6. <!-- The Lucky One by STATEOFGRACES -->
  7.  
  8. <meta name="color:bg" content="#FFFFFF">
  9. <meta name="color:link" content="#E6E4E4">
  10. <meta name="color:text" content="#9A9A9A">
  11. <meta name="color:tags" content="#EDEDED">
  12. <meta name="color:scrollbar" content="#D6D5D5">
  13. <meta name="color:border" content="#F0F0F0">
  14. <meta name="color:accent1" content="#FCFCFC">
  15. <meta name="color:accent2" content="#ACD373">
  16.  
  17. <meta name="color:headerbg" content="#E7E7E7">
  18. <meta name="image:himage" content="">
  19.  
  20. <meta name="text:linkA" content="">
  21. <meta name="text:linkA url" content="/">
  22. <meta name="text:linkB" content="">
  23. <meta name="text:linkB url" content="/">
  24. <meta name="text:linkC" content="">
  25. <meta name="text:linkC url" content="/">
  26.  
  27.  
  28. <title>{Title}</title>
  29. {block:Description}
  30. <meta name="description" content="{MetaDescription}"/>
  31. {/block:Description}
  32. <link rel="shortcut icon" href="{Favicon}" />
  33. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  34.  
  35.  
  36. <link href='http://fonts.googleapis.com/css?family=Lato:400,700italic' rel='stylesheet' type='text/css'>
  37.  
  38. <link href='http://fonts.googleapis.com/css?family=Asap:400,400italic' rel='stylesheet' type='text/css'>
  39.  
  40. </head>
  41.  
  42. <style type="text/css">
  43.  
  44.  
  45. a {
  46. color:{color:link};
  47. text-decoration:none;
  48. -moz-transition-duration:0.4s;
  49. -webkit-transition-duration:0.4s;
  50. -o-transition-duration:0.4s;
  51. }
  52.  
  53. a:hover {
  54. color:{color:accent2};
  55. text-decoration:none;
  56. -moz-transition-duration:0.4s;
  57. -webkit-transition-duration:0.4s;
  58. -o-transition-duration:0.4s;
  59. }
  60.  
  61.  
  62. ::-webkit-scrollbar {
  63. width:8px;
  64. }
  65.  
  66. ::-webkit-scrollbar-thumb {
  67. background-color:{color:scrollbar};
  68. width:2px;
  69. border:3px solid {color:bg};
  70. }
  71.  
  72. ::-webkit-scrollbar-track {
  73. background-color:{color:bg};
  74. }
  75.  
  76. ::selection {
  77. background-color: {color:accent1};
  78. }
  79.  
  80.  
  81. body {
  82. font-family: 'Lato', sans-serif;
  83. font-weight:normal;
  84. background-color:{color:bg};
  85. }
  86.  
  87. h1 {
  88. font-weight:normal;
  89. text-align:left;
  90. line-height:120%;
  91. letter-spacing:0px;
  92. font-size:12px;
  93. color:{color:text};
  94. }
  95.  
  96. h2 {
  97. text-align:left;
  98. line-height:120%;
  99. letter-spacing:0px;
  100. font-size:14px;
  101. color:{color:accent2};
  102. font-weight:700;
  103. font-style:italic;
  104. }
  105.  
  106. h3 {
  107. text-align:left;
  108. line-height:80%;
  109. letter-spacing:-1px;
  110. font-size:12px;
  111. color:{color:accent2};
  112. font-weight:normal;
  113. font-family: 'Asap', sans-serif;
  114. }
  115.  
  116. blockquote {
  117. border-left:2px solid {color:text};
  118. padding-left:5px;
  119. margin:5px;
  120. }
  121.  
  122.  
  123. #theme {
  124. text-align: center;
  125. width:600px;
  126. margin: -10px auto -10px auto;
  127. background-color:{color:bg};
  128. }
  129.  
  130. #header {
  131. position:fixed;
  132. width:100%;
  133. left:0;
  134. top:0;
  135. height:200px;
  136. background-color:{color:headerbg};
  137. z-index:-200;
  138. }
  139.  
  140. #himg {
  141. position:fixed;
  142. margin:0px;
  143. height:200px;
  144. text-align:center;
  145. z-index:-100;
  146. }
  147.  
  148. #himg img {
  149. height:200px;
  150. position:fixed;
  151. width:600px;
  152. text-align:center;
  153. z-index:-100;
  154. }
  155.  
  156. #tbar {
  157. margin:0px auto 0px;
  158. width:500px;
  159. padding:10px 50px 10px;
  160. }
  161.  
  162. #tb {
  163. border-bottom:1px solid {color:accent1};
  164. background-color:{color:bg};
  165. text-align:center;
  166. }
  167.  
  168. .pagi {
  169. padding:20px;
  170. font-style:normal;
  171. text-align:center;
  172. font-size:24px;
  173. color:{color:link};
  174. text-transform:uppercase;
  175. }
  176.  
  177. #desc {
  178. text-align:center;
  179. padding:0px 30px 30px;
  180. font-size:10px;
  181. line-height:120%;
  182. color:{color:text};
  183. word-wrap:break-word;
  184. border-bottom:1px solid {color:accent1};
  185. }
  186.  
  187. #links {
  188. padding:10px;
  189. margin:2px 0px 2px;
  190. color:{color:text};
  191. background-color:{color:accent1};
  192. font-size:8px;
  193. letter-spacing:0px;
  194. text-transform:uppercase;
  195. }
  196.  
  197. #links a {
  198. color:{color:text};
  199. margin:0px 5px 0px;
  200. }
  201.  
  202. .t {
  203. padding:30px 30px 0px;
  204. color:{color:accent2};
  205. font-weight:700;
  206. font-style:italic;
  207. font-size:13px;
  208. line-height:90%;
  209. letter-spacing:0px;
  210. }
  211.  
  212. .t a {
  213. color:{color:accent2};
  214. }
  215.  
  216. .t a:hover {
  217. color:{color:text};
  218. }
  219.  
  220. #stuffbg {
  221. left:0;
  222. height:auto;
  223. top:198px;
  224. width:100%;
  225. position:absolute;
  226. text-align:center;
  227. color:{color:text};
  228. background-color:{color:bg};
  229. word-wrap:break-word;
  230. }
  231.  
  232. #stuffcontainer {
  233. width:500px;
  234. margin:50px auto 50px;
  235. padding-bottom:20px;
  236. text-align:justify;
  237. color:{color:text};
  238. background-color:{color:bg};
  239. word-wrap:break-word;
  240. }
  241.  
  242.  
  243. #stuff {
  244. text-align:center;
  245. font-size:9px;
  246. letter-spacing:1px;
  247. line-height:90%;
  248. color:{color:text};
  249. word-wrap:break-word;
  250. width:500px;
  251. }
  252.  
  253. #caption {
  254. text-align:justify;
  255. font-size:9px;
  256. text-align:justify;
  257. line-height:100%;
  258. word-wrap:break-word;
  259. width:500px;
  260. }
  261.  
  262. .asker {
  263. font-weight:700;
  264. font-style:italic;
  265. text-transform:lowercase;
  266. font-size:14px;
  267. color:{color:bg};
  268. }
  269.  
  270. .ask {
  271. padding:10px;
  272. width:480px;
  273. text-align:right;
  274. font-size:10px;
  275. color:{color:bg};
  276. background-color:{color:accent2};
  277. word-wrap:break-word;
  278. }
  279.  
  280. .ans {
  281. width:480px;
  282. padding:10px;
  283. color:{color:text};
  284. }
  285.  
  286. .audio {
  287. width:500px;
  288. }
  289.  
  290. .ai {
  291. text-align:center;
  292. line-height:130%;
  293. background-color:{color:accent1};
  294. padding:10px;
  295. font-size:9px;
  296. color:{color:accent2};
  297. width:480px;
  298. }
  299.  
  300. .track {
  301. font-family: 'Asap', sans-serif;
  302. font-weight:700;
  303. font-size:16px;
  304. letter-spacing:-1px;
  305. }
  306.  
  307. .aplay {
  308. width:490px;
  309. padding:5px;
  310. text-align:center;
  311. background-color:{color:bg};
  312. overflow:hidden;
  313. }
  314.  
  315. .postinfo {
  316. width:490px;
  317. font-family: 'Asap', sans-serif;
  318. margin-bottom:50px;
  319. display:inline-block;
  320. text-transform:uppercase;
  321. padding-top:5px;
  322. font-size:10px;
  323. color:{color:bg};
  324. text-align:left;
  325. -moz-transition-duration:0.5s;
  326. -webkit-transition-duration:0.5s;
  327. -o-transition-duration:0.5s;
  328. }
  329.  
  330. .postinfo a {
  331. color:{color:link};
  332. display:inline-block;
  333. }
  334.  
  335. .postinfo a:hover {
  336. color:{color:accent2};
  337. }
  338.  
  339. .time {
  340. position:absolute;
  341. text-align:left;
  342. }
  343.  
  344. .time a {
  345. color:{color:accent};
  346. margin-right:2px;
  347. border-bottom:1px dotted {color:border};
  348. }
  349.  
  350. .time a:hover {
  351. border-bottom:1px dotted {color:accent2};
  352. }
  353.  
  354. .note {
  355. text-transform:uppercase;
  356. font-style:normal;
  357. letter-spacing:0px;
  358. font-size:8px;
  359. text-align:left;
  360. line-height:90%;
  361. margin-left:-40px;
  362. }
  363.  
  364. .note li {
  365. list-style-type:none;
  366. border-bottom:1px solid {color:border};
  367. padding:15px;
  368. text-align:left;
  369. margin:0px;
  370. background-color:{color:bg};
  371. -moz-transition-duration:0.5s;
  372. -webkit-transition-duration:0.5s;
  373. -o-transition-duration:0.5s;
  374. }
  375.  
  376. .note li:hover {
  377. background-color:{color:accent1};
  378. -moz-transition-duration:0.5s;
  379. -webkit-transition-duration:0.5s;
  380. -o-transition-duration:0.5s;
  381. }
  382.  
  383. .note img {
  384. display:none;
  385. }
  386.  
  387. .blogs {
  388. position:absolute;
  389. text-align:left;
  390. margin-left:505px;
  391. padding:5px;
  392. text-transform:uppercase;
  393. font-style:normal;
  394. letter-spacing:0px;
  395. font-size:8px;
  396. -moz-transition-duration:0.5s;
  397. -webkit-transition-duration:0.5s;
  398. -o-transition-duration:0.5s;
  399. }
  400.  
  401. .accent {
  402. font-size:7px;
  403. color:{color:bg};
  404. padding:5px;
  405. background-color:{color:accent1};
  406. }
  407.  
  408. .tags {
  409. width:500px;
  410. margin-top:15px;
  411. font-style:normal;
  412. font-size:8px;
  413. text-align:left;
  414. font-family: 'Asap', sans-serif;
  415. letter-spacing:0.5px;
  416. -moz-transition-duration:0.5s;
  417. -webkit-transition-duration:0.5s;
  418. -o-transition-duration:0.5s;
  419. }
  420.  
  421. .tags a {
  422. color:{color:link};
  423. margin-right:2px;
  424. border-bottom:1px dotted {color:bg};
  425. -moz-transition-duration:0.5s;
  426. -webkit-transition-duration:0.5s;
  427. -o-transition-duration:0.5s;
  428. }
  429.  
  430. .tags a:hover {
  431. color:{color:accent2};
  432. border-bottom:1px dotted {color:accent2};
  433. -moz-transition-duration:0.5s;
  434. -webkit-transition-duration:0.5s;
  435. -o-transition-duration:0.5s;
  436. }
  437.  
  438. .convo {
  439. padding-bottom:10px;
  440. }
  441.  
  442. ul.chat, .chat ol, .chat li {
  443. list-style:none;
  444. margin:0px;
  445. padding:0px;
  446. }
  447.  
  448. .chat li:nth-child(odd) {
  449. background-color:{color:bg};
  450. padding:5px;
  451. }
  452.  
  453. .chat li:nth-child(even) {
  454. background-color:{color:accent1};
  455. padding:5px;
  456. }
  457.  
  458. .label {
  459. margin-right:5px;
  460. }
  461.  
  462.  
  463. {CustomCSS}
  464.  
  465. </style>
  466.  
  467. <body>
  468.  
  469. <div id="theme">
  470.  
  471. <div id="header">
  472. </div>
  473.  
  474. <div id="himg">
  475.  
  476. <img src="{image:himage}"/>
  477.  
  478. </div>
  479.  
  480. <div id="stuffbg">
  481.  
  482. <div id="tbar">
  483.  
  484. <div id="tb">
  485. <div class="t"><a href="/">{Title}</a></div>
  486.  
  487. <div id="desc">
  488. {Description}
  489. </div>
  490.  
  491. <div id="links">
  492. <a href="/ask">ask</a>
  493. <a href="{text:linkA url}">{text:linkA}</a>
  494. {/block:IfLinkA}
  495. {block:IfLinkB}
  496. <a href="{text:linkB url}">{text:linkB}</a>
  497. {/block:IfLinkB}
  498. {block:IfLinkC}
  499. <a href="{text:linkC url}">{text:linkC}</a>
  500. {/block:IfLinkC}
  501. <a href="http://stateofgraces.tumblr.com/">©</a>
  502. </div>
  503.  
  504. </div>
  505.  
  506. </div>
  507.  
  508. <div id="stuffcontainer">
  509.  
  510. {block:Posts}
  511.  
  512. <div class="blogs">{block:RebloggedFrom}<span class="accent"><a href="{ReblogParentURL}">via</a></span><br><br>{/block:RebloggedFrom}{block:ContentSource}<span class="accent"> <a href="{SourceURL}">©</a></span>{/block:ContentSource}</div>
  513.  
  514. {block:Text}
  515. <div id="caption">
  516. {block:Title}<h2>{Title}</h2>{/block:Title}
  517. {Body}
  518. </div>
  519. {/block:Text}
  520.  
  521. {block:Quote}
  522. <div id="caption">
  523. <h1>“{Quote}”</h1><h3>— {Source}</h3>
  524. </div>
  525. {/block:Quote}
  526.  
  527. {block:Link}
  528. <div id="caption">
  529. <a href="{URL}"><h2>{Name}</h2></a>
  530. {block:Description}<p>{Description}</p>{/block:Description}
  531. </div>
  532. {/block:Link}
  533.  
  534. {block:Photo}
  535. <div id="stuff">
  536. <center>
  537. <img src="{PhotoURL-500}"/>
  538. </center>
  539. </div>
  540. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}
  541. {/block:Photo}
  542.  
  543. {block:Photoset}
  544. <div id="stuff">
  545. <center>
  546. {Photoset-500}
  547. </center>
  548. </div>
  549. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}
  550. {/block:Photoset}
  551.  
  552. {block:Chat}
  553. <div id="caption">
  554. <div class="convo"><ul class="chat">
  555. {block:Title}<h1>{Title}</h1>{/block:Title}
  556. {block:Lines}
  557. <li>{block:Label}
  558. <span class="label">{Label}</span>
  559. {/block:Label}&nbsp;{Line}</li>
  560. {/block:Lines}</ul>
  561. </div>
  562. </div>{/block:Chat}
  563.  
  564. {block:Video}
  565. <div id="stuff">
  566. {Video-500}
  567. </div>
  568. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}
  569. {/block:Video}
  570.  
  571. {block:Answer}
  572. <div class="ask">
  573. <span class="asker">{Asker}</span><br>{Question}</div>
  574. <div id="caption"><div class="ans">{Answer}</div>
  575. </div>
  576. {/block:answer}
  577.  
  578. {block:Audio}
  579. <div class="audio">
  580. <div class="ai">{block:Artist}{Artist}{/block:Artist}
  581. <br>{block:TrackName}<span class="track">{TrackName}</span>{/block:TrackName}
  582. <br>{block:Album}{Album}{/block:Album}
  583. <br>{block:PlayCount}Played {FormattedPlayCount} times{/block:PlayCount}
  584. </div>
  585. </div>
  586. <div class="aplay">{AudioPlayerWhite}</div>
  587. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}
  588. {/block:Audio}
  589.  
  590. {block:Date}
  591. <div class="postinfo">
  592. <div class="time"><a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix};</a>{block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel};</a>{/block:NoteCount}</div>
  593.  
  594.  
  595. {block:HasTags}<div class="tags">{block:Tags}<a href="{TagURL}">{Tag};</a>{/block:Tags}
  596. </div>{/block:HasTags}
  597.  
  598. </div>
  599. {/block:Date}
  600.  
  601.  
  602. <div class="note">
  603. {block:PostNotes}{PostNotes}{/block:PostNotes}
  604. </div>
  605.  
  606. {/block:Posts}
  607.  
  608. {block:Pagination}
  609. <div class="pagi">
  610. {block:PreviousPage}
  611. <a href="{PreviousPage}">◀</a>
  612. {/block:PreviousPage}
  613. {block:NextPage}
  614. <a href="{NextPage}">▶</a>
  615. {/block:NextPage}
  616. </div>
  617. {/block:Pagination}
  618.  
  619. </div>
  620.  
  621. </div>
  622.  
  623.  
  624.  
  625. </div>
  626. </div>
  627. </div>
  628.  
  629. </body>
  630.  
  631. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement