crimsonxthemes

Fansite Theme 01. Navy Blue

Jul 26th, 2016
3,346
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.85 KB | None | 0 0
  1. <!--
  2. Fansite theme 01. by CrimsonxThemes
  3. Navy Blue
  4. ˈnāvē blo͞o
  5.  
  6. Please don't steal this, I worked really hard on it
  7. And theives are ugly butts ^u^
  8. (●´ω`●)
  9. -->
  10. <html>
  11. <head>
  12.  
  13. <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700|Work+Sans:200,700" rel="stylesheet">
  14.  
  15. <title>{Title}</title>
  16. <link rel="shortcut icon" href="{Favicon}">
  17. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  18. <meta name="description" content="" />
  19. <meta http-equiv="x-dns-prefetch-control" content="off"/>
  20.  
  21. <!-- Basic Options -->
  22. <meta name="if:Back To Top" content="1"/>
  23. <meta name="if:Crosshair Pointer" content="0"/>
  24. <meta name="if:Minimal Controls" content="1"/>
  25.  
  26. <!-- Show / Hide Boxes -->
  27. <meta name="if:Affiliates Box" content="0"/>
  28. <meta name="if:Extra Links Box" content="0"/>
  29. <meta name="if:Members Box" content="0"/>
  30. <meta name="if:Projects Box" content="0"/>
  31. <meta name="if:Related Box" content="0"/>
  32. <meta name="if:Schedules Box" content="0"/>
  33. <meta name="if:Search Box" content="0"/>
  34. <meta name="if:Statistics Box" content="0"/>
  35. <meta name="if:Updates Box" content="0"/>
  36.  
  37. <!-- Font Size Options -->
  38. <meta name="select:Font Size" content="9" title="9px"/>
  39. <meta name="select:Font Size" content="10" title="10px"/>
  40. <meta name="select:Font Size" content="11" title="11px"/>
  41. <meta name="select:Info Font Size" content="10" title="10px"/>
  42. <meta name="select:Info Font Size" content="9" title="9px"/>
  43. <meta name="select:Info Font Size" content="11" title="11px"/>
  44.  
  45. <!-- Font Weight Options -->
  46. <meta name="select:Font Weight" content="300" title="300"/>
  47. <meta name="select:Font Weight" content="400" title="400"/>
  48.  
  49. <!-- Color Options -->
  50. <meta name="color:Ask Border" content="#a3a4b4" />
  51. <meta name="color:Background" content="#fbfbfb" />
  52. <meta name="color:Blockquote Border" content="#e3e4ff" />
  53. <meta name="color:Bold" content="#000"/>
  54. <meta name="color:Info Box Border" content="#a3a4b4" />
  55. <meta name="color:Info Box Image Border" content="#bbb" />
  56. <meta name="color:Links" content="#a3a4b4" />
  57. <meta name="color:Link Border" content="#e3e4ff" />
  58. <meta name="color:Permalink" content="#999" />
  59. <meta name="color:Permalink Hover" content="#999" />
  60. <meta name="color:Post Background" content="#fff" />
  61. <meta name="color:Scrollbar" content="#bbb" />
  62. <meta name="color:Scrollbar Background" content="#ddd" />
  63. <meta name="color:Selection Color" content="#e3e4ff" />
  64. <meta name="color:Text" content="#555"/>
  65. <meta name="color:Tooltip" content="#bbb" />
  66.  
  67. <!-- Text Options -->
  68. <meta name="text:Disclaimer" content="" />
  69.  
  70. <meta name="text:Search Text" content="Click here to search tags..." />
  71.  
  72. <meta name="text:Updates Box Dot" content="✕" />
  73. <meta name="text:Tags Symbol" content="▹" />
  74.  
  75. <meta name="text:Link One URL" content="" />
  76. <meta name="text:Link One Title" content="Link One" />
  77. <meta name="text:Link Two URL" content="" />
  78. <meta name="text:Link Two Title" content="Link Two" />
  79. <meta name="text:Link Three URL" content="" />
  80. <meta name="text:Link Three Title" content="Link Three" />
  81.  
  82. <!-- Image Options -->
  83. <meta name="image:Header Image" content="" />
  84.  
  85. <meta name="image:Update One Image" content="" />
  86. <meta name="image:Update Two Image" content="" />
  87. <meta name="image:Update Three Image" content="" />
  88. <meta name="image:Update Four Image" content="" />
  89. <meta name="image:Update Five Image" content="" />
  90.  
  91. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet">
  92. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  93. <link rel="stylesheet" type="text/css" href="http://static.tumblr.com/4fjyb6u/Vdgo7srut/slick.css"/>
  94. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  95. <script>
  96. //tooltips
  97. (function($){
  98. $(document).ready(function(){
  99. $("a[title]").style_my_tooltips({
  100. tip_follows_cursor:true,
  101. tip_delay_time:90,
  102. tip_fade_speed:600,
  103. attribute:"title"
  104. });
  105. });
  106. })(jQuery);
  107. </script>
  108.  
  109.  
  110. <style type="text/css">
  111.  
  112. /* Transitions */
  113. #tumblr_controls,.tmblr-iframe.tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop, .top {-moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; transition-duration: 0.3s;}
  114. #s-m-t-tooltip, .recent img, .recent img:hover, .like_button, .our_button, .like_button:hover + .our_button, a, a:hover
  115. {-moz-transition-duration: 0.7s; -o-transition-duration: 0.7s; -webkit-transition-duration: 0.7s; transition-duration: 0.7s;}
  116.  
  117. /* Tooltips */
  118. #s-m-t-tooltip {
  119. max-width: 300px;
  120. border-radius: 2px;
  121. padding: 2px 5px 3px 5px;
  122. margin: 15px;
  123. background: {color:Post Background};
  124. border: 1px solid {color:Tooltip};
  125. font-family: open sans;
  126. font-style:italic;
  127. font-size: 9px;
  128. text-transform: lowercase;
  129. color: {color:Tooltip};
  130. z-index: 99999;
  131. letter-spacing: .5px;}
  132.  
  133. /* Selection Colors */
  134. ::selection {background: transparent!important; color: {color:Selection Color};}
  135. ::-moz-selection {background: transparent!important; color: {color:Selection Color}}
  136.  
  137. /* Scrollbar Colors */
  138. ::-webkit-scrollbar {width: 11px;height: 11px;background: {color:Scrollbar Background};}
  139. ::-webkit-scrollbar-thumb {background: {color:Scrollbar};}
  140. ::-webkit-scrollbar,::-webkit-scrollbar-thumb {border: 5px solid {color:Background};}
  141.  
  142. /* Basics */
  143. body { font-family: open sans; color: {color:Text}; font-size: {select:Font Size}px; background: {color:Background}; font-weight: {select:Font Weight};}
  144.  
  145. blockquote {padding-left: 10px; margin: 5px 10px 5px; border-left: 1px solid {color:Blockquote Border};}
  146.  
  147. ol {list-style: upper-roman;}
  148.  
  149. .cred {position: fixed; bottom: 5px; left: 10px;}
  150.  
  151. b, strong {color: {color:Bold};}
  152.  
  153. /* Links */
  154. a {color: {color:Links}; text-decoration: none; border-bottom: 1px solid {color:Link Border};}
  155. a:hover {color: {color:Text};
  156. {block:ifCrosshairPointer}
  157. cursor: crosshair;
  158. {/block:ifCrosshairPointer}}
  159. .as a, .as2 a, .cred a, .icon a, .info a, .perm a, .perm2 a, .perm3 a, .media a, .memname a {border: none;}
  160.  
  161. /* Titles and Headings */
  162. .pti, h1, h2 {
  163. font-family: work sans;
  164. font-size: 13px;
  165. font-weight: 700;
  166. padding-bottom:2px;}
  167. .pti a {color: {color:Text};}
  168.  
  169. /***** Topbar *****/
  170. .top {
  171. position: absolute;
  172. width: 100%;
  173. height: 30px;
  174. background: {color:Post Background};
  175. top: 20px;
  176. left: 0;
  177. text-align: center;
  178. z-index: 99999;}
  179.  
  180. /* Icon */
  181. .icon {position: absolute; left: 15px; top: -14px;}
  182. .icon img {border-radius: 50%; background-color: {color:Post Background}; padding: 4px;}
  183.  
  184. /* Topbar Links */
  185. .links {
  186. position: absolute;
  187. margin-top: 7px;
  188. width: 100%;
  189. text-align: center;}
  190. .links a {
  191. margin: 3px;
  192. font-family: work sans;
  193. font-size: 12px;}
  194.  
  195. /* Minimal Controls */
  196. {block:IndexPage}
  197. .con {position: absolute; margin-top: 7px; right: 20px;}
  198. .con a {margin: 3px;}
  199. .con a i {margin: 1px; font-size: 12px;}
  200. {/block:IndexPage}
  201.  
  202. /* Regular Controls */
  203. #tumblr_controls,.tmblr-iframe.tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop {
  204. {block:IndexPage}
  205. {block:ifMinimalControls}
  206. display: none;
  207. {/block:ifMinimalControls}
  208. {/block:IndexPage}
  209. -webkit-filter: invert(100%);
  210. -moz-filter: invert(100%);
  211. -o-filter: invert(100%);
  212. -ms-filter: invert(100%);
  213. filter: invert(100%);
  214. opacity: 0.2;
  215. z-index: 9999999;
  216. top:23px;}
  217.  
  218. /***** Header Picture *****/
  219. .header {
  220. position: absolute;
  221. width: 960px;
  222. height: 300px;
  223. padding: 20px;
  224. left: 50%;
  225. margin-left: -500px;
  226. top: 65px;
  227. background: {color:Post Background};}
  228. .header img {width: 960px; height: 300px;}
  229.  
  230. /****Sidebars & Posts Container ****/
  231. #container {
  232. width: 1000px;
  233. height: auto;
  234. margin: 420px auto 0;
  235. overflow: hidden;}
  236.  
  237. /*****Basic Elements - Sidebars*****/
  238.  
  239. /* Box */
  240. .box {
  241. position: relative;
  242. background: {color:Post Background};
  243. padding: 20px;
  244. width: 210px;
  245. font-family: work sans;
  246. font-size: {select:Info Font Size}px;
  247. margin-bottom: 15px;
  248. border-radius: 2px;}
  249.  
  250. /* Box Title */
  251. .btitle {
  252. width: 100%;
  253. border-bottom: 1px dotted {color:Info Box Border};
  254. padding-bottom: 3px;
  255. color: {color:Info Box Border};
  256. font-size: 12px;}
  257.  
  258. /* Box Text and Images */
  259. .info { margin-top: 5px; letter-spacing: .5px; color: {color:Text};}
  260. .info img, .mem img{
  261. display: inline-block;
  262. width: 40px;
  263. height: 40px;
  264. margin: 5px 8px;
  265. background-color: {color:Post Background};
  266. padding: 4px;
  267. border: 1px solid {color:Info Box Image Border};
  268. border-radius: 50%;}
  269.  
  270. /* Box Links (Extra Links & Related Blogs Sections) */
  271. .blinks {font-size: 12px;}
  272. .blinks a {
  273. width: 190px;
  274. display: block;
  275. padding: 6px 10px 5px 10px;
  276. border-bottom: 1px dotted {color:Info Box Border};
  277. text-align: right;}
  278.  
  279. /***** Sidebar One Exclusive Elements *****/
  280. .sideone {position: absolute; width: 250px;}
  281.  
  282. /* Members */
  283. .mem img {float: left; margin-top: 8px;}
  284. .mem {height: 65px; border-bottom: 1px dotted {color:Info Box Border};}
  285. .memname, .memtag {
  286. position:absolute;
  287. margin-left:65px;
  288. width:145px;
  289. text-align:center;}
  290. .memname {text-transform: uppercase; margin-top:21px;}
  291. .memtag {margin-top:31px;}
  292.  
  293. /* Searchar */
  294. .search .query {
  295. border: 0;
  296. outline: 0;
  297. padding: 5px;
  298. width: 190px;
  299. margin-left: 5px;
  300. background: transparent;
  301. color: {color:Text};
  302. opacity: .7;
  303. font-family: work sans;}
  304.  
  305. /* Searchbar Placeholders */
  306. ::-webkit-input-placeholder {color: {color:Text}; text-align: center; font-family: work sans; -moz-transition-duration: 0.7s; -o-transition-duration: 0.7s; -webkit-transition-duration: 0.7s; transition-duration: 0.7s;}
  307. :-moz-placeholder {color: {color:Text}; text-align: center; opacity:1; font-family: work sans; -moz-transition-duration: 0.7s; -o-transition-duration: 0.7s; -webkit-transition-duration: 0.7s; transition-duration: 0.7s;}
  308. ::-moz-placeholder {color: {color:Text}; text-align: center; opacity:1; font-family: work sans; -moz-transition-duration: 0.7s; -o-transition-duration: 0.7s; -webkit-transition-duration: 0.7s; transition-duration: 0.7s;}
  309. :-ms-input-placeholder {color: {color:Text}; text-align: center; font-family: work sans; -moz-transition-duration: 0.7s; -o-transition-duration: 0.7s; -webkit-transition-duration: 0.7s; transition-duration: 0.7s;}
  310. input:focus::-webkit-input-placeholder {color: transparent; -moz-transition-duration: 0.7s; -o-transition-duration: 0.7s; -webkit-transition-duration: 0.7s; transition-duration: 0.7s;}
  311. input:focus:-moz-placeholder {color: transparent; -moz-transition-duration: 0.7s; -o-transition-duration: 0.7s; -webkit-transition-duration: 0.7s; transition-duration: 0.7s;}
  312. input:focus::-moz-placeholder {color: transparent; -moz-transition-duration: 0.7s; -o-transition-duration: 0.7s; -webkit-transition-duration: 0.7s; transition-duration: 0.7s;}
  313. input:focus:-ms-input-placeholder { color: transparent; -moz-transition-duration: 0.7s; -o-transition-duration: 0.7s; -webkit-transition-duration: 0.7s; transition-duration: 0.7s;}
  314.  
  315. /***** Sidebar Two Exclusive Elements *****/
  316. .sidetwo {position: absolute; width: 250px; margin-left: 750px;}
  317.  
  318. /* Recent Updates Images */
  319. .recent img {
  320. width: 210px;
  321. border-radius: 4px;
  322. height: auto;
  323. opacity:0.8;
  324. border:1px solid {color:Info Box Image Border};}
  325. .recent img:hover {opacity:0.4;}
  326.  
  327. /* Recent Updates Dots */
  328. .slick-dotted.slick-slider {margin-bottom: 20px;}
  329. .slick-dots li button:hover,.slick-dots li button:focus {outline: none;}
  330. .slick-dots li button:hover:before,.slick-dots li button:focus:before {opacity: 1;}
  331. .slick-dots {
  332. position: absolute;
  333. bottom: -25px;
  334. display: block;
  335. width: 100%;
  336. padding: 0;
  337. margin: 0;
  338. list-style: none;
  339. text-align: center;}
  340. .slick-dots li {
  341. position: relative;
  342. display: inline-block;
  343. width: 20px;
  344. height: 20px;
  345. margin: 0 5px;
  346. padding: 0;
  347. cursor: pointer;}
  348. .slick-dots li button {
  349. font-size: 0;
  350. line-height: 0;
  351. display: block;
  352. width: 20px;
  353. height: 20px;
  354. padding: 5px;
  355. cursor: pointer;
  356. color: transparent;
  357. border: 0;
  358. outline: none;
  359. background: transparent;}
  360. .slick-dots li button:before {
  361. font-family: 'slick';
  362. font-size: 6px;
  363. line-height: 20px;
  364. position: absolute;
  365. top: 0;
  366. left: 0;
  367. width: 20px;
  368. height: 20px;
  369. content: '{text:Updates Box Dot}';
  370. text-align: center;
  371. opacity: .25;
  372. color: {color:Info Box Border};
  373. -webkit-font-smoothing: antialiased;
  374. -moz-osx-font-smoothing: grayscale;}
  375. .slick-dots li.slick-active button:before {opacity: .75; color: {color:Info Box Border};}
  376.  
  377. /* Schedule Box Month */
  378. .month {
  379. text-align: center;
  380. font-family: work sans;
  381. font-size: 12px;
  382. color: {color:Info Box Border};
  383. margin-top: 5px;
  384. font-weight: 700;}
  385.  
  386. /* Project Box Images */
  387. .pimg {margin-top:5px;}
  388. .pimg img {
  389. width: 202px;
  390. height: 202px;
  391. padding: 4px;
  392. border: 1px solid {color:Info Box Image Border};
  393. border-radius: 4px;}
  394.  
  395. /***** Posts Container *****/
  396. .entries {
  397. width: 440px;
  398. height: auto;
  399. margin-left: 280px;
  400. margin-top:-30px;
  401. margin-bottom:30px;}
  402.  
  403. /* Posts */
  404. #posts {
  405. border-radius: 2px;
  406. width: 400px;
  407. padding: 20px 20px 10px 20px;
  408. background: {color:Post Background};
  409. text-align: justify;}
  410. #posts img, #posts li, #posts blockquote {max-width: 100%;}
  411.  
  412. /* Photo, Photoset, Video Posts */
  413. .media {margin-bottom: 9px;}
  414. img.center {display:block;margin:auto;}
  415.  
  416. /* Quote and Answer Posts */
  417. .q, .as {
  418. font-family: work sans;
  419. font-size: 12px;
  420. width: 350px;
  421. margin-left: 25px;}
  422. .q {text-align: center;}
  423. .s {text-align: right; margin-top: 3px;}
  424. .as {text-align: right;}
  425. .ques {
  426. margin-top: 3px;
  427. width: 340px;
  428. padding: 5px;
  429. margin-left: 25px;
  430. margin-bottom: 10px;
  431. border-bottom: 1px dotted {color:Ask Border};}
  432.  
  433. /* Chat Posts */
  434. .lines {
  435. font-family: work sans;
  436. line-height: 100%;
  437. margin: 5px 5px 15px 5px;}
  438.  
  439. /* Audio Posts */
  440. .ap {
  441. overflow: hidden;
  442. padding: 0 5px 10px 5px;
  443. width: auto;
  444. height: 25px;
  445. opacity: 0.5;}
  446. .ai {
  447. width: auto;
  448. font-family: work sans;
  449. font-size: 10px;
  450. text-align:center;
  451. margin-bottom:5px;}
  452.  
  453. /* Permalinks */
  454. .perm, .perm2, .perm3 {
  455. position: relative;
  456. width: 400px;
  457. padding: 5px 20px;
  458. background: {color:Post Background};
  459. border-radius: 2px;
  460. font-family: work sans;
  461. color: {color:Permalink};
  462. font-size: 10px;
  463. line-height: 16px;}
  464. .perm { margin-bottom: 5px; margin-top: 30px; height: 15px;}
  465. .perm2 {height: auto; margin-top: 5px; margin-bottom: 15px;}
  466. .perm3 {height: auto; margin-top: -10px;}
  467. .perm a, .perm2 a, .perm3 a {font-size: 10px;}
  468. .perm a:hover, .perm2 a:hover, .perm3 a:hover {color:{color:Permalink Hover};}
  469. .lr {
  470. background: {color:Post Background};
  471. width: 50px;
  472. position: absolute;
  473. right: 0;
  474. padding: 5px 18px 2px 20px;
  475. height: 15px;
  476. margin-top: -5px;
  477. border-radius: 2px;
  478. text-align: right;}
  479. .lr a {margin: 0 2px;}
  480. /* Like Button */
  481. .custom-like-button {
  482. position: relative;
  483. display: inline-block;
  484. width: 10px;
  485. height: 10px;
  486. margin: 1px 2px 1px 0;}
  487. .like_button, .our_button {
  488. position: absolute;
  489. top: 0;
  490. left: 0;
  491. right: 0;
  492. bottom: 0;
  493. width: 100%;
  494. height: 100%;}
  495. .like_button {z-index: 10;opacity: 0;}
  496. .our_button {z-index: 1;}
  497. .like_button iframe {width: 100% !important;height: 100% !important;}
  498. .custom-like-button *{cursor: crosshair!important;}
  499. .like_button:hover + .our_button {color: #f3d7dc;}
  500.  
  501. /* Post Notes */
  502. .pn li {list-style-type: none;}
  503. .pn img {display: none;}
  504. .pn {line-height: 20px; margin-left: -30px;}
  505.  
  506. /* Pagination */
  507. .pag {
  508. margin-left: 280px;
  509. width: 430px;
  510. text-align: center;
  511. margin-bottom:30px;
  512. padding: 5px;
  513. background: {color:Post Background};
  514. border-radius: 2px;}
  515. .pag a {
  516. font-family: work sans;
  517. text-transform: uppercase;
  518. font-size: 11px;
  519. margin: 0 5px;}
  520.  
  521. /* Back to Top Button */
  522. a.back-to-top {
  523. position: fixed;
  524. bottom: 10px;
  525. right: 15px;
  526. z-index: 999;
  527. font-size: 10px;
  528. font-family: work sans;}
  529.  
  530. </style>
  531. </head>
  532.  
  533. <body>
  534.  
  535. <div class="top">
  536. <div class="links">
  537. <!-- Top Bar Links -->
  538. <a href="/">Index</a>
  539. <a href="/ask">Contact</a>
  540. <a href="/submit">Submit</a>
  541. <a href="{text:Link One URL}">{text:Link One Title}</a>
  542. <a href="{text:Link Two URL}">{text:Link Two Title}</a>
  543. <a href="{text:Link Three URL}">{text:Link Three Title}</a>
  544. <a href="/archive">Past</a>
  545. <!---->
  546. </div>
  547.  
  548. {block:IndexPage}
  549. {block:ifMinimalControls}
  550. <div class="con">
  551. <a title="Instant Message" href="http://tumblr.com/dashboard?conversation={Name}"><i class="fa fa-comments-o"></i></a>
  552. <a title="Follow" href="http://tumblr.com/follow/{Name}"><i class="fa fa-user-plus"></i></a>
  553. <a title="Dashboard" href="http://tumblr.com/"><i class="fa fa-power-off"></i></a>
  554. <a title="Theme Credit" href="http://crimsonxthemes.tumblr.com"><i class="fa fa-anchor"></i></a>
  555. </div>
  556. {/block:ifMinimalControls}
  557. {/block:IndexPage}
  558.  
  559. <div class="icon">
  560. <a title="{Title}" href="/"><img src="{PortraitURL-48}" /></a>
  561. </div>
  562. </div>
  563.  
  564. <div class="header">
  565. <img src="{image:Header Image}" />
  566. </div>
  567.  
  568. {block:ifBackToTop}
  569. <a href="#" class="back-to-top">Back to top <i class="fa fa-angle-double-up"></i></a>
  570. {/block:ifBackToTop}
  571.  
  572. <div id="container">
  573.  
  574. <!-- Start Sidebar One --><div class="sideone"><!---->
  575.  
  576.  
  577.  
  578.  
  579. <!--------------- Description Box --------------->
  580. <div class="box">
  581. <div class="btitle"><i class="fa fa-home"></i> {Title}</div>
  582. <div class="info"><center>{Description}</center></div>
  583. </div>
  584. <!------------------------------>
  585.  
  586.  
  587.  
  588.  
  589. {block:ifExtraLinksBox}
  590. <!--------------- Extra Links Box --------------->
  591. <div class="box">
  592. <div class="btitle"><i class="fa fa-share-alt"></i> Links</div>
  593. <div class="blinks">
  594. <!-- Extra Links -->
  595. <a href="/">Extra Link One »</a>
  596. <!---->
  597. </div>
  598. </div>
  599. <!------------------------------>
  600. {/block:ifExtraLinksBox}
  601.  
  602.  
  603.  
  604. {block:ifMembersBox}
  605. <!--------------- Members Box --------------->
  606. <div class="box">
  607. <div class="btitle"><i class="fa fa-users"></i> Members</div>
  608. <!-- Members -->
  609. <div class="mem">
  610. <!-- Change Member Image -->
  611. <img src="" />
  612. <!---->
  613. <!-- Change Member Link -->
  614. <div class="memname">
  615. <a href="/"></a>
  616. </div>
  617. <!---->
  618. <!-- Change Member Tagline -->
  619. <div class="memtag">
  620.  
  621. </div>
  622. <!---->
  623. </div>
  624. <!---->
  625. </div>
  626. <!------------------------------>
  627. {/block:ifMembersBox}
  628.  
  629.  
  630.  
  631. {block:ifStatisticsBox}
  632. <!--------------- Statistics Box --------------->
  633. <div class="box">
  634. <div class="btitle"><i class="fa fa-pie-chart"></i> Statistics</div>
  635. <div class="info">
  636. <!-- Statistics -->
  637. Visits:<br>
  638. Status:<br>
  639. Created:
  640. <!---->
  641. </div>
  642. </div>
  643. <!------------------------------>
  644. {/block:ifStatisticsBox}
  645.  
  646.  
  647.  
  648. {block:ifAffiliatesBox}
  649. <!--------------- Affiliates Box --------------->
  650. <div class="box">
  651. <div class="btitle"><i class="fa fa-thumbs-o-up"></i> Affiliates</div>
  652. <div class="info">
  653. <!-- Affiliates -->
  654. <a title="" href=""><img src="" /></a>
  655. <!---->
  656. </div>
  657. </div>
  658. <!------------------------------>
  659. {/block:ifAffiliatesBox}
  660.  
  661.  
  662.  
  663. {block:ifSearchBox}
  664. <!--------------- Search Box --------------->
  665. <div class="box">
  666. <div class="btitle"><i class="fa fa-search"></i> Search</div>
  667. <div class="info">
  668. <form class="search" action="javascript:return false">
  669. <input type="text" class="query" placeholder="{text:Search Text}"></form>
  670. </div>
  671. </div>
  672. <!------------------------------>
  673. {/block:ifSearchBox}
  674.  
  675.  
  676.  
  677. <!--------------- Disclaimer Box --------------->
  678. <div class="box">
  679. <div class="btitle"><i class="fa fa-warning"></i> Disclaimer</div>
  680. <div class="info">
  681. <center>{text:Disclaimer}</center>
  682. <p>
  683. <center><a title="Crimson Themes" href="http://crimsonxthemes.tumblr.com"><i class="fa fa-anchor"></i></a></center>
  684. </div>
  685. </div>
  686. <!------------------------------>
  687. <!-- End Sidebar One --></div><!---->
  688.  
  689.  
  690.  
  691. <!-- Start Sidebar Two --><div class="sidetwo"><!---->
  692.  
  693.  
  694.  
  695. {block:ifUpdatesBox}
  696. <!--------------- Updates Box --------------->
  697. <div class="box">
  698. <div class="btitle"><i class="fa fa-history"></i> Recent Updates</div>
  699. <div class="info">
  700. <div class="recent">
  701. <img src="{image:Update One Image}" />
  702. <img src="{image:Update Two Image}" />
  703. <img src="{image:Update Three Image}" />
  704. <img src="{image:Update Four Image}" />
  705. <img src="{image:Update Five Image}" />
  706. </div>
  707. </div>
  708. </div>
  709. <!------------------------------>
  710. {/block:ifUpdatesBox}
  711.  
  712.  
  713.  
  714. {block:ifSchedulesBox}
  715. <!--------------- Schedule Box --------------->
  716. <div class="box">
  717. <div class="btitle"><i class="fa fa-calendar"></i> Schedule</div>
  718. <!-- Change Schedule Info -->
  719. <!-- Change Month -->
  720. <div class="month">
  721. <!-- Month here -->
  722. </div>
  723. <!-- Change Dates and Info -->
  724. <div class="info">
  725. <b><!-- Date here --></b> <!-- Info here --><p>
  726. </div>
  727. <!---->
  728. <!---->
  729. </div>
  730. <!------------------------------>
  731. {/block:ifSchedulesBox}
  732.  
  733.  
  734.  
  735. {block:ifProjectsBox}
  736. <!--------------- Projects Box --------------->
  737. <div class="box">
  738. <div class="btitle"><i class="fa fa-folder-o"></i> Upcoming Projects</div>
  739. <!-- Projects -->
  740. <!--- Change Project Image -->
  741. <div class="pimg">
  742. <img src=""/>
  743. </div>
  744. <!---->
  745. <!-- Change Project Info -->
  746. <div class="info">
  747. <!-- Change Project Title -->
  748. <center><b>Project title</b></center>
  749. <!---->
  750. <!-- Other Info -->
  751. Release date: --/--/----<br>
  752. Project Info: Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  753. <!---->
  754. </div>
  755. <!---->
  756. <!---->
  757. </div>
  758. <!------------------------------>
  759. {/block:ifProjectsBox}
  760.  
  761.  
  762.  
  763. {block:ifRelatedBox}
  764. <!--------------- Related Blogs Box --------------->
  765. <div class="box">
  766. <div class="btitle"><i class="fa fa-user-plus"></i> Related Blogs</div>
  767. <div class="blinks">
  768. <!-- Related Blog Links -->
  769. <a href="/">Blog One »</a>
  770. <!---->
  771. </div>
  772. </div>
  773. <!------------------------------>
  774. {/block:ifRelatedBox}
  775.  
  776.  
  777.  
  778. <!-- End Sidebar Two --></div><!---->
  779.  
  780.  
  781.  
  782. <!----------------------------------------------------------------------->
  783.  
  784.  
  785.  
  786. <div class="entries">
  787.  
  788. {Block:Posts}
  789.  
  790.  
  791. <div class="perm">
  792. {Block:Date}
  793.  
  794. {block:IndexPage}
  795. <div class="lr">
  796.  
  797. <div class="custom-like-button">
  798. <div class="like_button">{LikeButton}</div>
  799. <span class="our_button"><i class="fa fa-heart-o"></i></span>
  800. </div>
  801.  
  802. <a title="Reblog" href="{ReblogURL}" target="_blank"><i class="fa fa-undo"></i></a>
  803.  
  804. <a title="View Post - {NoteCountWithLabel}" href="{Permalink}"><i class="fa fa-map-marker"></i></a>
  805. </div>
  806. {/block:IndexPage}
  807.  
  808. {block:Text}<i class="fa fa-pencil"></i>{/block:Text}
  809. {block:Photo}<i class="fa fa-camera-retro"></i>{/block:Photo}
  810. {block:Photoset}<i class="fa fa-camera-retro"></i>{/block:Photoset}
  811. {block:Video}<i class="fa fa-tv"></i>{/block:Video}
  812. {block:Quote}<i class="fa fa-quote-left"></i>{/block:Quote}
  813. {block:Link}<i class="fa fa-chain"></i>{/block:Link}
  814. {block:Chat}<i class="fa fa-comments-o"></i>{/block:Chat}
  815. {block:Audio}<i class="fa fa-music"></i>{/block:Audio}
  816. {block:Answer}<i class="fa fa-question"></i>{/block:Answer}
  817.  
  818. {block:IndexPage}
  819. <a title="{NoteCountWithLabel}" href="{Permalink}">{Month} {DayOfMonthWithZero}, ’{ShortYear}</a> | {24HourWithZero}:{Minutes}:{Seconds} {block:RebloggedFrom}| <a title="{ReblogParentName}" href="{ReblogParentURL}">Via</a> | <a title="{ReblogRootName}" href="{ReblogRootURL}">Origins</a> {/block:RebloggedFrom}
  820. {/block:IndexPage}
  821.  
  822. {block:PermalinkPage}
  823. {block:Text}Text {block:NotReblog}posted{/block:NotReblog}{block:RebloggedFrom}reblogged{/block:RebloggedFrom}{/block:Text}
  824. {block:Photo}Photo {block:NotReblog}posted{/block:NotReblog}{block:RebloggedFrom}reblogged{/block:RebloggedFrom}{/block:Photo}
  825. {block:Photoset}Photoset {block:NotReblog}posted{/block:NotReblog}{block:RebloggedFrom}reblogged{/block:RebloggedFrom}{/block:Photoset}
  826. {block:Video}Video {block:NotReblog}posted{/block:NotReblog}{block:RebloggedFrom}reblogged{/block:RebloggedFrom}{/block:Video}
  827. {block:Quote}Quote {block:NotReblog}posted{/block:NotReblog}{block:RebloggedFrom}reblogged{/block:RebloggedFrom}{/block:Quote}
  828. {block:Link}Link {block:NotReblog}posted{/block:NotReblog}{block:RebloggedFrom}reblogged{/block:RebloggedFrom}{/block:Link}
  829. {block:Chat}Chat {block:NotReblog}posted{/block:NotReblog}{block:RebloggedFrom}reblogged{/block:RebloggedFrom}{/block:Chat}
  830. {block:Audio}Audio {block:NotReblog}posted{/block:NotReblog}{block:RebloggedFrom}reblogged{/block:RebloggedFrom}{/block:Audio}
  831. {block:Answer}Answer {block:NotReblog}posted{/block:NotReblog}{block:RebloggedFrom}reblogged{/block:RebloggedFrom}{/block:Answer}
  832. on {Month} {DayOfMonthWithZero}, {Year} at {24HourWithZero}:{Minutes}:{Seconds}
  833. {/block:PermalinkPage}
  834. {/Block:Date}
  835. </div>
  836.  
  837. <div id="posts">
  838. {block:Text}{block:Title}<div class="pti">{Title}</div>{/block:Title}{Body}{/block:Text}
  839.  
  840. {block:Link}<div class="pti"><a href="{URL}">{Name} »</a></div>{block:Description}{Description}{/block:Description}{/block:Link}
  841.  
  842. {block:Quote}<div class="q">❝ {Quote} ❞</div>{block:Source}<div class="s">– {Source}</div>{/block:Source}{/block:Quote}
  843.  
  844. {block:Photo}<div class="media">{LinkOpenTag}<img class="center" src="{PhotoURL-400}" />{LinkCloseTag}</div>{Block:Caption}{Caption}{/Block:Caption}{/block:Photo}
  845.  
  846. {block:Photoset}<div class="media">{Photoset}</div>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  847.  
  848. {block:Video}<div class="media">{Video-400}</div>{block:Caption}{Caption}{/block:Caption}{/block:Video}
  849.  
  850. {block:Answer}<div class="as">{Asker}</div><div class="ques">{Question}</div>{block:Answerer}<div class="as">{Answerer}</div><div class="ques">{/block:Answerer}<div class="ques2">{Answer}</div>{block:Answerer}</div>{/block:Answerer}{/block:Answer}
  851.  
  852. {block:Chat}{block:Title}<div class="pti">{Title}</div>{/block:Title}{block:Lines} <div class="lines">{block:Label}<b>{Label}</b>{/block:Label} {Line}</div>{/block:Lines}{/block:Chat}
  853.  
  854. {block:Audio}{block:AudioPlayer}<div class="ap"><center>{AudioPlayer}</center></div>{/block:AudioPlayer}{block:Artist}<div class="ai">{Artist}</div>{/block:Artist}{block:TrackName}<div class="ai"><b>{TrackName}</b></div>{/block:TrackName}{block:Album}<div class="ai">{Album}</div>{/block:Album}{block:PlayCount}<div class="ai"><i>{PlayCountWithLabel}</i></div>{/block:PlayCount}{block:Caption}{Caption}{/block:Caption}{/block:Audio}
  855.  
  856. </div>
  857.  
  858. {block:Date}
  859. {block:IndexPage}
  860. {block:HasTags}
  861. <div class="perm2">
  862. {block:Tags}<a href="{TagURL}">{text:Tags Symbol}{Tag} </a>{/block:Tags}
  863. </div>
  864. {/block:HasTags}
  865. {/block:IndexPage}
  866.  
  867. {block:PermalinkPage}
  868. <div class="perm2">
  869. <center>{NoteCountWithLabel} {block:RebloggedFrom}| <a title="{ReblogParentName}" href="{ReblogParentURL}">Via</a> | <a title="{ReblogRootName}" href="{ReblogRootURL}">Origins</a> {/block:RebloggedFrom}</center>
  870. {block:HasTags}<center>{block:Tags}<a href="{TagURL}">{text:Tags Symbol}{Tag} </a>{/block:Tags}</center>{/block:HasTags}
  871. </div>
  872.  
  873. {block:PostNotes}
  874. <div class="perm3">
  875. <div class="pn">{PostNotes}</div>
  876. </div>
  877. {/block:PostNotes}
  878. {/block:PermalinkPage}
  879. {/block:Date}
  880.  
  881. {Block:Posts}
  882. </div>
  883.  
  884. {block:Pagination}
  885. <div class="pag">
  886. {block:PreviousPage}<div class="next"><a href="{PreviousPage}">Previous</a> ◉ {/block:PreviousPage}{block:NextPage}<a href="{NextPage}">Next</a></div>{/block:NextPage}
  887. </div>
  888. {/block:Pagination}
  889.  
  890. </div>
  891. <!--------- No need to edit below this line --------->
  892.  
  893. {block:ifnotMinimalControls}
  894. <div class="cred"><a href="http://crimsonxthemes.tumblr.com" title="Crimson Themes"><i class="fa fa-anchor"></i></a></div>
  895. {/block:ifnotMinimalControls}
  896.  
  897. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  898. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
  899. <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
  900. <script src="http://static.tumblr.com/4fjyb6u/DiNo7srsg/slick.min.js"></script>
  901.  
  902.  
  903. <script type="text/javascript">
  904. $(document).ready(function(){
  905.  
  906. //sticky top
  907. $(function(){
  908. var stickyRibbonTop = $('.top').offset().top;
  909. $(window).scroll(function(){
  910. if( $(window).scrollTop() > stickyRibbonTop ) {
  911. $('.top').css({position: 'fixed', top: '0px', left: '0px', height: '56px', width: '100%'});
  912. $('.iframe-controls--desktop').css({top: '14px'});
  913. $('.icon').css({top: '0px'});
  914. $('.con').css({top: '13px'});
  915. $('.links').css({top: '13px'});
  916. } else {
  917. $('.top').css({position: 'absolute', top: '20px', height: '30px', width: '100%'});
  918. $('.icon').css({top: '-14px'});
  919. $('.con').css({top: '2px'});
  920. $('.links').css({top: '2px'});
  921. $('.iframe-controls--desktop').css({top: '24px'});
  922. }
  923. });
  924. });
  925.  
  926. //search tags @shythemes
  927. $('.search').submit(function(event){
  928. var value = $('input:first').val();
  929. location.replace('http://{Name}.tumblr.com/tagged/' + value);
  930. });
  931.  
  932. //slick carousel @kenwheeler
  933. $('.recent').slick({
  934. adaptiveHeight: true,
  935. dots: true,
  936. arrows: false,
  937. autoplay: true,
  938. infinite: false
  939. });
  940.  
  941. //back to top @html-tuts
  942. $('a.back-to-top').click(function() {
  943. $('html, body').animate({
  944. scrollTop: 0
  945. }, 700);
  946. return false;
  947. });
  948. });
  949.  
  950. </script>
  951.  
  952. </body>
  953. </html>
Add Comment
Please, Sign In to add comment