Advertisement
MAThemes

Theme #5 with the random images script

Aug 6th, 2013
58
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.63 KB | None | 0 0
  1. <!--
  2. Theme #5 by:
  3. myackles.tumblr.com
  4.  
  5. Editing is okay as long as you:
  6. DO NOT CLAIM AS YOUR OWN OR REMOVE THE CREDIT!!
  7. -->
  8.  
  9. <html><head>
  10.  
  11. <link href='http://fonts.googleapis.com/css?family=Kotta+One|Rosarivo:400,400italic|PT+Mono|Trocchi|Arapey:400italic,400' rel='stylesheet' type='text/css'>
  12.  
  13.  
  14. <meta name="color:Background" content="#fafafa"/>
  15. <meta name="color:Font" content="#b1b1b1"/>
  16. <meta name="color:Links" content="#cea1d8"/>
  17. <meta name="color:Links Hover" content="#8f8c91"/>
  18. <meta name="color:Bold" content="#a094a2"/>
  19. <meta name="color:Posts Title" content="#c3c0c4"/>
  20. <meta name="color:Blog Title" content="#a8a6a8"/>
  21. <meta name="color:Post Info Border" content="#eeecec"/>
  22. <meta name="color:Scrollbar" content="#ccc9cc"/>
  23. <meta name="color:Ask Background" content="#edebee"/>
  24. <meta name="text:Blog Title" content="popular in life & death"/>
  25. <meta name="text:Link 1 url" content="/" />
  26. <meta name="text:Link 1 title" content="link" />
  27. <meta name="text:Link 2 url" content="/" />
  28. <meta name="text:Link 2 title" content="link 2" />
  29. <meta name="text:Link 3 url" content="/" />
  30. <meta name="text:Link 3 title" content="link 3" />
  31. <meta name="text:Link 4 url" content="/" />
  32. <meta name="text:Link 4 title" content="link 4" />
  33. <meta name="text:Link 5 url" content="/" />
  34. <meta name="text:Link 5 title" content="link 5" />
  35.  
  36. <meta name="image:Sidebar Image" content="
  37. http://25.media.tumblr.com/tumblr_mc3eflUEbn1r9c5eeo1_250.gif"/>
  38. <meta name="image:Background Image" content=""/>
  39. <title>{Title}</title>
  40. <link rel="shortcut icon" href="{Favicon}">
  41.  
  42. <style type="text/css">
  43.  
  44.  
  45. /* ~ BASICS ~ */
  46.  
  47. body {
  48. font-family:Cambria;
  49. font-size: 11px;
  50. line-height: 100%;
  51. text-align: justify;
  52. color: {color:Font};
  53. background-color: {color:Background};
  54. background-image: url('{image:Background Image}');
  55. background-attachment: fixed;
  56. background-position: left top;
  57. background-repeat: repeat; }
  58.  
  59.  
  60. a:link, a:visited, a:active {
  61. text-decoration: none;
  62. color: {color:Links};
  63. -webkit-transition: all 0.4s ease-in-out;
  64. -moz-transition: all 0.4s ease-in-out;
  65. -o-transition: all 0.4s ease-in-out;
  66. transition: all 0.4s ease-in-out;
  67. }
  68.  
  69. a:hover {
  70.  
  71. -webkit-transition: all 0.5s ease-out;
  72. -moz-transition: all 0.5s ease-out;
  73. transition: all 0.5s ease-out;
  74. text-shadow:4px 0 0 rgba(0,0,0,0.17), -4px 0 0 rgba(0,0,0,0.17);
  75. color: {color:Links hover};}
  76.  
  77.  
  78.  
  79. l {
  80. padding: 1px 7px 2px 3px;
  81. text-decoration: none;
  82. font-size: 12px;
  83. font-family:Cambria;
  84. color: {color:Links};
  85. border: 1px solid {color:Background};
  86. -webkit-transition: all 0.4s ease-in-out;
  87. -moz-transition: all 0.4s ease-in-out;
  88. -o-transition: all 0.4s ease-in-out;
  89. transition: all 0.4s ease-in-out;
  90. border-bottom: 0px solid transparent; }
  91.  
  92. b, strong {
  93. color: {color:Bold}; }
  94.  
  95.  
  96. blockquote {
  97. margin-left: 0px;
  98. padding-left:4px;
  99. border-left: 4px solid {color:Bold}; }
  100.  
  101.  
  102. #title {
  103. margin-top: 10px;
  104. margin-bottom: 5px;
  105. padding-bottom: 4px;
  106. font-size: 14px;
  107.  
  108. text-align: center; }
  109.  
  110. #link {
  111. margin-top: 5px;
  112. padding-bottom: 4px;
  113. font-size: 16px;
  114. text-align: center;}
  115.  
  116.  
  117. h1 {
  118. font-size: 19px;
  119. line-height: 15px;
  120. letter-spacing: 0px;
  121. text-transform: none;
  122. font-weight: normal;
  123. text-align: left;
  124. margin-top: 0px;
  125. margin-bottom: -5px;
  126. padding: 0px;
  127. color: {color:Posts Title}; }
  128.  
  129.  
  130. /* ~ POSTS ~ */
  131.  
  132. #entries {
  133. font-family: Cambria;
  134. margin-left: 250px;
  135. margin-top: 30px;
  136. margin-bottom: 20px;
  137. width: 520px; }
  138.  
  139. #posts {
  140. overflow: hidden;
  141. font-family: Cambria;
  142. margin-bottom: 10px;
  143. padding: 10px 10px 0px 10px;
  144. }
  145.  
  146. /* ~ POST INFO ~ */
  147.  
  148. #info {
  149. font-size:10px;
  150. text-align:center;
  151. padding: 2px;
  152. font-family: Cambria;
  153. opacity:1;
  154. border-top: 1px solid {color:Post info border};
  155. border-bottom: 1px solid {color:Post info border};
  156. margin-top:5px;
  157. text-transform: uppercase;
  158. }
  159.  
  160. /* ~ QUOTE ~ */
  161.  
  162. #quote {
  163. font-family: Cambria;
  164. font-size: 16px; }
  165.  
  166. #source {
  167. font-size: 11px;
  168. margin-top: 5px;}
  169.  
  170.  
  171. /* ~ AUDIO ~ */
  172.  
  173. #audio {
  174. padding: 0px; }
  175.  
  176. .qu {
  177. opacity: 0.7;
  178. font-family:Cambria;
  179. font-size: 16px;
  180. font-weight: bold;
  181. line-height: 33px;}
  182.  
  183. .ote {
  184. opacity: 0.9;
  185. margin-top: -34px;
  186. text-indent: 15px; }
  187.  
  188. .audio {
  189. background-color :white;
  190. display: block; }
  191.  
  192.  
  193. /* ~ QUESTION ~ */
  194.  
  195. .questions {
  196. text-align: center;
  197. margin: 3px;
  198. font-size: 12px;
  199. padding:12px;
  200. background: {color:Ask Background};
  201. }
  202.  
  203. .questionsq {margin: 5px;}
  204.  
  205. /* ~ CHAT ~ */
  206.  
  207. margin:8px;
  208. .user_1 .label {color:{color:links}; font-weight:bold;}
  209. .user_2 .label {color:{color:links}; font-weight:bold;}
  210. .user_3 .label {color:{color:links}; font-weight:bold;}
  211. .user_4 .label {color:{color:links}; font-weight:bold;}
  212. .user_5 .label {color:{color:links}; font-weight:bold;}
  213. .user_6 .label {color:{color:links}; font-weight:bold;}
  214. .user_7 .label {color:{color:links}; font-weight:bold;}
  215. .user_8 .label {color:{color:links}; font-weight:bold;}
  216. .user_9 .label {color:{color:links}; font-weight:bold;}
  217. .user_10 .label {color:{color:links}; font-weight:bold;}
  218. .user_11 .label {color:{color:links}; font-weight:bold;}
  219. .user_12 .label {color:{color:links}; font-weight:bold;}
  220. .user_13 .label {color:{color:links}; font-weight:bold;}
  221. .user_14 .label {color:{color:links}; font-weight:bold;}
  222. .user_15 .label {color:{color:links}; font-weight:bold;}
  223. .user_16 .label {color:{color:links}; font-weight:bold;}
  224. .user_17 .label {color:{color:links}; font-weight:bold;}
  225. .user_18 .label {color:{color:links}; font-weight:bold;}
  226. .user_19 .label {color:{color:links}; font-weight:bold;}
  227. .user_20 .label {color:{color:links}; font-weight:bold;}
  228.  
  229. ul.chat, .chat ol, .chat li {
  230.  
  231. padding:0px;
  232. list-style:none;}
  233.  
  234. /* ~ SCROLLBAR ~ */
  235.  
  236. ::-webkit-scrollbar-thumb:vertical {
  237. height:10px;
  238. background-color: {color:Scrollbar};
  239. }
  240.  
  241. ::-webkit-scrollbar-thumb:horizontal {
  242. height:10px;
  243. background-color: {color:Scrollbar};
  244. }
  245.  
  246. ::-webkit-scrollbar {
  247. height: 10px;
  248. width: 5px;
  249. }
  250.  
  251. /* ~ PERMALINK NOTES PAGE ~ */
  252.  
  253. #postnotes {
  254. margin:0px 0px 0px 0px;
  255. width:510px;
  256. padding:5px;
  257. font-family: Cambria;
  258. font-size: 10px;
  259. background-color: none; }
  260.  
  261. #postnotes a {
  262. margin-top:1px; }
  263.  
  264. ol.notes li.note {
  265. padding:1px;
  266. border-bottom: solid 0px;}
  267.  
  268. ol.notes li.note img.avatar {
  269. vertical-align:-4px;
  270. margin-right:0px;
  271. width:16px;
  272. height:16px; }
  273.  
  274. /* ~ SIDEBAR ~ */
  275. #sbarb {
  276. width:200px;
  277. padding: 4px;
  278. border:2px solid {color:Post info border};
  279. }
  280.  
  281. #center {
  282. margin-left: auto;
  283. margin-right: auto;
  284. width: 800px; }
  285.  
  286. #position {
  287. position: fixed;
  288. margin-top: 164px;
  289. width: 250px;
  290. margin-left: -30px}
  291.  
  292. }
  293.  
  294. .sidebar {
  295. position: fixed;
  296. width: 200px;
  297. padding: 0px 0px 30px 0px;
  298. font: 11px Cambria;
  299. color: {color:Font};
  300. }
  301.  
  302. .ttl {
  303. margin-left: 25px;
  304. margin-bottom: 3px;
  305. width:200px;
  306. text-transform: uppercase;
  307. font: 12px 'Arapey';
  308. letter-spacing: 2px;
  309. color: {color:Blog Title}; }
  310.  
  311. #description {
  312. position: fixed;border-top: 2px solid {color:Post info border};
  313. opacity: 0.9;
  314. overflow: hidden;
  315. margin-top: 0px;
  316. margin-left: 25px;
  317. width: 200px;
  318. font-size: 11px;
  319. font-family:Cambria;
  320. padding: 6px 0px 4px 0px;
  321. text-align: justify;
  322. color: {color:Font};
  323. background: none;
  324. -webkit-transition-duration:
  325. }
  326.  
  327. /* ~ SUBLINKS ~ */
  328.  
  329. .sublinks {width: 200px;
  330. margin-top: -10px;
  331. font-family:cambria;
  332. font-size: 10px;
  333. text-transform: uppercase;
  334. letter-spacing: 0px;
  335. color: {color:Links};
  336. padding-bottom: 4px;
  337. }
  338.  
  339. .sublinks a {
  340. font-family:cambria;
  341. font-size: 10px;
  342.  
  343. text-transform: uppercase;
  344. letter-spacing: 0px;
  345. color: {color:Links};
  346. padding-bottom: 4px;
  347. }
  348.  
  349. .sublinks a:hover{
  350. font-family:cambria;
  351. font-size: 10px;
  352.  
  353. text-transform: uppercase;
  354. letter-spacing: 0px;
  355. padding-bottom: 4px;
  356. -webkit-transition: all 0.5s ease-out;
  357. -moz-transition: all 0.5s ease-out;
  358. transition: all 0.5s ease-out;
  359. text-shadow:4px 0 0 rgba(0,0,0,0.17), -4px 0 0 rgba(0,0,0,0.17);
  360. color: {color:Links hover};
  361. }
  362.  
  363.  
  364. .edno {
  365. position: fixed;
  366. width: 100px;
  367. margin-left:40px;
  368. margin-top:130px;
  369. padding:2px;
  370. text-align:center;
  371. z-index:3;}
  372.  
  373. .edno a {
  374. float: left;
  375. display: block;
  376. padding: 2px;
  377. font-size:10px;
  378. font-family:Cambria;
  379. text-align: center;
  380. margin-right:1px;
  381. margin-bottom:1px;
  382. width:40px;
  383. background-color:#f5f5f5;
  384. color: #969297;
  385. text-transform:uppercase;
  386. height:10px;
  387. -webkit-transition: all 0.2s ease-out;
  388. -moz-transition: all 0.2s ease-out;
  389. -webkit-transform: rotate(5deg);
  390. -moz-border-radius:5px;
  391. border-bottom-left-radius: .em;
  392.  
  393. }
  394.  
  395. .edno a:hover{
  396. text-align:center;
  397. background-color:#f5f5f5;
  398. color: #6d746d;
  399. font-size:10px;
  400. letter-spacing:0px;
  401. opacity:0.6;
  402. text-transform:uppercase;
  403. letter-spacing:0px;
  404. }
  405.  
  406. .dve {
  407. position:fixed;
  408. width:100px;
  409. margin-left:44px;
  410. margin-top:149px;
  411. padding:2px;
  412. text-align:center;
  413. z-index:3;
  414. }
  415. .dve a {
  416. float:left;
  417. display:block;
  418. padding:3px;
  419. letter-spacing:0px;
  420. font-size:10px;
  421. font-family:Cambria;
  422. text-align:center;
  423. margin-right:1px;
  424. margin-bottom:1px;
  425. width:40px;
  426. background-color:#f5f5f5;
  427. color: #969297;
  428. text-transform:uppercase;
  429. height:10px;
  430. -webkit-transition: all 0.2s ease-out;
  431. -moz-transition: all 0.2s ease-out;
  432. -webkit-transform:rotate(-2deg);
  433. -moz-border-radius:5px;
  434. border-bottom-left-radius: .em;
  435. }
  436. .dve a:hover{
  437. text-align:center;
  438. background-color: #f5f5f5;
  439. color: #6d746d;
  440. font-size:10px;
  441. letter-spacing:0px;
  442. opacity:0.6;
  443. text-transform:uppercase;
  444. letter-spacing: 0px;
  445. }
  446.  
  447.  
  448. .tri {
  449. position:fixed;
  450. width:100px;
  451. margin-left:40px;
  452. margin-top:169px;
  453. padding: 2px;
  454. text-align:center;
  455. z-index:3;
  456. }
  457.  
  458. .tri a {
  459. float:left;
  460. display:block;
  461. padding:3px;
  462. letter-spacing:0px;
  463. font-size:10px;
  464. font-family:Cambria;
  465. text-align:center;
  466. margin-right:1px;
  467. margin-bottom:1px;
  468. width:40px;
  469. background-color:#f5f5f5;
  470. color: #969297;
  471. text-transform:uppercase;
  472. height:10px;
  473. -webkit-transition: all 0.2s ease-out;
  474. -moz-transition: all 0.2s ease-out;
  475. -webkit-transform: rotate(4deg);
  476. -moz-border-radius:5px;
  477. border-bottom-left-radius: .em;
  478. }
  479. .tri a:hover{
  480. text-align:center;
  481. background-color: #f5f5f5;
  482. color: #6d746d;
  483. font-size:10px;
  484. letter-spacing:0px;
  485. opacity:0.6;
  486. text-transform:uppercase;
  487. letter-spacing: 0px;
  488. }
  489.  
  490.  
  491. /* ~ PAGES ~ */
  492.  
  493. #pagination {
  494. font-family:Cambria;
  495. text-align:center;
  496. font-size:12px;
  497. margin-top: 8px;
  498.  
  499. text-transform:uppercase}
  500.  
  501. /* ~ CREDIT ~ */
  502.  
  503. #credit {
  504. position: fixed;
  505. bottom: 4px;
  506. right: 10px;
  507. width: 40px;
  508. -webkit-transition-duration: .90s; }
  509.  
  510. .crdt {
  511. display: block;
  512. width: 40px;
  513. padding: 2px 0px 4px 0px;
  514. font: 13px Cambria;
  515. font-style: italic;
  516. text-align: center;
  517. color: {color:Links};
  518. background: {color:Background};
  519. border: 1px solid {color:Background};
  520. -webkit-transition-duration: .90s; }
  521. .crdt a, a {
  522. text-decoration: none;
  523. text-transform: none;
  524. color: {color:Links}; }
  525. .crdt:hover {
  526. color: {color:Links Hover};
  527. background: {color:Background};
  528.  
  529. </style>
  530. </head>
  531. <body>
  532. <div id="credit">
  533. <a href="http://myackles.tumblr.com/tagged/my-themes" target="_blank">
  534. <div class="crdt">theme</div></a>
  535. </div>
  536. <div id="center">
  537. <div id="position">
  538. <div class="ttl"><br>
  539. <center>
  540. {text:Blog Title}
  541. </center>
  542. </div>
  543.  
  544. <div id="sidebar">
  545. <div style="padding-bottom:10px;margin-bottom:10px;">
  546.  
  547. <center><div class="sublinks2">
  548. <div class="edno"><a href="/">HOME</a>&nbsp;</div>
  549. <div class="dve"><a href="/ask">MESSAGE</a>&nbsp;</div>
  550. <div class="tri"><a href="/archive">ARCHIVE</a>&nbsp;</div>
  551. </div>
  552. <div id="sbarb"><div id="sbarb2">
  553. <a href="/">
  554.  
  555.  
  556.  
  557. <script language="JavaScript">
  558. <!--
  559.  
  560. /*
  561. Random Image Script- By JavaScript Kit (http://www.javascriptkit.com)
  562. Over 400+ free JavaScripts here!
  563. Keep this notice intact please
  564. */
  565.  
  566. function random_imglink(){
  567. var myimages=new Array()
  568. //specify random images below. You can have as many as you wish
  569. myimages[1]="image1.gif"
  570. myimages[2]="image2.gif"
  571. myimages[3]="image3.gif"
  572. myimages[4]="image4.gif"
  573. myimages[5]="image5.gif"
  574. myimages[6]="image6.gif"
  575.  
  576. var ry=Math.floor(Math.random()*myimages.length)
  577. if (ry==0)
  578. ry=1
  579. document.write('<img src="'+myimages[ry]+'" border=0 width=200px>')
  580. }
  581. random_imglink()
  582. //-->
  583. </script>
  584.  
  585.  
  586.  
  587. </a></div></div>
  588. </div><center>
  589. <div class="sublinks">
  590. <a href="{text:Link 1 url}">{text:Link 1 title}</a> &nbsp;
  591. <a href="{text:Link 2 url}">{text:Link 2 title}</a> &nbsp;
  592. <a href="{text:Link 3 url}">{text:Link 3 title}</a> &nbsp;
  593. <a href="{text:Link 4 url}">{text:Link 4 title}</a> &nbsp;
  594. <a href="{text:Link 5 url}">{text:Link 5 title}</a>
  595. </div>
  596.  
  597. <div id="description">
  598.  
  599. <center>{description}
  600. <div id="pagination">
  601. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">ยซ</a>{/block:PreviousPage}{CurrentPage}/{TotalPages} {block:NextPage}<a href="{NextPage}">ยป</a>{/block:NextPage}
  602. {/block:Pagination}</div></div>
  603.  
  604. </center>
  605.  
  606. </div>
  607. </div>
  608.  
  609.  
  610.  
  611. <div id="entries">
  612. {block:Posts}
  613. <div id="posts">
  614.  
  615.  
  616. {block:Title}
  617. <h1>{Title}&nbsp;</h1>
  618. {/block:Title}
  619.  
  620. {block:Text}
  621. {Body}
  622. {/block:Text}
  623.  
  624. {block:Quote}
  625. <div id="quote">
  626.  
  627. <center>"
  628. {Quote}"
  629. </center>
  630.  
  631. </div>
  632. {block:Source}
  633. <div id="source">
  634. <center>
  635. {Source}
  636. </center>
  637. </div>{/block:Source}
  638. {/block:Quote}
  639.  
  640. {block:Link}
  641. <a href="{URL}" class="link" {Target}><h1>{Name}&nbsp;</h1></a>
  642. {block:Description}{Description}{/block:Description}
  643. {/block:Link}
  644.  
  645. {block:Photo}
  646. {LinkOpenTag}
  647. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  648. {LinkCloseTag}<br>
  649. {block:Caption}
  650. {Caption}
  651. {/block:Caption}
  652. {/block:Photo}
  653.  
  654. {block:Photoset}
  655. {Photoset-500}
  656. {block:Caption}
  657. {Caption}
  658. {/block:Caption}
  659. {/block:Photoset}
  660.  
  661. {block:Chat}
  662. <ul class="chat">
  663. {block:Lines}
  664. <li class="user_{UserNumber}">
  665. {block:Label}
  666. <span class="label">{Label}</span>
  667. {/block:Label}
  668. &nbsp;{Line}</li>
  669. {/block:Lines}</ul>
  670. {/block:Chat}
  671.  
  672. {block:Video}
  673. {Video-500}
  674. {block:Caption}
  675. {Caption}
  676. {/block:Caption}
  677. {/block:Video}
  678.  
  679. {block:Answer}
  680. <div class="questions">{Asker} wondered: {Question}</div>
  681. <div class="questionsq">{Answer}</div>
  682. {/block:Answer}
  683.  
  684. {block:Audio}
  685. <div id="audio">
  686. {block:AlbumArt}
  687. <img src="{AlbumArtURL}" width="55px" height="55px" align="left" style="margin-right:10px" />
  688. {/block:AlbumArt}
  689. {block:TrackName}
  690. Song: <b>{TrackName}</b><br>
  691. {/block:TrackName}
  692. {block:Artist}
  693. Artist: <b>{Artist}</b><br><br>
  694. {/block:Artist}
  695. {AudioPlayerBlack}<br>
  696. {block:Caption}
  697. {Caption}
  698. {/block:Caption}
  699. </div>
  700.  
  701. {/block:Audio}
  702.  
  703.  
  704. <div id="info">
  705. <a href="{Permalink}">{TimeAgo}</a>{/block:Date}{block:NoteCount}&nbsp;-&nbsp;<a href="{Permalink}">{NoteCount} notes</a>{/block:NoteCount}{block:RebloggedFrom}&nbsp;&nbsp;-&nbsp;<a href="{ReblogParentURL}"><a href="{ReblogParentURL}"> via</a>{/block:RebloggedFrom}
  706. {block:ContentSource}&nbsp;-&nbsp;<a href="{SourceURL}"> source</a>
  707. </a>{block:ContentSource}{/block:RebloggedFrom}<br>
  708. {block:HasTags}{block:Tags}# <a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}</div></div><br>
  709. {/block:Posts}
  710. {block:PostNotes}{PostNotes}{/block:PostNotes}
  711. {/block:Posts}</div></div>
  712. </div>
  713. </body>
  714. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement