Advertisement
paulveretts

Theme #32 // Ultraviolence

Jun 12th, 2014
597
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.82 KB | None | 0 0
  1. <!DOCTYPE html>
  2.  
  3. <!--
  4.  
  5. THEME BY JÚLIA // @mclahei
  6. Base code by @hogwat;
  7.  
  8. YOU CAN:
  9. Tweak the code on your blog.
  10. Reblog/Like the original post.
  11. Come to me if you need any help.
  12. Take little parts of the code to get a desired effect. Keep in mind I mean /little/ parts only.
  13. Enjoy this theme :)
  14.  
  15. YOU CAN'T:
  16. Repost any of the codes.
  17. Remove credit from view.
  18. Use this as a base code, as it was made from one that does not belong to me.
  19.  
  20. -->
  21.  
  22. <head>
  23.  
  24.  
  25. <title>{Title}</title>
  26.  
  27. <link rel="shortcut icon" href="{Favicon}">
  28. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  29. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  30.  
  31. <!--Default Variables-->
  32.  
  33. <meta name="color:Background" content="#ffffff"/>
  34. <meta name="color:Blog Title" content="#fafafa"/>
  35. <meta name="color:Menu" content="#131313"/>
  36. <meta name="color:Menu Hover Background" content="#222"/>
  37. <meta name="color:Title Background" content="#222"/>
  38. <meta name="color:Menu Hover" content="#fafafa"/>
  39. <meta name="color:Quotes" content="#222"/>
  40. <meta name="color:Text" content="#aaaaaa"/>
  41. <meta name="color:Link" content="#000000"/>
  42.  
  43. <meta name="text:Link 1 URL" content="" />
  44. <meta name="text:Link 1" content="" />
  45. <meta name="text:Link 2 URL" content="" />
  46. <meta name="text:Link 2" content="" />
  47. <meta name="text:Link 3 URL" content="" />
  48. <meta name="text:Link 3" content="" />
  49.  
  50. <!--CSS customization here. -->
  51.  
  52. <style type="text/css">
  53.  
  54. #s-m-t-tooltip{
  55. position:absolute;
  56. margin-top: 15px;
  57. z-index:9999;
  58. background:{color:background};
  59. }
  60.  
  61.  
  62. /*basics*/
  63. blockquote {padding:5px 0 5px 30px;
  64. border-left:1px solid #f5f5f5;
  65. margin-left:30px;
  66. }
  67.  
  68. body {
  69. background:{color:background};
  70. color:{color:text};
  71. font-family:arial;
  72. font-size:10px;
  73. text-align:justify;
  74. margin-left:0px;
  75. line-height:16px;}
  76.  
  77. ::selection {
  78. background: #ffff00; /* Safari */
  79. }
  80. ::-moz-selection {
  81. background: #ffff00; /* Firefox */
  82. }
  83.  
  84. a {
  85. color:{color:link};
  86. text-decoration:none;
  87. }
  88.  
  89. a:hover {
  90. text-decoration:underline;
  91. }
  92.  
  93. img{opacity:1;
  94. border:none;
  95. text-decoration:none}
  96.  
  97.  
  98. small {
  99. font-size:9px;}
  100.  
  101. big {
  102. font-size:12px;}
  103.  
  104.  
  105. #title {font-size:20px;
  106. line-height:18px;
  107. color:#222;
  108. font-weight:bolder;
  109. margin-bottom:10px;
  110. text-transform:normal;
  111. text-align:left;}
  112.  
  113.  
  114. /*sidebar*/
  115. #sidebar {text-align:center;
  116. padding:0px;
  117. border-right:1px solid #eee;
  118. margin-left:-350px;
  119. position:fixed;
  120. margin-top:-75px;
  121. width:245px;
  122. height:2000px;
  123. }
  124.  
  125. #mclahei {
  126. width:300px;
  127. font-size:8px;
  128. text-align:center;
  129. margin-top:0px;
  130. font-style:italic;
  131. letter-spacing:2px;
  132. font-weight:thin;
  133. }
  134.  
  135. #mclahei a{
  136. opacity:0.7;
  137. text-align:center;
  138. text-transform:uppercase;
  139. }
  140.  
  141. #blogt {
  142. padding:80px;
  143. margin-top:0px;
  144. background:{color:Title Background};
  145. text-align:center;
  146. font-size:18px;
  147. font-family:arial;
  148. font-weight:bolder;
  149. color:{color:Blog Title};
  150. }
  151.  
  152. #blogt a {
  153. background:#fff;
  154. padding-left:10px;
  155. padding-right:10px;
  156. background:#ffff00;
  157. text-shadow: 0.1em 0.1em 0.1em gray;
  158. background:#ffff00;
  159. }
  160.  
  161. #blogt a:hover {
  162. text-decoration:none;
  163. }
  164.  
  165. #links {
  166. text-align:left;
  167. width:240px;
  168. margin-top:15px;
  169. }
  170.  
  171. #links a {
  172. width:210px;
  173. font-weight:bolder;
  174. border-bottom:1px solid #eee;
  175. color:{color:Menu};
  176. margin-right:5px;
  177. display:inline-block;
  178. margin-bottom:1px;
  179. font-size:11px;
  180. letter-spacing:0px;
  181. font-family:arial;
  182. padding:15px;
  183. padding-left:20px;
  184.  
  185. }
  186.  
  187. #links a:hover {
  188. background:{color:Menu Hover Background};
  189. color:{color:Menu Hover};
  190. }
  191.  
  192. #description {
  193. border:1px solid #eee;
  194. padding:15px;
  195. padding-top:20px;
  196. font-size:12px;
  197. margin:20px 0px;
  198. text-align:justify;
  199. margin-top:0px;
  200. overflow:auto;
  201. height:100px;
  202. }
  203.  
  204. #search {
  205. border-radius:500px;
  206. }
  207.  
  208. /*pagination*/
  209. #pagination {
  210. margin:50px;
  211. font-size:8px;
  212. text-align:center;
  213. text-transform:uppercase;
  214. letter-spacing:2px;
  215. font-style:italic;
  216. }
  217. #pagination a {
  218. padding:0 15px;
  219. }
  220.  
  221. /*container*/
  222. #con {
  223. left:27%;
  224. top:11%;
  225. margin-left:-14px;
  226. position:absolute;
  227. }
  228.  
  229. /*posts*/
  230.  
  231. #entries {
  232. margin-top:0px;
  233. margin-left:130px;
  234. width:400px;
  235. }
  236.  
  237. #posts {
  238. text-align:justify;
  239. width:400px;
  240. {block:IndexPage}
  241. margin-bottom:75px;
  242. {/block:IndexPage}
  243. {block:PermalinkPage}
  244. margin-bottom:50px;
  245. {/block:PermalinkPage}
  246.  
  247. }
  248. #posts img {
  249. max-width:400px;
  250. }
  251.  
  252. #posts img, #posts li, #posts blockquote {max-width: 100%;}
  253. .caption {width:100%;
  254. margin-top:10px;
  255.  
  256. }
  257.  
  258. #karmy img {
  259. border:5px solid #fff;
  260. }
  261.  
  262. #asker {
  263. font-size:7px;
  264. color:#c8c8c8;
  265. margin-top:-50px;
  266. text-align:center;
  267. text-transform:uppercase;
  268. padding:18px;
  269. letter-spacing:2px;
  270. margin-left:0px;
  271. margin-bottom:5px;
  272. }
  273.  
  274. #q {
  275. padding:10px;
  276. font-size:30px;
  277. color:#444;
  278. font-weight:bolder;
  279. background::#f7f7f7;
  280. }
  281.  
  282. #question {
  283. color:#b3b3b3;
  284. padding:10px;
  285. font-size:11px;
  286. margin-left:-5px;
  287. text-align:left;
  288. font-style:italic;
  289. padding-bottom:10px;
  290. border-bottom:1px solid #fafafa;
  291. }
  292.  
  293. /*quote*/
  294.  
  295. #titlequote{text-align:justify;
  296. font-size:18px;
  297. line-height:18px;
  298. color:{color:Quotes};
  299. font-weight:bold;
  300. font-style:italic;
  301. }
  302. #source {
  303. text-align:center;
  304. margin-top:15px;}
  305.  
  306. /*audio*/
  307.  
  308. #song {
  309. font-size:8px;
  310. text-decoration:underline;
  311. letter-spacing:2px;
  312. padding:6px 0px 3px 0px;
  313. text-transform:uppercase;
  314. color:#aaa;
  315. }
  316.  
  317. .albumart {
  318. width:50px;
  319. position:absolute;
  320. z-index:2;
  321. }
  322.  
  323. .audiop {
  324. position:relative;
  325. min-height:56px;
  326. }
  327.  
  328. .audioinfo {
  329. height:50px;
  330. padding:0px 7px;
  331. letter-spacing:1px;
  332. font-size:7px;
  333. line-height:170%;
  334. text-transform:uppercase;
  335. text-align:right;
  336. }
  337.  
  338. .player {
  339. width:20px;
  340. height:20px;
  341. overflow:hidden;
  342. margin-top:6px;
  343. margin-left:6px;
  344. }
  345.  
  346. .playerb {
  347. margin-top:5px;
  348. margin-left:5px;
  349. width:40px;
  350. height:40px;
  351. z-index:3;
  352. position:absolute;
  353. opacity:1;
  354. background-color:black;
  355. -webkit-transition:all 0.6s ease-out;
  356. -moz-transition:all 0.6s ease-out;
  357. transition:all 0.6s ease-out;
  358. }
  359.  
  360. .audiop:hover .playerb {
  361. opacity:0.5;
  362. -webkit-transition:all 0.6s ease-out;
  363. -moz-transition:all 0.6s ease-out;
  364. transition:all 0.6s ease-out;}
  365.  
  366.  
  367. /*asks*/
  368. .q {margin-bottom:10px;
  369. }
  370. .as {
  371. font-weight:bold;}
  372.  
  373. .a {
  374. margin-top:10px;
  375. }
  376.  
  377. b {
  378. color:#222;
  379. }
  380.  
  381. /*chat*/
  382.  
  383. .chat ol {
  384. padding:0;
  385. list-style:none;
  386. }
  387. .line {padding:5px 0;}
  388.  
  389. .label {font-weight:bold;
  390. }
  391.  
  392. /*permalink and notes*/
  393.  
  394. #permalink {
  395. margin-top:-15px;
  396. padding:10px;
  397. background:#222;
  398. text-align:center;
  399. border:1px solid #eee;
  400. font-size:7px;
  401. letter-spacing:2px;
  402. text-transform:uppercase;
  403. opacity:0;
  404. -webkit-transition: all 0.5s linear;
  405. -moz-transition: all 0.5s linear;
  406. transition: all 0.5s linear;
  407. }
  408.  
  409. #permalink a {margin-right:0px;color:#f5f5f5;
  410. }
  411.  
  412. #permalink a:hover {
  413. text-decoration:none;
  414. }
  415.  
  416. #posts:hover #permalink {
  417. opacity:1;
  418. margin-top:15px;
  419. -webkit-transition: all 0.3s linear;
  420. -moz-transition: all 0.3s linear;
  421. transition: all 0.3s linear;}
  422.  
  423. .tags {
  424. word-break:break-all;
  425. font-size:7px;
  426. letter-spacing:2px;
  427. color:#131313;
  428. text-transform:uppercase;
  429. }
  430.  
  431. .tags a {
  432. margin-left:2px;
  433. color:#000;
  434. background:#ffff00;
  435. }
  436.  
  437. #tags a:hover {
  438. background:#ffff00;
  439. color:#000;
  440. }
  441.  
  442. .pagenotes {
  443. {block:IndexPage}
  444. display: none!important;
  445. {/block:IndexPage}
  446. width:370px;
  447. padding:20px;
  448. background:#fbfbfb;
  449. text-align:justify;
  450. font-size:7px;
  451. letter-spacing:1px;
  452. text-transform:uppercase;
  453. }
  454.  
  455. .pagenotes a:hover{
  456. font-style:normal;
  457. }
  458.  
  459. .pagenotes img {
  460. display:none!important;}
  461. .pagenotes li {
  462. list-style-type:none;
  463. padding:5px 0px;
  464. text-align;justify;
  465. margin:0 0 0 -40px;
  466. }
  467.  
  468.  
  469. @font-face {font-family:Castro; src: url(http://static.tumblr.com/mdbfvxz/Qx9n4yxs4/castroscript_personal_use_only.ttf) format("truetype"); }
  470.  
  471.  
  472. {CustomCSS}
  473.  
  474.  
  475. </style>
  476.  
  477. <script type="text/javascript">
  478. <!--
  479. function handleThis(formElm)
  480. {
  481. window.location="/tagged/"+formElm.number.value+"";
  482. return false;
  483. }
  484. // -->
  485. </script>
  486.  
  487. </head>
  488.  
  489. <body>
  490.  
  491. <div id="con">
  492.  
  493. <div id="sidebar">
  494. <div id="blogt">{Title}</div>
  495. <div id="description">{Description}</div>
  496.  
  497. <div id="search">
  498. <form onsubmit="return handleThis(this)">
  499. <input type="text" name="number" />
  500. <input type="submit" value="Search" />
  501. </form>
  502. </div>
  503.  
  504. <div id="links">
  505. <a href="/" title="home">Home</a><br>
  506. <a href="/ask" title="message">Message</a><br>
  507. {block:ifLink1}<a href="{text:Link 1 URL}" title="{text:Link 1}">{text:Link 1}</a>{/block:ifLink1}<br>
  508. {block:ifLink2}<a href="{text:Link 2 URL}" title="{text:Link 2}">{text:Link 2}</a>{/block:ifLink2}<br>
  509. {block:ifLink3}<a href="{text:Link 3 URL}" title="{text:Link 3}">{text:Link 3}</a>{/block:ifLink3}
  510. </div>
  511. </div>
  512.  
  513.  
  514.  
  515.  
  516. <div id="entries">
  517.  
  518. {block:Posts}
  519. <div id="posts">
  520.  
  521.  
  522. {block:Quote}
  523.  
  524.  
  525. <div id="titlequote">❝ {Quote}</div>
  526. {block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
  527. {/block:Quote}
  528.  
  529.  
  530.  
  531. {block:Text}
  532.  
  533. {block:Title}
  534. <div id="title">{Title}</div>{/block:Title}
  535. {Body}
  536. {/block:Text}
  537.  
  538. {block:Link}
  539. <div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
  540. {/block:Link}
  541.  
  542. {block:Chat}
  543. {block:Title}
  544. <h1>{Title}</h1>
  545. {/block:Title}
  546. <div class="chat">
  547. <ol>{block:Lines}
  548. <li class="line {Alt}">
  549. {block:Label}
  550. <span class="label">
  551. {Label}</span>
  552. {/block:Label}{Line}</li>
  553. {/block:Lines}
  554. </ol></div>
  555. {/block:Chat}
  556.  
  557. {block:Photo}
  558. {LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{LinkCloseTag}
  559. {/block:Photo}
  560.  
  561. {block:Photoset}
  562. {Photoset-400}
  563. {/block:Photoset}
  564.  
  565. {block:Video}
  566. {Video-400}
  567. {/block:Video}
  568.  
  569. {block:Audio}
  570. <div class="audiop">
  571. <div class="playerb"><div class="player">
  572. {AudioPlayerBlack}
  573. </div></div>
  574. <img class="albumart" img src="http://i.imgur.com/q1W8vCH.png"/>
  575. {block:AlbumArt}
  576. <img class="albumart" src="{AlbumArtURL}" />
  577. {/block:AlbumArt}
  578. <div class="audioinfo">
  579. {block:TrackName}<div id="song"><b>{TrackName}</b></div>{/block:TrackName}
  580. {block:Artist}{Artist}{/block:Artist}
  581. {block:Album}— {Album}{/block:Album}
  582. {block:Playcount}<br>PLAYED: {Playcount} times<br>{/block:Playcount}</div>
  583. </div>
  584. {/block:Audio}
  585.  
  586. {block:Answer}
  587. <div id="asker">
  588. <div id="q">Q:</div>{QUESTION}</div>
  589. <div style="margin-left:5px;padding-left:20px; border-left:3px solid #fafafa;">{Answer}</div>
  590. {/block:Answer}
  591.  
  592. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  593.  
  594. {block:Date}
  595. <div id="permalink">
  596. <a href="{Permalink}" >[{12Hour}:{Minutes} {AmPm}]</a>{block:NoteCount}<a href="{Permalink}"> + {NoteCount}</a>{/block:NoteCount}{block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}"> / via</a>{block:ContentSource}<a href="{ReblogRootURL}" title="{ReblogRootName}"> / source</a>{/block:ContentSource}{/block:RebloggedFrom}
  597. {block:HasTags}<div id="tags">{block:Tags}<a href="{TagUrl}">#{Tag} </a>{/block:Tags}</div>{/block:HasTags}
  598. </div>
  599. {/block:Date}
  600.  
  601.  
  602.  
  603. </div>
  604.  
  605.  
  606. {block:PostNotes}
  607. <div class="pagenotes">
  608. {PostNotes}
  609. </div>
  610. {/block:PostNotes}
  611.  
  612.  
  613. {/block:Posts}
  614.  
  615. <div id="pagination">
  616. {block:Pagination}
  617. {block:PreviousPage}
  618. <a href="{PreviousPage}">&larr; previous </a>
  619. {/block:PreviousPage}
  620.  
  621.  
  622. {block:NextPage}
  623. <a href="{NextPage}">next &rarr;</a>
  624. {/block:NextPage}
  625. {/block:Pagination}
  626.  
  627. <div id="mclahei"><a href="http://mclahei.tumblr.com">© theme by júlia</a></div>
  628.  
  629. </div>
  630.  
  631.  
  632. </div>
  633.  
  634. </div>
  635.  
  636.  
  637. {block:ContentSource}
  638. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  639. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  640. {/block:SourceLogo}
  641. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  642. {/block:ContentSource}
  643.  
  644. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement