Advertisement
skyrimthemes

Theme - Odd Look

Sep 27th, 2014
3,119
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.75 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <title>{Title}</title>
  6. <link rel="shortcut icon" href="{Favicon}">
  7. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  8. {block:Description}
  9. <meta name="description" content="{MetaDescription}" />
  10. {/block:Description}
  11.  
  12. <meta name="color:border" content="#000000">
  13. <meta name="image:sidebar image" content="">
  14. <meta name="image:navigation image" content="">
  15. <meta name="text:faq text" content="place your basic faq info here. if you have basic html knowledge and want to edit your faq further, venture into the code, and good luck with it! if this doesn't work, please message me at skyrim themes.">
  16. <meta name="text:second description" content="this is the description that turns up in your navigation. it looks better if you fill it up tbh but whatever you do, have fun with it. also, again, if you want to edit the code further, then just go in to the html. only recommended if you actually have basic html knowledge. also, if you want more links, you can go in and edit the code.">
  17. <meta name="text:link 1 url" content="">
  18. <meta name="text:link 1 name" content="">
  19. <meta name="text:link 2 url" content="">
  20. <meta name="text:link 2 name" content="">
  21. <meta name="text:link 3 url" content="">
  22. <meta name="text:link 3 name" content="">
  23. <meta name="text:link 4 url" content="">
  24. <meta name="text:link 4 name" content="">
  25. <meta name="text:link 5 url" content="">
  26. <meta name="text:link 5 name" content="">
  27. <meta name="text:link 6 url" content="">
  28. <meta name="text:link 6 name" content="">
  29. <meta name="text:link 7 url" content="">
  30. <meta name="text:link 7 name" content="">
  31.  
  32. <!--pushy things like annoying chicks who are pushy-->
  33.  
  34. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  35. <script>
  36. $(document).ready(function(){
  37. $(".messageclick").click(function(){
  38. $(".closed").toggleClass("open");
  39. });
  40. });
  41. </script>
  42. <script>
  43. $(document).ready(function(){
  44. $(".naviclick").click(function(){
  45. $(".shut").toggleClass("up");
  46. });
  47. });
  48. </script>
  49.  
  50. <link href="//netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
  51.  
  52. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  53.  
  54. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  55.  
  56. <script>
  57.  
  58. (function($){
  59.  
  60. $(document).ready(function(){
  61.  
  62. $("a[title]").style_my_tooltips({
  63.  
  64. tip_follows_cursor:true,
  65.  
  66. tip_delay_time:30,
  67.  
  68. tip_fade_speed:300,
  69.  
  70. attribute:"title"
  71.  
  72. });
  73.  
  74. });
  75.  
  76. })(jQuery);
  77.  
  78. </script>
  79.  
  80. <style type="text/css">
  81.  
  82. /*tooltips*/
  83.  
  84. #s-m-t-tooltip{
  85. font-size:10px;
  86. position:absolute;
  87. margin-top: 20px;
  88. margin-left:20px;
  89. font-weight:bold;
  90. z-index:999999999999999999999999999999999999999999999;
  91. background:#000;
  92. padding:3px;
  93. color:#fff;
  94. text-transform:uppercase;
  95. font-family:calibri;
  96. padding:2px 3px 2px 3px;
  97. -webkit-transition:all 0.3s;
  98. -moz-transition:all 0.3s;
  99. -ms-transition:all 0.3s;
  100. -o-transition:all 0.3s;
  101. transition:all 0.3s;
  102. }
  103.  
  104. /*scrollbar*/
  105.  
  106. ::-webkit-scrollbar { left:0; width: 5px; height: 5px; background:#000; }
  107. ::-webkit-scrollbar-thumb { background-color:#fff;border:1px solid #000; }
  108.  
  109. body {
  110. font: 10px calibri;
  111. color:#000;
  112. background-color:#fff;
  113. text-align:justify;
  114. }
  115.  
  116. a {
  117. color:#000;
  118. text-decoration:none;
  119. -webkit-transition:all 0.5s;
  120. -moz-transition:all 0.5s;
  121. -ms-transition:all 0.5s;
  122. -o-transition:all 0.5s;
  123. transition:all 0.5s;
  124. }
  125.  
  126. a:hover {
  127. color:#aaa;
  128. -webkit-transition:all 0.5s;
  129. -moz-transition:all 0.5s;
  130. -ms-transition:all 0.5s;
  131. -o-transition:all 0.5s;
  132. transition:all 0.5s;
  133. }
  134.  
  135. blockquote {
  136. margin-left:5px;
  137. border-left:1px solid #000;
  138. padding-left:5px;
  139. }
  140.  
  141. .top {
  142. width:100%;
  143. height:20px;
  144. background-color:{color:border};
  145. top:0;
  146. left:0;
  147. position:fixed;
  148. z-index:999999999999999999999;
  149. }
  150.  
  151. .bottom {
  152. width:100%;
  153. height:20px;
  154. background-color:{color:border};
  155. bottom:0;
  156. left:0;
  157. position:fixed;
  158. z-index:999999999999999999999;
  159. }
  160.  
  161. .left {
  162. height:100%;
  163. width:20px;
  164. background-color:{color:border};
  165. top:0;
  166. left:0;
  167. position:fixed;
  168. z-index:999999999999999999999;
  169. }
  170.  
  171. .right {
  172. height:100%;
  173. width:20px;
  174. background-color:{color:border};
  175. top:0;
  176. right:0;
  177. position:fixed;
  178. z-index:999999999999999999999;
  179. }
  180.  
  181. .sbar {
  182. top:70px;
  183. left:70px;
  184. position:fixed;
  185. width:100px;
  186. }
  187.  
  188. .sbar img {
  189. width:100px;
  190. height:100px;
  191. display:block;
  192. border-radius:50%;
  193. -webkit-transition:all 0.5s;
  194. -moz-transition:all 0.5s;
  195. -ms-transition:all 0.5s;
  196. -o-transition:all 0.5s;
  197. transition:all 0.5s;
  198. }
  199.  
  200. .sbar img:hover {
  201. border-radius:0;
  202. -webkit-transition:all 0.5s;
  203. -moz-transition:all 0.5s;
  204. -ms-transition:all 0.5s;
  205. -o-transition:all 0.5s;
  206. transition:all 0.5s;
  207. }
  208.  
  209. .txt1 {
  210. font-size:9px;
  211. color:#000;
  212. letter-spacing:1px;
  213. text-transform:uppercase;
  214. padding-top:5px;
  215. line-height:100%;
  216. }
  217.  
  218. .navilinks {
  219. bottom:30px;
  220. left:35px;
  221. position:fixed;
  222. z-index:9;
  223. }
  224.  
  225. .navilinks a {
  226. color:#000;
  227. font-size:10px;
  228. text-decoration:none;
  229. letter-spacing:1px;
  230. text-transform:uppercase;
  231. padding-right:15px;
  232. cursor:help;
  233. }
  234.  
  235. #messageme {
  236. width:380px;
  237. background-color:{color:border};
  238. padding:10px;
  239. left:50%;
  240. margin-left:-200px;
  241. color:#fff;
  242. position:fixed;
  243. z-index:9999999;
  244. overflow:hidden;
  245. text-align:left;
  246. }
  247.  
  248. .closed {
  249. bottom:-500px;
  250. -webkit-transition:all 0.5s;
  251. -moz-transition:all 0.5s;
  252. -ms-transition:all 0.5s;
  253. -o-transition:all 0.5s;
  254. transition:all 0.5s;
  255. }
  256.  
  257. .open {
  258. bottom:20px;
  259. -webkit-transition:all 0.5s;
  260. -moz-transition:all 0.5s;
  261. -ms-transition:all 0.5s;
  262. -o-transition:all 0.5s;
  263. transition:all 0.5s;
  264. }
  265.  
  266. #messageme iframe {
  267. margin-top:10px;
  268. }
  269.  
  270. #navime {
  271. height:100%;
  272. background-color:{color:border};
  273. padding:30px;
  274. width:200px;
  275. padding-left:10px;
  276. top:0;
  277. position:fixed;
  278. }
  279.  
  280. .shut {
  281. right:-300px;
  282. -webkit-transition:all 0.5s;
  283. -moz-transition:all 0.5s;
  284. -ms-transition:all 0.5s;
  285. -o-transition:all 0.5s;
  286. transition:all 0.5s;
  287. }
  288.  
  289. .up {
  290. right:0;
  291. -webkit-transition:all 0.5s;
  292. -moz-transition:all 0.5s;
  293. -ms-transition:all 0.5s;
  294. -o-transition:all 0.5s;
  295. transition:all 0.5s;
  296. }
  297.  
  298. #navime a {
  299. width:180px;
  300. padding:10px;
  301. display:block;
  302. text-decoration:none;
  303. color:#fff;
  304. text-transform:uppercase;
  305. -webkit-transition:all 0.5s;
  306. -moz-transition:all 0.5s;
  307. -ms-transition:all 0.5s;
  308. -o-transition:all 0.5s;
  309. transition:all 0.5s;
  310. }
  311.  
  312. #cr {
  313. font: 10px consolas;
  314. font-weight:bold;
  315. position: fixed;
  316. background-color:#fff;
  317. border:1px solid #000;
  318. width:13px;
  319. height:13px;
  320. bottom: 25px;
  321. padding:2px;
  322. right: 25px;
  323. z-index: 10;
  324. text-align:center;
  325. overflow:hidden;
  326. -webkit-transition:all 0.7s ease-in-out;
  327. -moz-transition:all 0.7s ease-in-out;
  328. transition:all 0.7s ease-in-out;
  329. }
  330.  
  331. #cr a {
  332. color:#fff;
  333. font-size:10px;
  334. font-weight:bold;
  335. text-decoration: none;
  336. }
  337.  
  338. #cr:hover {
  339. width:100px;
  340. -webkit-transition:all 0.7s ease-in-out;
  341. -moz-transition:all 0.7s ease-in-out;
  342. transition:all 0.7s ease-in-out;
  343. }
  344.  
  345. #cr:hover a {
  346. color:#000;
  347. }
  348.  
  349. #navime a:hover {
  350. background-color:#fff;
  351. color:#000;
  352. -webkit-transition:all 0.5s;
  353. -moz-transition:all 0.5s;
  354. -ms-transition:all 0.5s;
  355. -o-transition:all 0.5s;
  356. transition:all 0.5s;
  357. }
  358.  
  359. .txtme {
  360. color:#fff;
  361. padding-bottom:10px;
  362. text-align:justify;
  363. }
  364.  
  365. .txtme a {
  366. color:#fff;
  367. text-decoration:underline;
  368. width:auto;
  369. padding:0;
  370. display:inline-block;
  371. text-transform:normal;
  372. }
  373.  
  374. .phto1 {
  375. width:100px;
  376. height:100px;
  377. padding-bottom:10px;
  378. margin-left:50px;
  379. }
  380.  
  381. .phto1 img {
  382. width:100px;
  383. height:100px;
  384. border-radius:50%;
  385. -webkit-transition:all 0.5s;
  386. -moz-transition:all 0.5s;
  387. -ms-transition:all 0.5s;
  388. -o-transition:all 0.5s;
  389. transition:all 0.5s;
  390. }
  391.  
  392. .phto1 img:hover {
  393. border-radius:0;
  394. -webkit-transition:all 0.5s;
  395. -moz-transition:all 0.5s;
  396. -ms-transition:all 0.5s;
  397. -o-transition:all 0.5s;
  398. transition:all 0.5s;
  399. }
  400.  
  401. .posts {
  402. margin-left:350px;
  403. margin-top:120px;
  404. width:500px;
  405. }
  406.  
  407. #pagination {
  408. margin-bottom:50px;
  409. width:500px;
  410. padding-bottom:100px;
  411. }
  412.  
  413. #pagination a {
  414. text-decoration:none;
  415. text-transform:uppercase;
  416. letter-spacing:1px;
  417. color:#000;
  418. }
  419.  
  420. ol.notes {
  421. list-style-type: none;
  422. padding:3px;
  423. padding-top:30px;
  424. }
  425.  
  426. ol.notes img { display:none }
  427.  
  428. ol.notes a { text-decoration:none; }
  429.  
  430. .postswrap1 {
  431. width:500px;
  432. overflow:hidden;
  433. margin-bottom:100px;
  434. position:relative;
  435. }
  436.  
  437. .postswrap2 {
  438. width:500px;
  439. position:relative;
  440. }
  441.  
  442. #title {
  443. width:480px;
  444. background-color:#000;
  445. padding:10px;
  446. text-align:center;
  447. text-transform:uppercase;
  448. letter-spacing:1px;
  449. font-size:12px;
  450. color:#fff;
  451. }
  452.  
  453. #title a {
  454. color:#fff;
  455. }
  456.  
  457. #quote {
  458. width:480px;
  459. background-color:#000;
  460. padding:10px;
  461. text-align:center;
  462. font-size:11px;
  463. color:#fff;
  464. }
  465.  
  466. #confucius {
  467. margin-top:10px;
  468. text-align:center;
  469. }
  470.  
  471. #audio {
  472. width:480px;
  473. text-align:right;
  474. padding:10px;
  475. background-color:#000;
  476. height:auto;
  477. letter-spacing:1px;
  478. line-height:15px;
  479. margin-bottom:10px;
  480. -webkit-transition:all 0.5s;
  481. -moz-transition:all 0.5s;
  482. -ms-transition:all 0.5s;
  483. -o-transition:all 0.5s;
  484. transition:all 0.5s;
  485. }
  486.  
  487. #play-wrap {
  488. position:absolute;
  489. background-color:#fff;
  490. width:30px;
  491. height:30px;
  492. margin-top:15px;
  493. margin-left:15px;
  494. opacity:0;
  495. }
  496.  
  497. #play {
  498. width:25px;
  499. height:30px;
  500. overflow:hidden;
  501. float:left;
  502. margin-top:2px;
  503. margin-left:2px;
  504. }
  505.  
  506. #audio:hover #play-wrap {
  507. opacity:8;
  508. -webkit-transition:all 0.5s;
  509. -moz-transition:all 0.5s;
  510. -ms-transition:all 0.5s;
  511. -o-transition:all 0.5s;
  512. transition:all 0.5s;
  513. }
  514.  
  515. #pause {
  516. width:60px;
  517. height:60px;
  518. display:inline-block;
  519. }
  520.  
  521. #pause img {
  522. width:60px;
  523. height:60px;
  524. }
  525.  
  526. #trackname {
  527. display:inline-block;
  528. width:410px;
  529. color:#fff;
  530. overflow:hidden;
  531. font-size:10px;
  532. text-transform:uppercase;
  533. height:60px;
  534. margin-left:5px;
  535. float:right;
  536. }
  537.  
  538. #trackname a { color:#fff; }
  539.  
  540. #talkbubble
  541. {
  542. position: relative;
  543. width: 480px;
  544. color:#fff;
  545. height:auto;
  546. padding: 10px;
  547. background-color:#000;
  548. }
  549.  
  550. #talkbubble:after
  551. {
  552. content: '';
  553. position: absolute;
  554. border-style: solid;
  555. border-width: 16px 11px 0;
  556. border-color: #000 transparent;
  557. display: block;
  558. width: 0;
  559. z-index: 1;
  560. bottom: -16px;
  561. left: 15px;
  562. }
  563.  
  564. #ask-icon {
  565. float:left;
  566. position:absolute;
  567. margin-left:0;
  568. margin-top:0;
  569. }
  570.  
  571. #ask-icon img {
  572. width:30px;
  573. height:30px;
  574. border-radius:50%;
  575. }
  576.  
  577. #asker {
  578. width:440px;
  579. height:15px;
  580. text-align:left;
  581. border-bottom:1px solid #fff;
  582. overflow:hidden;
  583. padding-left:40px;
  584. font-size:10px;
  585. text-transform:uppercase;
  586. letter-spacing:1px;
  587. }
  588.  
  589. #asker a {
  590. color:#fff;
  591. }
  592.  
  593. #question {
  594. width:480px;
  595. text-align:left;
  596. margin-top:16px;
  597. }
  598.  
  599. #info {
  600. width:500px;
  601. -webkit-transition:all 0.5s;
  602. -moz-transition:all 0.5s;
  603. -ms-transition:all 0.5s;
  604. -o-transition:all 0.5s;
  605. transition:all 0.5s;
  606. }
  607.  
  608. #info a {
  609. text-decoration:none;
  610. padding:5px;
  611. text-transform:uppercase;
  612. letter-spacing:1px;
  613. color:#000;
  614. }
  615.  
  616. .postswrap1:hover .perma_hold {opacity:1;}
  617. .postswrap1:hover .perma-link { margin-left:0; }
  618. .postswrap1:hover .perma-tags { margin-right:10px; }
  619. .perma_hold {
  620. width:500px;
  621. height:100%;
  622. top:0px;
  623. left:0;
  624. overflow:hidden;
  625. position:absolute;
  626. opacity:0;
  627. z-index:9999;
  628. background:rgba(255,255,255,0.7);
  629. transition:0.6s ease;
  630. -o-transition:0.6s ease;
  631. -moz-transition:0.6s ease;
  632. -webkit-transition:0.6s ease;
  633. }
  634.  
  635. .perma {
  636. top:40%;
  637. position:relative;
  638. text-align:center;
  639. text-transform:uppercase;
  640. }
  641.  
  642. .perma-link {
  643. transition:0.6s ease;
  644. -o-transition:0.6s ease;
  645. -moz-transition:0.6s ease;
  646. -webkit-transition:0.6s ease;
  647. margin-left:-250px;
  648. font-size:14px;
  649. }
  650.  
  651. .perma-link a {
  652. padding:10px;
  653. width:auto;
  654. border:1px solid #000;
  655. }
  656.  
  657. .perma-tags {
  658. transition:0.6s ease;
  659. -o-transition:0.6s ease;
  660. -moz-transition:0.6s ease;
  661. -webkit-transition:0.6s ease;
  662. margin-right:-250px;
  663. font-size:9px;
  664. padding-left:10px;
  665. padding-right:10px;
  666. margin-top:20px;
  667. }
  668.  
  669. .perma-tags a {
  670. margin-left:3px;
  671. margin-right:3px;
  672. display:inline-block;
  673. }
  674.  
  675. </style>
  676.  
  677. </head>
  678. <body>
  679.  
  680. <div class="top"></div><div class="bottom"></div><div class="left"></div><div class="right"></div>
  681.  
  682. <div class="posts">{block:posts}<div class="postswrap1">
  683.  
  684. {block:IndexPage}<div class="perma_hold"><div class="perma"><div class="perma-link"><a href="{Permalink}">{NoteCountWithLabel}</a></div>{block:hastags}<div class="perma-tags">filed under:<br> {block:tags}<a href="{tagurl}">#{tag}</a>{/block:tags}</div>{/block:hastags}</div></div>{/block:IndexPage}
  685.  
  686. <div class="postswrap2">
  687.  
  688. {block:Text}{block:Title}<div id="title">{Title}</div>{/block:Title}<p style="font-weight:lighter">{Body}</p>{/block:Text}
  689.  
  690. {block:Photo}<div id="photo2">{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" />{LinkCloseTag}</div>{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}{/block:Photo}
  691.  
  692. {block:Panorama}{LinkOpenTag}<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}" />{LinkCloseTag}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}{/block:Panorama}
  693.  
  694. {block:Photoset}{Photoset-500}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}{/block:Photoset}
  695.  
  696. {block:Quote}<div id="quote">"{Quote}"</div><div id="confucius">{block:Source}{Source}{/block:Source}</div>{/block:Quote}
  697.  
  698. {block:Link}<div id="title"><a href="{URL}" {Target}>{Name} &#8594;</a></div>{block:Description}{Description}{/block:Description}{/block:Link}
  699.  
  700. {block:Chat}{block:Title}<div id="title">{Title}</div>{/block:Title}<div id="chlines">{block:Lines}<div id="{Alt}">{block:Label}<span id="label" style="font-weight:bold" id="label">{Label}</span>{/block:Label} <span id="line">{Line}</span></div>{/block:Lines}</div>{/block:Chat}
  701.  
  702. {block:Video}{Video-500}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}{/block:Video}
  703.  
  704. {block:Audio}<div id="audio">{block:AudioPlayer}{block:AlbumArt}<div id="pause"><div id="play-wrap"><div id="play">{AudioPlayerWhite}</div></div><img src="{AlbumArtURL}"></div>{/block:AlbumArt}{/block:AudioPlayer}{block:TrackName}<div id="trackname">{TrackName}<br>{block:Artist}{Artist}{/block:Artist}<br>{block:Album}{Album}{/block:Album}<br>{block:PlayCount}{PlayCount}{/block:PlayCount}</div>{/block:TrackName}</div>{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}{/block:Audio}
  705.  
  706. {block:Answer}<div id="coverme"><div id="talkbubble"><div id="ask-icon"><img src="{AskerPortraitURL-30}"></div><div id="asker">{Asker} asked:</div><div id="question">{question}</div></div></div><div id="answer"><br>{Answer}</div>{/block:Answer}
  707.  
  708. {block:permalinkpage}{block:Date}<div id="info"><a href="{Permalink}" font-weight"bold" style="float:left">{DayOfWeek} {DayOfMonth}</a>{block:NoteCount}<a href="{Permalink}" style="float:left">{NoteCount}</a>{/block:NoteCount}<a href="{ReblogURL}" target="_blank" style="float:right;">reblog</a>{block:RebloggedFrom}<a title="{ReblogParentName}" href="{ReblogParentURL}" style="float:right">via</a>{/block:RebloggedFrom}{block:ContentSource}<a href="{SourceURL}" title="{SourceTitle}" style="float:right">source</a>{/block:ContentSource}</div>{/block:Date}{/block:permalinkpage}
  709.  
  710. </div>
  711.  
  712. {block:PostNotes}{PostNotes}{/block:PostNotes}
  713.  
  714. </div>{/block:posts}
  715.  
  716. {block:Pagination}<div id="pagination">{block:PreviousPage}<a href="{PreviousPage}" style="float:left">&larr; previous</a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}" style="float:right">next &rarr;</a>{/block:NextPage}</div>{/block:Pagination}
  717.  
  718. </div>
  719.  
  720. <div id="cr"><a href="http://harknesses.tumblr.com">SKYRIM THEMES</a></div>
  721.  
  722. <div id="navime" class="shut"><div class="phto1"><img src="{image:navigation image}"></div><div class="txtme">{text:second description}</div><a href="{text:link 3 url}">{text:link 3 name}</a><a href="{text:link 4 url}">{text:link 4 name}</a><a href="{text:link 5 url}">{text:link 5 name}</a><a href="{text:link 6 url}">{text:link 6 name}</a><a href="{text:link 7 url}">{text:link 7 name}</a></div>
  723.  
  724. <div id="messageme" class="closed">{text:faq text}<iframe frameborder="0" height="240" id="ask_form" scrolling="yes" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" width="100%"></iframe></div>
  725.  
  726. <div class="sbar"><a href="/"><img src="{image:sidebar image}"></a><div class="txt1">{description}</div></div>
  727.  
  728. <div class="navilinks"><a href="/">home</a><a class="messageclick">message</a><a class="naviclick">navigation</a><a href="{text:link 1 url}">{text:link 1 name}</a><a href="{text:link 2 url}">{text:link 2 name}</a></div>
  729.  
  730. </body>
  731. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement