Advertisement
gigathemes

Theme #12 by GIGATHEMES

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