Advertisement
gigathemes

Theme #3 by GIGATHEMES

Mar 13th, 2015
630
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 10.60 KB | None | 0 0
  1. <!--
  2.  
  3.  
  4.                      [ T H E M E  # 3  B Y  G I G A T H E M E S ]
  5.                            [ GIGATHEMES.TUMBLR.COM ]
  6.  
  7.  
  8. -->
  9.  
  10.  
  11. <!DOCTYPE html>
  12. <html>
  13. <head>
  14.  
  15. <!-- META TAGS ------------------------------------------------------>
  16. <meta name="image:Header Image" content="" />
  17. <meta name="image:Sidebar Image" content="" />
  18.  
  19. <meta name="color:Title" content="#e2e8ed" />
  20. <meta name="color:Links" content="#529ecc" />
  21. <meta name="color:Links Hover" content="#315f7a" />
  22.  
  23. <meta name="text:Update 1" content="update 1" />
  24. <meta name="text:Update 2" content="update 2" />
  25. <meta name="text:Update 3" content="update 3" />
  26.  
  27. <meta name="text:Link 1" content="link 1" />
  28. <meta name="text:Link 1 URL" content="" />
  29. <meta name="text:Link 2" content="link 2" />
  30. <meta name="text:Link 2 URL" content="" />
  31. <meta name="text:Link 3" content="link 3" />
  32. <meta name="text:Link 3 URL" content="" />
  33.  
  34. <meta name="" content="" />
  35.  
  36.  
  37. <title>{Title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  38. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  39. <link rel="shortcut icon" href="{Favicon}" />
  40.  
  41. <!-- FONTS --------------------------------------------------------->
  42. <link href='http://fonts.googleapis.com/css?family=Londrina+Outline' rel='stylesheet' type='text/css'>
  43.  
  44. <!-- SCRIPTS ------------------------------------------------------->
  45. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
  46.  
  47. <script>
  48.     $(document).ready(function() {
  49.         $("#node1").click(function(){
  50.             $("#upd1").toggleClass('hidden');
  51.             $("#upd2").addClass('hidden');
  52.             $("#upd3").addClass('hidden');
  53.         });
  54.         $("#node2").click(function(){
  55.             $("#upd1").addClass('hidden');
  56.             $("#upd2").toggleClass('hidden');
  57.             $("#upd3").addClass('hidden');
  58.         });
  59.         $("#node3").click(function(){
  60.             $("#upd1").addClass('hidden');
  61.             $("#upd2").addClass('hidden');
  62.             $("#upd3").toggleClass('hidden');
  63.         });
  64.     });
  65. </script>
  66.  
  67.  
  68. <!-- CSS ----------------------------------------------------------->
  69. <style type="text/css">
  70.  
  71. /** iframe#tumblr_controls {} **/
  72.  
  73. body {
  74.     margin:0px;
  75.     padding:0px;
  76.     font-family: 'Calibri', cursive;
  77. }
  78.  
  79. /** HEADER CSS **************************************************/
  80.  
  81. #headerimg {
  82.     height: 500px;
  83.     background-size: cover;
  84.     background-image: url({image:Header Image});
  85.     /* -webkit-filter: grayscale(100%); filter: grayscale(100%); */
  86. }
  87.  
  88. #overlayer {
  89.     height: 500px;
  90.     width: 70%;
  91.     margin-left: auto;
  92.     margin-right: auto;
  93.     background-color: #000;
  94.     opacity: 0.6;
  95. }
  96.  
  97. #spacer {
  98.     height: 150px;
  99. }
  100.  
  101. #title {
  102.     font-size: 100px;
  103.     font-family: 'Londrina Outline', cursive;
  104.     text-align: center;
  105. }
  106.  
  107. #headertxt {
  108.     color: {color:Title};
  109.     opacity: 0.8;
  110. }
  111.  
  112. #headertxt a {
  113.     text-decoration: none;
  114.     color: {color:Title};
  115.     opacity: 0.8;
  116. }
  117.  
  118. #title a:hover {
  119.     text-decoration: none;
  120.     color: {color:Title};
  121.     opacity: 1;
  122. }
  123.  
  124. #description {
  125.     margin-top: 100px;
  126.     font-size: 20px;
  127.     text-align: center;
  128.     font-family: 'Calibri', cursive;
  129. }
  130.  
  131. #description a {
  132.     color: #fff;
  133. }
  134.  
  135.  
  136. /** SIDEBAR CSS **************************************************/
  137.  
  138. /** LEFT SIDEBAR **/
  139. #leftbar {
  140.     position: fixed;
  141.     width: 200px;
  142.     height: 250px;
  143.     left: 50px;
  144.     bottom: 50px;
  145. }
  146.  
  147. #sidebarimg {
  148.     background-image: url({image:Sidebar Image});
  149.     background-size: cover;
  150.     width: 200px;
  151.     height: 200px;
  152. }
  153.  
  154. #links {
  155.     width: 200px;
  156.     font-size: 11px;
  157.     table-layout: fixed;
  158.     margin-left: auto;
  159.     margin-right: auto;
  160.     text-align: center;
  161.     margin-top: 3px;
  162.     font-family: 'Calibri', cursive;
  163. }
  164.  
  165. #links a {
  166.     text-decoration: none;
  167.     color: {color:Links};
  168. }
  169.  
  170. #links a:hover {
  171.     color: {color:Links Hover};
  172. }
  173.  
  174. #pagination {
  175.     text-align: center;
  176.     font-family: 'Londrina Outline', cursive;
  177.     font-size: 20px;
  178.     font-weight: bold;
  179. }
  180.  
  181. #pagination a {
  182.     text-decoration: none;
  183.     color: {color:Links};
  184. }
  185.  
  186. #pagination a:hover {
  187.     color: {color:Links Hover};
  188. }
  189.  
  190. /** RIGHT SIDEBAR **/    
  191. #rightbar {
  192.     position: fixed;
  193.     width: 200px;
  194.     height: 150px;
  195.     right: 50px;
  196.     bottom: 50px;
  197. }
  198.  
  199. #nodes {
  200.     margin-top: 5px;
  201. }
  202.  
  203. .node {
  204.     width: 5px;
  205.     height: 5px;
  206.     border: 1px solid {color:Links};
  207. }
  208.  
  209. .nonode {
  210.     width: 5px;
  211.     height: 5px;
  212. }
  213.  
  214. #updates {
  215.     position: relative;
  216.     width: 185px;
  217.     margin-left: 15px;
  218.     text-align: center;
  219.     font-size: 11px;
  220.     margin-top: -55px;
  221. }
  222.  
  223. .update a {
  224.     text-decoration: none;
  225.     color: {color:Links};
  226. }
  227.  
  228. .update a:hover {
  229.     color: {color:Links Hover};
  230. }
  231.  
  232. .hidden {
  233.     display: none;
  234. }
  235.  
  236. /** POSTS CSS ****************************************************/
  237.  
  238. #content {
  239.     width: 540px;
  240.     margin-left: auto;
  241.     margin-right: auto;
  242.     margin-top: 60px;
  243.     margin-bottom: 60px;
  244. }
  245.  
  246. #content a {
  247.       color: {color:Links};
  248.       text-decoration: none;
  249. }
  250.  
  251. #content a:hover {
  252.       color: {color:Links Hover};
  253. }
  254.  
  255. img {
  256.     border: 0;
  257.     max-width: 100%;
  258. }
  259.  
  260. #content #posts {
  261.   /*  background-color: {color:Post Background}; */
  262.     width: 500px;
  263.     margin: 0 auto 50px;
  264.     padding: 10px;
  265. }
  266.  
  267. #content #posts .title {
  268.     font-size: 13px;
  269. }
  270.  
  271. #content #posts .text {
  272.     font-size: 11px;
  273. }
  274.  
  275. #content #posts #info {
  276.     margin-top: 5px;
  277.     font-size: 9px;
  278.     line-height: 70%;
  279.     text-align: right;
  280.     border-top: 1px solid {color:Links};
  281. }
  282.  
  283. #content #posts #permalink {
  284.     margin-top: 5px;
  285. }
  286.  
  287. #content #posts #tags {
  288.     margin-top: 5px;
  289. }
  290.  
  291. ol.notes li {
  292.     list-style-type: none;
  293.     margin: 0;
  294.     padding: 0;
  295.     font-size: 10px;
  296. }
  297.  
  298. #credit {
  299.     position: fixed;
  300.     bottom: 0px;
  301.     right: 0px;
  302. }
  303.  
  304. #creditlogo {
  305.     width: 20px;
  306. }
  307.  
  308. {CustomCSS}</style>
  309.  
  310. </head>
  311.  
  312. <!-- BODY ---------------------------------------------------------->
  313. <body>
  314.  
  315.  
  316.  
  317. <!-- HEADER -------------------------------------------------------->
  318. <div id="header">
  319.    
  320.     <div id="headerimg">
  321.         <div id="overlayer">
  322.             <div id="spacer"></div>
  323.             <div id="headertxt">
  324.                 <div id="title">
  325.                     <a href="/">{Title}</a>
  326.                 </div>
  327.                 <div id="description">
  328.                    {Description}
  329.                 </div>
  330.             </div>
  331.         </div>
  332.     </div>
  333.    
  334. </div> <!-- !HEADER -->
  335.  
  336. <!-- SIDEBAR LEFT AND RIGHT  -------------------------------------->
  337. <div id="leftbar">
  338.    
  339.     <div id="pagination">
  340.         {block:PreviousPage}<a href="{PreviousPage}">  ←  </a>{/block:PreviousPage}
  341.         {block:NextPage}<a href="{NextPage}">  →  </a>{/block:NextPage}
  342.     </div>
  343.     <div id="sidebarimg"></div>
  344.     <table id="links">
  345.         <tr>
  346.             <td><a href="/">home</a>
  347.             <td><a href="/ask">ask</a>
  348.             <td><a href="{text:Link 1 URL}">{text:Link 1}</a></td>
  349.             <td><a href="{text:Link 2 URL}">{text:Link 2}</a></td>
  350.             <td><a href="{text:Link 3 URL}">{text:Link 3}</a></td>
  351.         </tr>
  352.     </table>
  353.    
  354. </div>
  355.  
  356. <div id="rightbar">
  357.    
  358.     <table id="nodes">
  359.         <tr><td id="node1" class="node"></td></tr>
  360.         <tr><td class="nonode"></td></tr>
  361.         <tr><td id="node2" class="node"></td></tr>
  362.         <tr><td class="nonode"></td></tr>
  363.         <tr><td id="node3" class="node"></td></tr>
  364.     </table>
  365.    
  366.     <div id="updates">
  367.         <div id="upd1" class="update hidden">
  368.             {text:Update 1}
  369.         </div>
  370.         <div id="upd2" class="update hidden">
  371.             {text:Update 2}
  372.         </div>
  373.         <div id="upd3" class="update hidden">
  374.             {text:Update 3}
  375.         </div>
  376.     </div>
  377.    
  378. </div>
  379.    
  380. <!-- POSTS --------------------------------------------------------->
  381.  
  382. <div id="content">
  383. {block:Posts}
  384.  
  385. {block:ContentSource}
  386. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  387. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  388. {/block:ContentSource}{block:ReblogParent}{/block:ReblogParent}
  389.  
  390. <div id="posts">
  391.  
  392. {block:Photo}
  393. {LinkOpenTag}<img src="{PhotoURL-500}" />{LinkCloseTag}
  394. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  395. {/block:Photo}
  396.  
  397. {block:Photoset}
  398. {Photoset-500}
  399. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  400. {/block:Photoset}
  401.  
  402. {block:Video}
  403. {Video-500}
  404. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  405. {/block:Video}
  406.  
  407. {block:Audio}
  408. {AudioPlayerBlack}
  409. <div class="text">~ {PlayCountWithLabel}</div>
  410. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  411. {/block:Audio}
  412.  
  413. {block:Quote}
  414. <div class="title">“{Quote}”</div>
  415. {block:Source}<div class="text"><br>~ {Source}</div>{/block:Source}
  416. {/block:Quote}
  417.  
  418. {block:Text}
  419. {block:Title}<div class="title">{Title}</div>{/block:Title}
  420. <div class="text">{Body}</div>
  421. {/block:Text}
  422.  
  423. {block:Answer}
  424. <div class="title">{Question}</div>
  425. <div class="text">~ {Asker}</div>
  426. <div class="text">{Answer}</div>
  427. {/block:Answer}
  428.  
  429. {block:Chat}
  430. {block:Title}<div class="title">{Title}</div>{/block:Title}
  431. <div class="text">
  432. {block:Lines}
  433. {block:Label}<strong>{Label}</strong>{/block:Label} {Line}<br />
  434. {/block:Lines}
  435. </div>
  436. {/block:Chat}
  437.  
  438. {block:Link}
  439. <div class="title"><a href="{URL}">{Name}</a></div>
  440. {block:Description}
  441. <div class="text">{Description}</div>
  442. {/block:Description}
  443. {/block:Link}
  444.  
  445.  
  446. <div id="info">
  447.  
  448. <div id="source">{block:RebloggedFrom}<br>via:<a href="{ReblogParentURL}"
  449. title="{ReblogParentTitle}">{ReblogParentName}</a> source:<a href="{ReblogRootURL}"title="{ReblogRoottitle}">{ReblogRootName}</a>{/block:RebloggedFrom}</div>
  450.  
  451. <div id="permalink">
  452. <a href="{Permalink}">
  453. {block:Date}{Month} {DayOfMonthWithZero} at {12Hour}:{Minutes} {AmPm}{/block:Date}
  454. {block:NoteCount} - <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  455. </a>
  456. </div>
  457.  
  458. {block:HasTags}<div id="tags">
  459. {block:Tags}
  460. <a href="{TagURL}">#{Tag} </a>
  461. {/block:Tags}
  462. </div>
  463. {/block:HasTags}
  464.  
  465. </div> <!-- !info -->
  466.  
  467. </div> <!-- !posts -->
  468.  
  469. {/block:Posts}
  470.  
  471. {block:PostNotes}
  472. <div id="allnotes">{PostNotes}</div>
  473. {/block:PostNotes}
  474.  
  475. </div> <!-- !content -->
  476.  
  477.  
  478. <div id="credit">
  479. <a href="http://gigatheme3.tumblr.com">
  480.     <img src="http://68.media.tumblr.com/8bfd1d5d5bde1794102425cf0f13eea9/tumblr_nk3b78X9lq1sy4yqbo1_75sq.png" id="creditlogo">
  481. </a>
  482. </div>
  483.  
  484.     </body>
  485. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement