elisewhite

Theme 02 - Alignment

Nov 13th, 2013
1,983
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.36 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head><title>{Title}</title>
  4. <link rel="shortcut icon" href="{Favicon}">
  5. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  6. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  7.  
  8. <!---------------------------------------------------------------------
  9. ----------------- THEME BY ELISE WHITE (MISSCAPALDI) ------------------
  10. -------- PLEASE DO NOT REMOVE THE CREDIT OR USE AS A BASE CODE --------
  11. ------------------- THANKS AND HAVE A LOVELY DAY ;) -------------------
  12. ---------------------------------------------------------------------->
  13.  
  14. <meta name="color:Background" content="#ffffff"/>
  15. <meta name="color:Text" content="#838282"/>
  16. <meta name="color:Link" content="#b8b8b8"/>
  17. <meta name="color:Image Border" content="#F2F2F2"/>
  18. <meta name="color:Link Hover" content="#F2F2F2"/>
  19. <meta name="color:Links Text Hover" content="#f5f5f5"/>
  20. <meta name="color:Links Hover Background" content="#f5f5f5"/>
  21. <meta name="color:Scrollbar" content="#D6D5D5">
  22. <meta name="color:Chat Odd" content="#D6D5D5">
  23. <meta name="color:Chat Even" content="#D6D5D5">
  24.  
  25. <meta name="image:Sidebar" content=""/>
  26. <meta name="image:Top Accent" content=""/>
  27.  
  28. <meta name="text:link1" content="" />
  29. <meta name="text:link1 url" content="/">
  30. <meta name="text:link2" content="" />
  31. <meta name="text:link2 url" content="/">
  32. <meta name="text:link3" content="" />
  33. <meta name="text:link3 url" content="/">
  34. <meta name="text:link4" content="" />
  35. <meta name="text:link4 url" content="/">
  36.  
  37. <meta name="if:ShowTitle" content="1">
  38. <meta name="if:RightSidebar" content="">
  39.  
  40. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  41.  
  42. <link href='http://fonts.googleapis.com/css?family=Noto+Sans|Crimson+Text:400italic' rel='stylesheet' type='text/css'>
  43.  
  44. <style type="text/css">
  45.  
  46. ::-webkit-scrollbar-thumb{
  47. background-color: {color:scrollbar};
  48. border: 2px solid {color:background};
  49. height:auto;
  50. }
  51.  
  52. ::-webkit-scrollbar {
  53. height:auto;
  54. width:11px;
  55. background-color:{color:scrollbar};
  56. border:5px solid {color:background};
  57. }
  58.  
  59. div#qTip {
  60. padding: 2px;
  61. display: none;
  62. text-align: center;
  63. position: absolute;
  64. font-style:italic;
  65. font-size:8px;
  66. line-height:10px;
  67. font-family:cambria;
  68. text-transform:uppercase;
  69. z-index: 1000;
  70. background: white;
  71. border:1px solid;
  72. border-color:#ebebeb;
  73. color:#c9c9c9;
  74. letter-spacing: 1px;
  75. }
  76.  
  77. body {
  78. background:{color:background};
  79. margin:0px;
  80. color:{color:text};
  81. font-family:Calibri;
  82. font-size:10px;
  83. line-height:100%;
  84. }
  85.  
  86. a {
  87. text-decoration:none;
  88. outline:none;
  89. -moz-outline-style:none;
  90. color:{color:link};
  91. -moz-transition-duration:1s;
  92. -webkit-transition-duration:1s;
  93. -o-transition-duration:1s;
  94. }
  95. a:hover {
  96. color:{color:Link Hover};
  97. -moz-transition-duration:1s;
  98. -webkit-transition-duration:1s;
  99. -o-transition-duration:1s;
  100. }
  101.  
  102. img {
  103. border:none;
  104. }
  105.  
  106. blockquote {
  107. padding-left:5px;
  108. border-left:2px solid;
  109. }
  110.  
  111. blockquote blockquote {
  112. padding-left:5px;
  113. border-left:2px solid;
  114. }
  115.  
  116. h1 {
  117. font-size:9px;
  118. font-family: 'Noto Sans', sans-serif;
  119. font-weight:normal;
  120. text-transform:uppercase;
  121. text-align:center;
  122. margin-bottom:15px;
  123. letter-spacing:1px;
  124. }
  125.  
  126. hr {
  127. border-top: 1px solid #CCCCCC;
  128. border-right: 1px solid #FFFFFF;
  129. border-bottom: 1px solid #FFFFFF;
  130. border-left: 1px solid #FFFFFF;
  131. }
  132.  
  133. #entries {
  134. padding:10px;
  135. width:500px;
  136. margin-left:500px;
  137. {block:IfRightSidebar}
  138. margin-left:325px;
  139. {/block:IfRightSidebar}
  140. margin-top:40px;
  141. }
  142.  
  143. #post {
  144. width:500px;
  145. padding-bottom:20px;
  146. }
  147.  
  148. .albumcover {
  149. position: relative;
  150. z-index: 1;
  151. height: 80px;
  152. float:left;
  153. border:1px solid {color:image border};
  154. padding:4px;
  155. }
  156.  
  157. .playbutton {
  158. width:20px;
  159. height:30px;
  160. overflow: hidden;
  161. position: relative;
  162. z-index: 99;
  163. margin: 15px 24px 13px 16px;
  164. }
  165.  
  166. .musicbin {
  167. background-color: #fff;
  168. position: absolute;
  169. z-index: 99;
  170. margin-top: 15px;
  171. margin-left: 15px;
  172. opacity: 0.2;
  173. -webkit-transition: opacity 0.5s linear;
  174. -webkit-transition: all 0.5s linear;
  175. -moz-transition: all 0.5s linear;
  176. -o-transition: all 0.5s linear;
  177. }
  178. .musicbin:hover {
  179. opacity:0.5;
  180. }
  181.  
  182. .musicinfo {
  183. padding-top:20px;
  184. font-size:12px;
  185. margin-left: 100px;
  186. text-align:center;
  187. margin-top:5px;
  188. min-height:70px;
  189. }
  190.  
  191. .quote {
  192. padding:5px 5px 15px 5px;
  193. text-align:center;
  194. font-size:14px;
  195. letter-spacing:1px;
  196. font-family: 'Crimson Text', serif;
  197. font-style:italic;
  198. }
  199.  
  200. .linkpost {
  201. text-align:center;
  202. padding: 0px 15px 0px 15px;
  203. }
  204.  
  205.  
  206. #sidebar {
  207. width:150px;
  208. position:fixed;
  209. margin-left:250px;
  210. {block:IfRightSidebar}
  211. margin-left:950px;
  212. {/block:IfRightSidebar}
  213. margin-top:150px;
  214. }
  215.  
  216. #sidebarimage {
  217. width: 150px;
  218. height:auto;
  219. z-index:1;
  220. }
  221. #sidebarimage img {
  222. width:150px;
  223. height:auto;
  224. opacity:1;
  225. z-index:1;
  226. }
  227.  
  228. #sidebar:hover #elements {
  229. margin-top:80px;
  230. -moz-transition-duration:1s;
  231. -webkit-transition-duration:1s;
  232. -o-transition-duration:1s;
  233. }
  234.  
  235. #sidebar:hover #title {
  236. opacity:.9;
  237. -moz-transition-duration:1s;
  238. -webkit-transition-duration:1s;
  239. -o-transition-duration:1s;
  240. }
  241.  
  242. #topaccent {
  243. width: 150px;
  244. height:auto;
  245. margin-bottom:5px;
  246. }
  247. #topaccent img {
  248. width:150px;
  249. height:auto;
  250. }
  251.  
  252. #elements {
  253. -moz-transition-duration:1s;
  254. -webkit-transition-duration:1s;
  255. -o-transition-duration:1s;
  256. }
  257.  
  258. #title {
  259. font-size:9px;
  260. font-family: 'Noto Sans', sans-serif;
  261. font-weight:normal;
  262. text-transform:uppercase;
  263. margin-top:75px;
  264. letter-spacing:1px;
  265. opacity:0;
  266. position:absolute;
  267. background-color:#fff;
  268. width:150px;
  269. display:block;
  270. padding:2px 0px 2px 0px;
  271. text-align:center;
  272. -moz-transition-duration:1s;
  273. -webkit-transition-duration:1s;
  274. -o-transition-duration:1s;
  275. }
  276.  
  277. #links {
  278. letter-spacing:0px;
  279. font-family:calibri;
  280. width:150px;
  281. background-color:#fff;
  282. font-size:9px;
  283. text-transform:uppercase;
  284. text-align:center;
  285. z-index:-10;
  286. font-style:none;
  287. }
  288.  
  289. #links a {
  290. width:10px;
  291. margin: 0px 3px 0px 3px;
  292. color:{color:link};
  293. letter-spacing:0px;
  294. padding-left:2px;
  295. padding-right:2px;
  296. text-decoration:none;
  297. -moz-transition-duration:0.7s;
  298. -webkit-transition-duration:0.7s;
  299. -o-transition-duration:0.7s;
  300. }
  301.  
  302. #links a:hover {
  303. text-align:center;
  304. background-color: {color:Links Hover Background};
  305. color: {color:Links Text Hover};
  306. padding-left:2px;
  307. padding-right:2px;
  308. -moz-transition-duration:0.7s;
  309. -webkit-transition-duration:0.7s;
  310. -o-transition-duration:0.7s;
  311. }
  312.  
  313. #description {
  314. position:absolute;
  315. text-align:justify;
  316. width:150px;
  317. color: {color:text};
  318. font-family:calibri;
  319. text-transform:none;
  320. font-style:none;
  321. font-size:10px;
  322. line-height:100%;
  323. z-index:-10;
  324. bottom:-20px;
  325. }
  326.  
  327. #info {
  328. font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  329. margin-top:10px;
  330. padding: 5px 0px 5px 0px;
  331. word-spacing:1px;
  332. font-size:7px;
  333. color:{color:text};
  334. text-transform:uppercase;
  335. font-style:normal;
  336. text-align:left;
  337. border-bottom: 1px solid #CCCCCC;
  338. -moz-transition-duration:0.5s;
  339. -webkit-transition-duration:0.5s;
  340. -o-transition-duration:0.5s;
  341. }
  342. #info a {
  343. margin-right:2px;
  344. color:{color:link};
  345. font-style:normal;
  346. }
  347. #info a:hover {
  348. color:{color:link hover};
  349. }
  350.  
  351. .tags {
  352. font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
  353. width:495px;
  354. text-transform:normal;
  355. line-height:120%;
  356. font-size:9px;
  357. text-align:center;
  358. opacity:0;
  359. padding-top:5px;
  360. padding-bottom:15px;
  361. -moz-transition-duration:1s;
  362. -webkit-transition-duration:1s;
  363. -o-transition-duration:1s;
  364. }
  365. .tags a{
  366. color:{color:link};
  367. -moz-transition-duration:.5s;
  368. -webkit-transition-duration:.5s;
  369. -o-transition-duration:.5s;
  370. }
  371. .tags a:hover{
  372. color:{color:link hover};
  373. -moz-transition-duration:.5s;
  374. -webkit-transition-duration:.5s;
  375. -o-transition-duration:.5s;
  376. }
  377. #post:hover .tags{
  378. opacity:1;
  379. -moz-transition-duration:1s;
  380. -webkit-transition-duration:1s;
  381. -o-transition-duration:1s;
  382. }
  383.  
  384. #asker {
  385. float:right;
  386. margin-left:5px;
  387. }
  388. #asker img{
  389. border:1px solid {color:image border};
  390. padding:2px;
  391. }
  392.  
  393. #answerer {
  394. float:left;
  395. margin-right:5px;
  396. }
  397. #answerer img{
  398. border:1px solid {color:image border};
  399. padding:2px;
  400. }
  401.  
  402. .chat .label {
  403. text-transform:uppercase;
  404. font-weight:bold;
  405. }
  406.  
  407. .line_odd .label {color: {color:Chat Odd}}
  408. .line_even .label {color: {color:Chat Even}}
  409.  
  410.  
  411. #credit {
  412. font-size:9px;
  413. font-family: Candara, Calibri, Segoe, "Segoe UI", Optima, Arial, sans-serif;
  414. font-style:italic;
  415. letter-spacing:1px;
  416. }
  417.  
  418. #credit a {
  419. background-color:#fff;
  420. padding:5px;
  421. border-top:1px solid #e9e9e9;
  422. border-bottom:1px solid #e9e9e9;
  423. position:fixed;
  424. right:15px;
  425. bottom:10px;
  426. -moz-transition-duration:1s;
  427. -webkit-transition-duration:1s;
  428. -o-transition-duration:1s;
  429. }
  430.  
  431. #credit a:hover {
  432. color:#fff;
  433. background-color:#747474;
  434. -moz-transition-duration:1s;
  435. -webkit-transition-duration:1s;
  436. -o-transition-duration:1s;
  437. }
  438.  
  439. {CustomCSS}</style></head><body>
  440.  
  441. <!--------------------------------------------
  442. SIDEBAR
  443. --------------------------------------------->
  444.  
  445. <div id="sidebar">
  446.  
  447. <div id="topaccent"><img src="{image:Top Accent}"></div>
  448.  
  449. {block:IfShowTitle}
  450. <div id="title">{title}</div>
  451. {/block:IfShowTitle}
  452.  
  453. <div id="sidebarimage"><img src="{image:Sidebar}"></div>
  454.  
  455. <div id="elements">
  456. <div id="description">
  457.  
  458. <div id="links">
  459. <a href="{text:link1 url}">{text:link1}</a>
  460. <a href="{text:link2 url}">{text:link2}</a>
  461. <a href="{text:link3 url}">{text:link3}</a>
  462. <a href="{text:link4 url}">{text:link4}</a>
  463. </div>
  464.  
  465. <div style="margin: 5px 0px 15px 0px;">
  466. {description}
  467. {block:Pagination}{block:NextPage}<a href="{NextPage}" title="next page" style="padding-left:10px;">>></a>{/block:NextPage}{/block:Pagination}{/block:Pagination}
  468. </div>
  469.  
  470. <p><hr /></p>
  471.  
  472. </div>
  473. </div>
  474.  
  475. </div>
  476.  
  477.  
  478. <!--------------------------------------------
  479. POST TYPES
  480. --------------------------------------------->
  481.  
  482. <div id="entries">{block:Posts}<div id="post">
  483.  
  484. <!---------- TEXT POSTS ---------->
  485.  
  486. {block:Text}
  487. <h1>{block:Title}{Title}{/block:Title}</h1>{Body}
  488. {/block:Text}
  489.  
  490. <!---------- PHOTO POSTS ---------->
  491.  
  492. {block:Photo}
  493. {LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}
  494. {block:Caption}{Caption}{/block:Caption}
  495. {/block:Photo}
  496.  
  497. <!---------- PHOTOSET POSTS ---------->
  498.  
  499. {block:Photoset}
  500. {Photoset-500}
  501. {block:Caption}{Caption}{/block:Caption}
  502. {/block:Photoset}
  503.  
  504. <!---------- QUOTE POSTS ---------->
  505.  
  506. {block:Quote}
  507. <div class="quote">{Quote}</div>
  508. {block:Source}<div style="text-align:right; margin-right:15px;">{Source}</div>{/block:Source}
  509. {/block:Quote}
  510.  
  511. <!---------- LINK POSTS ---------->
  512.  
  513. {block:Link}
  514. <div class="linkpost">
  515. <h1><a href="{URL}" {Target}>{Name}</a></h1>
  516. {block:Description}{Description}{/block:Description}
  517. </div>
  518. {/block:Link}
  519.  
  520. <!---------- CHAT POSTS ---------->
  521.  
  522. {block:Chat}
  523. {block:Title}<h1>{Title}</h1>{/block:Title}
  524. <div class="chat">{block:Lines}<div class="line_{Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label}
  525. {Line}<br /></div>{/block:Lines}</div>
  526. {/block:Chat}
  527.  
  528. <!---------- AUDIO POSTS ---------->
  529.  
  530. {block:Audio}
  531. <div class="musicbin"><div class="playbutton">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div></div>
  532. {block:AlbumArt}<img src="{AlbumArtURL}" class="albumcover">{/block:AlbumArt}
  533. <div class="musicinfo">
  534. {block:TrackName}<div style="font-size:11px; padding:5px!imporant; padding-bottom:5px; text-transform:uppercase; margin-bottom: 15px; font-weight:bold; letter-spacing:1px; border-bottom:1px solid #E6E6E6; text-align:left;">{TrackName}</div>{/block:Trackname}
  535. {block:Artist}<div style="font-size:10px; margin-bottom: 2px; text-align:right;">{Artist}</div>{/block:Artist}
  536. {block:Album}<div style="font-size:10px; margin-bottom: 2px; text-align:right;">{Album}</div>{/block:Album}
  537. {block:PlayCount}<div style="font-style:normal; font-size:8px; text-transform:uppercase; letter-spacing:1px; text-align:right;">{PlayCount} plays</div> {/block:PlayCount}
  538. </div>
  539. <div style="margin-top:20px;">{block:caption}{Caption}{/block:caption}</div>
  540. {/block:Audio}
  541.  
  542. <!---------- VIDEO POSTS ---------->
  543.  
  544. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  545.  
  546. <!---------- ANSWER POSTS ---------->
  547.  
  548. {block:Answer}
  549. <div id="asker"><img src="{AskerPortraitURL-48}"></div>
  550. <div style="text-align:right; font-size:11px; border-bottom: 1px solid #E6E6E6; padding:5px; margin-right:59px;">{Asker} asked:</div>
  551. <div style="padding:5px 5px 15px 5px; margin-top:5px; margin-right:59px; min-height:10px; text-align:right;">{Question}</div>
  552. <br>
  553. <div id="answerer"><img src="{PortraitURL-48}"></div>
  554. <div style="text-align:left; font-size:11px; border-bottom: 1px solid #E6E6E6; padding:5px; margin-left:59px;">{Name} replied:</div>
  555. <div style="padding:0px 5px 5px 5px; margin-top:5px; margin-left:59px; min-height:10px; text-align:left;">{Answer}</div>
  556. {/block:Answer}
  557.  
  558. <!--------------------------------------------
  559. POST INFO
  560. --------------------------------------------->
  561.  
  562. {block:Date}
  563. <div id="info">
  564. <a href="{Permalink}">{TimeAgo}</a>{/block:Date}{block:NoteCount} with <a href="{Permalink}">{NoteCountWithLabel}</a> {/block:NoteCount} {block:RebloggedFrom} via <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}
  565. {block:ContentSource}<div style="float:right;"><a href="{SourceURL}">source</a></div>{/block:ContentSource}</div>
  566. {block:HasTags}
  567. <div class="tags">{block:Tags} <a href="{TagURL}">&nbsp; -{Tag}</a>&nbsp; {/block:Tags}</div>{/block:HasTags}
  568. <div class="postnote">
  569. {block:PostNotes}{PostNotes}{/block:PostNotes}
  570. </div>
  571. </div>
  572. {/block:Posts}
  573.  
  574. <!--------------------------------------------
  575. CREDIT - YOU MAY EDIT BUT YOU MAY NOT REMOVE
  576. --------------------------------------------->
  577.  
  578. <div id="credit"><a href="http://misscapaldi.tumblr.com">elise white</a></div>
  579.  
  580. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment