bychloethemes

Primary Colour Theme - by Chloe

Jun 21st, 2015
2,216
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 32.04 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <!--
  5. Primary Colour Theme made by Chloe | @dontbrag | @bychloethemes
  6. Do not copy, do not remove the credit, do not redistribute.
  7. -->
  8. <meta name="image:Background" content="" />
  9. <meta name="image:icon" content="" />
  10.  
  11. <meta name="color:Border" content="#315283"/>
  12. <meta name="color:Background" content="#fff" />
  13. <meta name="color:Post Background" content="#bad8eb" />
  14. <meta name="color:Post Text" content="#fff" />
  15. <meta name="color:Link Color" content="#315283" />
  16. <meta name="color:Accent" content="#315283" />
  17. <meta name="color:Secondary Accent" content="#fff" />
  18. <meta name="color:Tab Text" content="#000" />
  19. <meta name="color:Tab Text Colour 2" content="#676767"/>
  20. <meta name="color:Tab Links Hover" content="#111"/>
  21. <meta name="color:Tooltip Background" content="#000" />
  22. <meta name="color:Tooltip Text" content="#fff" />
  23. <meta name="color:Scrollbar" content="#000" />
  24. <meta name="color:Navbar Text" content="#fff" />
  25. <meta name="color:Permalink Background" content="#000" />
  26. <meta name="color:Description" content="#000" />
  27. <meta name="color:Description text" content="#fff" />
  28. <meta name="color:Description links" content="#f00" />
  29.  
  30. <meta name="font:Body" content='verdana,sans-serif'/>
  31.  
  32. <meta name="select:Other Font" content="Consolas" title="Consolas">
  33. <meta name="select:Other Font" content="Arial" title="Arial">
  34. <meta name="select:Other Font" content="Century Gothic" title="Century Gothic">
  35. <meta name="select:Other Font" content="'Open Sans', sans-serif" title="Open Sans">
  36. <meta name="select:Other Font" content="'Abel', sans-serif" title="Abel">
  37. <meta name="select:Other Font" content="Calibri" title="Calibri">
  38. <meta name="select:Other Font" content="'Josefin Slab', sans-serif" title="Josefin Slab">
  39. <meta name="select:Other Font" content="'Inconsolata', " title="Inconsolata">
  40. <meta name="select:Other Font" content="'Delius', cursive" title="Delius">
  41. <meta name="select:Other Font" content="'Marmelad', sans-serif" title="Marmelad">
  42.  
  43. <meta name="if:Other Font" content="1" />
  44. <meta name="if:Tiled Background" content="0" />
  45. <meta name="if:5 Tabs" content="0" />
  46. <meta name="if:Show Description" content="1" />
  47. <meta name="if:Black Permalinks" content="0" />
  48. <meta name="if:Archive Tab" content="1"/>
  49. <meta name="if:Links Tab" content="1" />
  50. <meta name="if:Blogroll" content="1" />
  51. <meta name="if:Search Bar" content="1" />
  52. <meta name="if:Pagination" content="0" />
  53.  
  54. <meta name="text:Font Size" content="14" />
  55. <meta name="text:Faq" content=""/>
  56. <meta name="text:Link1" content=""/>
  57. <meta name="text:Link1URL" content=""/>
  58. <meta name="text:Link2" content=""/>
  59. <meta name="text:Link2URL" content=""/>
  60. <meta name="text:Link3" content=""/>
  61. <meta name="text:Link3URL" content=""/>
  62. <meta name="text:Link4" content=""/>
  63. <meta name="text:Link4URL" content=""/>
  64. <meta name="text:Link5" content=""/>
  65. <meta name="text:Link5URL" content=""/>
  66. <meta name="text:Link6" content=""/>
  67. <meta name="text:Link6URL" content=""/>
  68. <meta name="text:Link7" content=""/>
  69. <meta name="text:Link7URL" content=""/>
  70. <meta name="text:Link8" content=""/>
  71. <meta name="text:Link8URL" content=""/>
  72.  
  73. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
  74. <script>
  75. $(document).ready(function(){
  76. $(".changer").click(function(){
  77. if ($(".slidey" + $(this).data("slidey")).hasClass("change_it"))
  78. {
  79. $(".slidey" + $(this).data("slidey")).removeClass("change_it");
  80. return false;
  81. }
  82. $(".slidey1, .slidey2, .slidey3, .slidey4, .slidey5").removeClass("change_it");
  83. $(".slidey" + $(this).data("slidey")).addClass("change_it");
  84. return false;
  85. });
  86. });
  87. </script>
  88.  
  89. {block:Description}
  90. <meta name="description" content="{MetaDescription}" />
  91. {/block:Description}
  92. <meta charset="utf-8">
  93. <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  94. <title>{block:TagPage}{Tag} posts | {/block:TagPage} {block:PostSummary}{PostSummary} | {/block:PostSummary}{Title}</title>
  95. <link rel="shortcut icon" href="{Favicon}">
  96. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  97. <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  98. <link href="http://static.tumblr.com/wgijwsy/k1Hm9ei8b/normalize.css" rel="stylesheet" type="text/css" />
  99. <link href='http://fonts.googleapis.com/css?family=Abel|Cutive+Mono|Poiret+One|Short+Stack|Josefin+Slab|Inconsolata|Slabo+27px|Open+Sans|Delius|Marmelad' rel='stylesheet' type='text/css'>
  100. <style type="text/css">
  101. div.content::-webkit-scrollbar {
  102. background-color: rgba(0,0,0,0);
  103. height: 10px;
  104. width: 10px;
  105. }
  106. div.content::-webkit-scrollbar-thumb {
  107. background-color: {color:Scrollbar};
  108. width: 10px;
  109. height: 10px;
  110. }
  111. div.postnotes::-webkit-scrollbar {
  112. background-color: rgba(0,0,0,0);
  113. height: 7px;
  114. width: 7px;
  115. }
  116. div.postnotes::-webkit-scrollbar-thumb {
  117. background-color: {color:Scrollbar};
  118. width: 7px;
  119. height: 7px;
  120. }
  121. body {
  122. background:{color:Border};
  123. overflow-x:hidden;
  124. {block:IfOtherFont}
  125. font-family: {select:Other Font};
  126. {/block:IfOtherFont}
  127. {block:IfNotOtherFont}
  128. font-family: {font:Body};
  129. {/block:IfNotOtherFont}
  130. font-size:{text:Font Size}px;
  131. }
  132. blockquote {
  133. border-left: 1px solid {color:Accent};
  134. margin: 0px 0px 0px 10px!important;
  135. }
  136. iframe, img, embed, object, video {
  137. max-width: 100%;
  138. }
  139. img {
  140. height: auto;
  141. width: auto;
  142. text-align:center;
  143. margin:0 auto;
  144. border-radius:5px;
  145. }
  146. p {
  147. margin:5px 0 5px 5px;
  148. }
  149. #navbar {
  150. color:{color:Navbar Text};
  151. font-size:13px;
  152. position:fixed;
  153. left:35px;
  154. top:9px;
  155. }
  156. #bottombar {
  157. width:100%;
  158. background:{color:Border};
  159. height:35px;
  160. left:0;
  161. bottom:0;
  162. position:fixed;
  163. z-index:9999999999999999;
  164. }
  165. ul.navlinks {
  166. padding:0;
  167. list-style-type:none;
  168. margin:0;
  169. }
  170. ul.navlinks li {
  171. display:inline-block;
  172. margin:0 2px;
  173. }
  174. ul.navlinks li a {
  175. color:{color:Navbar Text};
  176. }
  177. ul.navlinks li a:hover {
  178. text-decoration:none;
  179. border-bottom:2px solid {color:Navbar Text};
  180. }
  181. .icon {
  182. border-radius:100%;
  183. width:90px;
  184. height:90px;
  185. border:5px solid {color:Description};
  186. background: {color:Description};
  187. position:fixed;
  188. top:180px;
  189. overflow:hidden;
  190. z-index:99999999999999;
  191. right:116px;
  192. }
  193. .describe {
  194. border-radius:5px;
  195. background:{color:Description};
  196. width:110px;
  197. padding:10px;
  198. height:auto;
  199. position:fixed;
  200. top:300px;
  201. z-index:99999999999999;
  202. right:101px;
  203. color:{color:Description Text};
  204. text-align:center;
  205. font-size:0.8em;
  206. }
  207. .describe:before {
  208. content:"";
  209. width: 0;
  210. height: 0;
  211. border-style: solid;
  212. z-index:99999999999999999;
  213. border-color: transparent transparent {color:Description} transparent;
  214. position:absolute;
  215. border-width: 0px 8px 10px 8px;
  216. top:-10px;
  217. left:calc(50% - 8px);
  218. }
  219. .describe a:link, .describe a:active,
  220. .describe a:visited, .describe a:hover {
  221. color:{color:Description Links};
  222. }
  223. .pagination {
  224. position:absolute;
  225. bottom:-23px;
  226. width:110px;
  227. }
  228. .pagination a {
  229. background:{color:Description};
  230. padding:5px;
  231. border-radius:5px;
  232. margin:1px;
  233. }
  234. .slidey5, .slidey1, .slidey2, .slidey3, .slidey4 {
  235. background:{color:Background} url('{image:Background}'){block:IfNotTiledBackground}no-repeat center center fixed;
  236. -webkit-background-size: cover;
  237. -moz-background-size: cover;
  238. -o-background-size: cover;
  239. background-size: cover;
  240. {/block:IfNotTiledBackground}
  241. {block:IfTiledBackground}
  242. repeat;
  243. background-attachment:fixed;
  244. {/block:IfTiledBackground}
  245. width:calc(100% - 360px);
  246. bottom:35px;
  247. height:calc(100% - 170px);
  248. position:fixed;
  249. z-index:999999999;
  250. color:{color:Tab Text};
  251. font-size:50px;
  252. padding:50px 240px 50px 50px;
  253. left:35px;
  254. overflow-y:scroll;
  255. opacity:0;
  256. visibility:hidden;
  257. border-radius:5px;
  258. /* -webkit-transition: all 0.7s ease-in-out;
  259. -moz-transition: all 0.7s ease-in-out;
  260. -o-transition: all 0.7s ease-in-out;
  261. transition: all 0.7s ease-in-out;*/
  262. }
  263. .slidey1 h2, .slidey2 h2 {
  264. font-size:30px;
  265. font-weight:normal;
  266. margin:0;
  267. color:{color:Tab Text Colour 2};
  268. padding:0;
  269. }
  270. .slidey1 h3, .slidey2 h3 {
  271. font-size:20px;
  272. font-weight:normal;
  273. margin:10px 0;
  274. padding:0;
  275. }
  276. .slidey2 a:link, .slidey2 a:visited,
  277. .slidey5 a:link, .slidey5 a:visited {
  278. color:{color:Tab Text Colour 2};
  279. }
  280. .slidey2 a:hover, .slidey2 a:active,
  281. .slidey5 a:hover, .slidey5 a:active {
  282. color:{color:Tab Links Hover};
  283. }
  284. .slidey4 {
  285. padding:0!important;
  286. height:calc(100% - 68px)!important;
  287. width:calc(100% - 70px)!important;
  288. overflow-y:hidden!important;
  289. z-index:999999999999999999;
  290. }
  291. .slidey5 table {
  292. border-spacing:10px;
  293. border-collapse: separate;
  294. width:100%;
  295. }
  296. .slidey5 table td{
  297. vertical-align:top;
  298. }
  299. .change_it {
  300. visibility:visible;
  301. opacity:1;
  302. }
  303. a:link, a:visited {
  304. color:{color:Link Color};
  305. text-decoration:none;
  306. }
  307. a:hover, a:active {
  308. text-decoration:underline;
  309. }
  310. .content {
  311. background:{color:Background} url('{image:Background}'){block:IfNotTiledBackground}no-repeat center center fixed;
  312. -webkit-background-size: cover;
  313. -moz-background-size: cover;
  314. -o-background-size: cover;
  315. background-size: cover;
  316. {/block:IfNotTiledBackground}
  317. {block:IfTiledBackground}
  318. repeat;
  319. background-attachment:fixed;
  320. {/block:IfTiledBackground}
  321. width:calc(100% - 70px);
  322. height:calc(100vh - 70px);
  323. margin:auto;
  324. position:absolute;
  325. left:0;
  326. top:0;
  327. bottom:0;
  328. right:0;
  329. overflow-y:auto;
  330. border-radius:5px;
  331. }
  332. #tumblrcontent {
  333. width:916px;
  334. height:100%;
  335. }
  336. article {
  337. {block:IndexPage}
  338. width:250px;
  339. margin:16px;
  340. border-top:10px solid {color:Post Background};
  341. border-right:10px solid {color:Post Background};
  342. border-bottom:49px solid {color:Post Background};
  343. border-left:10px solid {color:Post Background};
  344. {/block:IndexPage}
  345. {block:PermalinkPage}
  346. width:500px;
  347. margin:16px;
  348. border:10px solid {color:Post Background};
  349. {/block:PermalinkPage}
  350. {block:TagPage}
  351. width:400px;
  352. margin:16px;
  353. {/block:TagPage}
  354. background:{color:Post Background};
  355. color:{color:Post Text};
  356. font-size:{text:Font Size}px;
  357. border-radius:5px;
  358. }
  359. article img {
  360. vertical-align:middle;
  361. }
  362. h1.post_title {
  363. padding:0;
  364. margin:0;
  365. font-size:20px;
  366. }
  367. .quote h1.post_title {
  368. color:{color:Accent};
  369. }
  370. {block:TagPage}
  371. .photosetty {
  372. display:none;
  373. }
  374. {/block:TagPage}
  375. cite {
  376. font-style:normal;
  377. }
  378. .chat span {
  379. float: left;
  380. margin-right: 5px;
  381. }
  382. .chat .label {
  383. color:{color:Accent};
  384. text-transform:uppercase;
  385. font-weight:bold;
  386. }
  387. .chat ul {
  388. list-style: none;
  389. margin: 0;
  390. padding: 0;
  391. }
  392. .chat li {
  393. padding: 5px 10px!important;
  394. }
  395. .chat .even {
  396. background: {color:Secondary Accent};
  397. border-radius:3px;
  398. }
  399. .tumblr_audio_player {
  400. height: 30px;
  401. width: 500px;
  402. opacity:0.9;
  403. {block:permalinkpage}
  404. margin-top:14px;
  405. {/block:permalinkpage}
  406. }
  407. .albumart {
  408. position:absolute;
  409. {block:IndexPage}
  410. width:60px;
  411. height:60px;
  412. {/block:IndexPage}
  413. {block:TagPage}
  414. width:160px;
  415. height:160px;
  416. {/block:TagPage}
  417. }
  418.  
  419. .albumart img {
  420. float:left;
  421. margin-left:5px;
  422. {block:IndexPage}
  423. width:60px;
  424. height:60px;
  425. {/block:IndexPage}
  426. {block:TagPage}
  427. width:160px!important;
  428. height:160px!important;
  429. {/block:TagPage}
  430. }
  431.  
  432. .playbox {
  433. opacity:0.6;
  434. width:30px;
  435. height:30px;
  436. overflow:hidden;
  437. position:absolute;
  438. z-index:2;
  439. margin-left:21px;
  440. margin-top:16px;
  441. {block:TagPage}
  442. margin-left:71px!important;
  443. margin-top:66px!important;
  444. {/block:TagPage}
  445. }
  446. .audioinfo {
  447. margin-top:2px;
  448. line-height:12px;
  449. margin-bottom:10px;
  450. padding-left:5px;
  451. min-height:60px;
  452. font-size:12px;
  453. border-left:1px solid {color:Accent};
  454. {block:IndexPage}
  455. margin-left:75px;
  456. {block:IndexPage}
  457. {block:TagPage}
  458. margin-left:175px!important;
  459. font-size:14px!important;
  460. line-height:28px!important;
  461. min-height:160px!important;
  462. {/block:TagPage}
  463. }
  464. .asks {
  465. border-radius:5px;
  466. margin-right:15px;
  467. margin-bottom:10px;
  468. float:left;
  469. }
  470. .question {
  471. background:{color:Secondary Accent};
  472. border-radius:5px;
  473. padding:5px 5px 5px 8px;
  474. line-height:15px;
  475. float:left;
  476. margin-bottom:15px;
  477. {block:IndexPage}
  478. width:190px;
  479. {/block:IndexPage}
  480. {block:PermalinkPage}
  481. width:375px;
  482. {/block:PermalinkPage}
  483. }
  484. .question:before {
  485. content:"";
  486. width: 0;
  487. height: 0;
  488. border-style: solid;
  489. z-index:999;
  490. border-color: transparent {color:Secondary Accent} transparent transparent;
  491. position:absolute;
  492. {block:IndexPage}
  493. border-width: 4px 10px 4px 0px;
  494. left:35px;
  495. {/block:IndexPage}
  496. {block:PermalinkPage}
  497. border-width: 7px 15px 7px 0px;
  498. left:101px;
  499. {/block:PermalinkPage}
  500. }
  501. .asks2 {
  502. border-radius:5px;
  503. margin-left:15px;
  504. margin-bottom:10px;
  505. float:right;
  506. }
  507. .question2 {
  508. background:{color:Secondary Accent};
  509. border-radius:5px;
  510. padding:5px 5px 5px 8px;
  511. line-height:15px;
  512. margin-bottom:15px;
  513. float:right;
  514. {block:IndexPage}
  515. width:190px;
  516. {/block:IndexPage}
  517. {block:PermalinkPage}
  518. width:375px;
  519. {/block:PermalinkPage}
  520. }
  521. .question2:before {
  522. content:"";
  523. width: 0;
  524. height: 0;
  525. border-style: solid;
  526. z-index:999;
  527. border-color: transparent transparent transparent {color:Secondary Accent};
  528. position:absolute;
  529. {block:IndexPage}
  530. border-width: 4px 0px 4px 10px;
  531. right:35px;
  532. {/block:IndexPage}
  533. {block:PermalinkPage}
  534. border-width: 7px 0px 7px 15px;
  535. right:101px;
  536. {/block:PermalinkPage}
  537. }
  538. ul#tags {
  539. list-style-type:none;
  540. padding:0;
  541. margin:10px 0;
  542. }
  543. ul#tags li {
  544. display:inline-block;
  545. margin:5px;
  546. }
  547. .permalinks {
  548. {block:IfBlackPermalinks}
  549. color:#000;
  550. {/block:IfBlackPermalinks}
  551. {block:IfNotBlackPermalinks}
  552. color:#fff;
  553. {/block:IfNotBlackPermalinks}
  554. background:{color:Permalink Background};
  555. width:100%;
  556. margin-top:7px;
  557. font-size:14px;
  558. position:absolute;
  559. left:-10px;
  560. display:block;
  561. height:14px;
  562. bottom:-49px;
  563. padding:10px;
  564. border-radius:0 0 5px 5px;
  565. }
  566. .permalinks:before {
  567. content:"";
  568. width: 0;
  569. height: 0;
  570. border-style: solid;
  571. z-index:999;
  572. border-color: transparent transparent {color:Permalink Background} transparent;
  573. position:absolute;
  574. border-width: 0px 6px 8px 6px;
  575. left:15px;
  576. top:-8px;
  577. }
  578. .permalinks .other_permas li{
  579. list-style-type:none;
  580. display:inline-block;
  581. float:right;
  582. margin:0px 3px;
  583. }
  584. .permalinks a {
  585. {block:IfBlackPermalinks}
  586. color:#000;
  587. {/block:IfBlackPermalinks}
  588. {block:IfNotBlackPermalinks}
  589. color:#fff;
  590. {/block:IfNotBlackPermalinks}
  591. }
  592. .detailios {
  593. width:500px;
  594. margin:0px 16px 21px 16px;
  595. border:10px solid {color:Post Background};
  596. background:{color:Post Background};
  597. color:{color:Post Text};
  598. font-size:{text:Font Size}px;
  599. border-radius:5px;
  600. }
  601.  
  602. #notes {
  603. max-height:250px;
  604. overflow:auto;
  605. margin-bottom:60px;
  606. }
  607. ol.notes {
  608. padding: 0px;
  609. list-style-type: none;
  610. margin:0 5px 0 0;
  611. }
  612.  
  613. ol.notes li.note {
  614. margin:10px 0px;
  615. padding:0;
  616. text-align:left;
  617. line-height:16px;
  618. width:100%;
  619. border:0;
  620. border-radius:0;
  621. background:transparent;
  622. border-bottom:1px solid {color:Accent};
  623. padding-bottom:5px;
  624.  
  625. }
  626. ol.notes li.note:last-child {
  627. border-bottom:0;
  628. }
  629. ol.notes li.note img.avatar {
  630. display:none;
  631. }
  632.  
  633. ol.notes li.note span.action {
  634. font-weight: normal;
  635. }
  636.  
  637. ol.notes li.note .answer_content {
  638. font-weight: normal;
  639. }
  640. #infscr-loading {
  641. position:absolute;
  642. bottom:0;
  643. width:200px;
  644. margin-left:50%;
  645. left:-105px;
  646. text-align:center;
  647. }
  648. #infscr-loading img{
  649. display:none;
  650. }
  651. /* A L E R T S */
  652. .alert, .dontshow{
  653. display:none;
  654. margin:0!important;
  655. padding:0!important;
  656. width:0!important;
  657. border:0!important;
  658. }
  659. .page1{
  660. display:block!important;
  661. margin:16px!important;
  662. width:250px!important;
  663. border:10px solid {color:Post Background}!important;
  664. {block:SearchPage}
  665. width:855px!important;
  666. text-align:center;
  667. margin:16px 16px 0 16px!important;
  668. {/block:SearchPage}
  669. {block:TagPage}
  670. width:858px!important;
  671. text-align:center;
  672. margin:16px 16px 0 16px!important;
  673. {/block:TagPage}
  674. }
  675. ul.blogroll {
  676. padding:0;
  677. text-align:center;
  678. }
  679. ul.blogroll li {
  680. display:inline-block;
  681. border-radius:15px;
  682. border:2px solid {color:Tab Text Colour 2};
  683. width:95px;
  684. height:95px;
  685. overflow:hidden;
  686. }
  687. #s-m-t-tooltip {
  688. max-width:300px;
  689. padding:5px;
  690. margin:20px 0px 0px 20px;
  691. background: {color:Tooltip Background};
  692. letter-spacing:0px;
  693. text-transform:uppercase;
  694. color:{color:Tooltip Text};
  695. opacity:1;
  696. z-index:999999999999999999;
  697. font-size:10px;
  698. vertical-align:middle;
  699. }
  700. .credit {
  701. background:{color:Border};
  702. width:14px;
  703. height:13px;
  704. color: #fff;
  705. position:fixed;
  706. bottom: 10px;
  707. left: 10px;
  708. line-height: 14px;
  709. font-size:12px;
  710. font-family: 'consolas';
  711. text-transform: uppercase;
  712. padding:3px 4px;
  713. overflow: hidden;
  714. z-index:999999999999999999;
  715. -webkit-transition: all 0.5s ease-in-out;
  716. -moz-transition: all 0.5s ease-in-out;
  717. -o-transition: all 0.5s ease-in-out;
  718. transition: all 0.5s ease-in-out;
  719. }
  720. .credit:hover {
  721. width:111px;
  722. background:#fff;
  723. color:#000;
  724. -webkit-transition: all 0.5s ease-in-out;
  725. -moz-transition: all 0.5s ease-in-out;
  726. -o-transition: all 0.5s ease-in-out;
  727. transition: all 0.5s ease-in-out;
  728. }
  729. .credit a {
  730. color:#000;
  731. text-decoration: none;
  732. }
  733. .credit .mine {
  734. opacity:0;
  735. visibility:hidden;
  736. -webkit-transition: all 0.5s ease-in-out 0.5s;
  737. -moz-transition: all 0.5s ease-in-out 0.5s;
  738. -o-transition: all 0.5s ease-in-out 0.5s;
  739. transition: all 0.5s ease-in-out 0.5s;
  740. }
  741. .credit:hover .mine {
  742. opacity: 1;
  743. visibility: visible;
  744. -webkit-transition: all 0.5s ease-in-out 0.5s;
  745. -moz-transition: all 0.5s ease-in-out 0.5s;
  746. -o-transition: all 0.5s ease-in-out 0.5s;
  747. transition: all 0.5s ease-in-out 0.5s;
  748. }
  749. .postheader {
  750. margin-top:16px;
  751. margin-bottom:0px;
  752. }
  753. input[type=text] {
  754. border:1px solid {color:Description Text};
  755. -webkit-border-radius: 5px;
  756. border-radius: 5px;
  757. width:88px;
  758. background:transparent;
  759. color:{color:Description Text};
  760. }
  761. input[type=text]:focus {outline:none;}
  762.  
  763. </style>
  764. </head>
  765. <body>
  766. <div id="bottombar"></div>
  767. <div class="icon"><img src="{image:Icon}"></div>
  768. <div class="describe">
  769. {Description}
  770. {block:IfSearchBar}<br><br>
  771. <form name="search" id="search" action="/search" method="get" style="margin: 0; padding: 0;">
  772. <i class="fa fa-search"></i>
  773. <input type="text" name="q" value="{SearchQuery}"/>
  774. <input type="submit" form="search" style="display:none;" />
  775. </form>{/block:IfSearchBar}
  776. {block:Pagination}
  777. <div class="pagination" {block:IfNotPagination}style="visibility:hidden;"{/block:IfNotPagination}>
  778. {block:PreviousPage}<a href="{PreviousPage}"><i class="fa fa-arrow-left"></i></a>{/block:PreviousPage}
  779. {block:NextPage}<a href="{NextPage}"><i class="fa fa-arrow-right"></i></a>{/block:NextPage}
  780. </div>
  781. {/block:Pagination}
  782. </div>
  783. <div id="navbar">
  784. <ul class="navlinks">
  785. <li><a href="/" title="refresh">{Title}</a></li> |
  786. {block:IfFaq}<li><a href="#" title="faq" class="changer" data-slidey="1"><i class="fa fa-question"></i></a></li> |{/block:IfFaq}
  787. <li><a href="#" title="mailbox" class="changer" data-slidey="5"><i class="fa fa-envelope"></i></a></li> |
  788. {block:IfLinksTab}
  789. <li><a href="#" title="links" class="changer" data-slidey="2"><i class="fa fa-link"></i></a></li> |
  790. {/block:IfLinksTab}
  791. {block:IfBlogroll}
  792. <li><a href="#" title="blogroll" class="changer" data-slidey="3"><i class="fa fa-th"></i></a></li> |
  793. {/block:IfBlogroll}
  794. {block:IfArchiveTab}
  795. <li><a href="#" title="archive" class="changer" data-slidey="4"><i class="fa fa-archive"></i></a></li> |
  796. {/block:IfArchiveTab}
  797. {block:IfNotArchiveTab}
  798. <li><a href="/archive" title="archive"><i class="fa fa-archive"></i></a></li> |
  799. {/block:IfNotArchiveTab}
  800. <li><a href="http://dontbrag.tumblr.com" title="credit" target="_blank"><i class="fa fa-copyright"></i></a></li>
  801.  
  802. </ul>
  803. </div>
  804. {block:IfFaq}
  805. <div class="slidey1">
  806. Faq:
  807. {text:Faq}
  808. </div>
  809. {/block:IfFaq}
  810. <div class="slidey5">
  811. <table>
  812. <tr>
  813. <td>Ask:
  814. <br><iframe class="ask" frameborder="0" width="100%" height="100%" id="ask_form" src="http://www.tumblr.com/ask_form/{name}.tumblr.com" seamless></iframe></td>
  815. <td>Submit:
  816. <br><iframe class="ask" frameborder="0" width="100%" height="100%" id="submit_form" src="http://www.tumblr.com/submit_form/{name}.tumblr.com" seamless></iframe></td>
  817. </tr>
  818. </table>
  819. </div>
  820. {block:IfLinksTab}
  821. <div class="slidey2">
  822. Links:
  823. <span style="font-size:30px;line-height:40px;">
  824. {block:IfLink1}
  825. <br>01. <a href="{text:Link1URL}">{text:Link1}</a>
  826. {/block:IfLink1}
  827. {block:IfLink2}
  828. <br>02. <a href="{text:Link2URL}">{text:Link2}</a>
  829. {/block:IfLink2}
  830. {block:IfLink3}
  831. <br>03. <a href="{text:Link3URL}">{text:Link3}</a>
  832. {/block:IfLink3}
  833. {block:IfLink4}
  834. <br>04. <a href="{text:Link4URL}">{text:Link4}</a>
  835. {/block:IfLink4}
  836. {block:IfLink5}
  837. <br>05. <a href="{text:Link5URL}">{text:Link5}</a>
  838. {/block:IfLink5}
  839. {block:IfLink6}
  840. <br>06. <a href="{text:Link6URL}">{text:Link6}</a>
  841. {/block:IfLink6}
  842. {block:IfLink7}
  843. <br>07. <a href="{text:Link5URL}">{text:Link7}</a>
  844. {/block:IfLink7}
  845. {block:IfLink8}
  846. <br>08. <a href="{text:Link6URL}">{text:Link8}</a>
  847. {/block:IfLink8}
  848. </span>
  849. </div>
  850. {/block:IfLinksTab}
  851. {block:IfBlogroll}
  852. <div class="slidey3">
  853. Blogroll:
  854. <br>{block:Following}
  855. <ul class="blogroll">
  856. {block:Followed} <li>
  857. <a href="{FollowedURL}" title="@{FollowedName}"><img src="{FollowedPortraitURL-96}"></a>
  858. </li>{/block:Followed}
  859. </ul>
  860. {/block:Following}
  861. </div>
  862. {/block:IfBlogroll}
  863. {block:IfArchiveTab}
  864. <div class="slidey4">
  865. <iframe frameborder="0" src="http://{name}.tumblr.com/archive" scrolling="yes" height="100%" width="100%" ></iframe>
  866. </div>
  867. {/block:IfArchiveTab}
  868. <div class="content">
  869. <div id="tumblrcontent">
  870.  
  871. {block:SearchPage}
  872. <article class="alert page{CurrentPage}">
  873. {SearchResultCount} search result(s) for "{SearchQuery}".
  874. </article>
  875. {/block:SearchPage}
  876.  
  877. {block:TagPage}
  878. <article class="alert page{CurrentPage} result">
  879. Showing posts tagged with "{Tag}".
  880. </article>
  881. {/block:TagPage}
  882.  
  883. {block:Posts}
  884. {block:PermalinkPage}
  885. <div class="detailios postheader">
  886. Posted on {DayOfWeek} the {DayOfMonth}{DayOfMonthSuffix} of {Month}, {Year} at {12Hour}:{Minutes}{AmPm} with {NoteCountWithLabel}.
  887. </div>
  888. {/block:PermalinkPage}
  889. <article class="{block:IndexPage}{TagsAsCLasses}{/block:IndexPage}">
  890. <!--Unique code for each post type-->
  891. {block:Text}
  892. <div class="text">
  893. {block:Title}<h1 class="post_title"><a href="{Permalink}">{Title}</a></h1>{/block:Title}
  894. {Body}
  895. </div>
  896. {/block:Text}
  897.  
  898. {block:Photo}<div class="photo">
  899. {block:IndexPage}
  900. <a href="{Permalink}"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" />
  901. </a>
  902. {/block:IndexPage}
  903. {block:PermalinkPage}<img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  904. {/block:PermalinkPage}</div>
  905. {/block:Photo}
  906.  
  907. {block:Photoset}
  908. <div class="photoset">
  909. <div class="photosetty">
  910. {block:IndexPage}
  911. {Photoset-250}
  912. {/block:IndexPage}</div>
  913. {block:TagPage}
  914. {Photoset-400}
  915. {/block:TagPage}
  916. {block:PermalinkPage}
  917. {Photoset-500}
  918. {/block:PermalinkPage}</div>
  919. {/block:Photoset}
  920.  
  921. {block:Quote}
  922. <div class="quote">
  923. <h1 class="post_title"><i>&ldquo;{Quote}&rdquo;</i></h1>
  924. {block:IndexPage}{block:Source}<p><cite>&mdash;&nbsp;{Source}</cite></p>{/block:Source}{/block:IndexPage}</div>
  925. {/block:Quote}
  926.  
  927. {block:Link}
  928. <div class="link">
  929. <h1 class="post_title"><a href="{URL}">{Name}</a></h1>
  930. {block:IndexPage}{block:Description}{Description}{/block:Description}{/block:IndexPage}</div>
  931. {/block:Link}
  932.  
  933. {block:Chat}
  934. <div class="chat inner">
  935. <ul>
  936. {block:Lines}<li class="{Alt}">{block:Label}
  937. <span class="label">{Label}</span>{/block:Label} {Line}
  938. </li>{/block:Lines}
  939. </ul></div>
  940. {/block:Chat}
  941.  
  942. {block:Audio}
  943. <div class="audio">
  944. {block:IndexPage}
  945. {block:AlbumArt}
  946. <div class="albumart">
  947. <a href="{Permalink}"><img src="{AlbumArtURL}"></a>
  948. </div>
  949. {/block:AlbumArt}
  950. {block:AudioPlayer}
  951. <div class="playbox">
  952. {AudioPlayerWhite}
  953. </div>
  954. {/block:AudioPlayer}
  955. <div class="audioinfo">
  956. Artist: <span{block:Artist} style="display:none;"
  957. {/block:Artist}>Unknown</span>
  958. {block:Artist}{Artist}{/block:Artist}</br>
  959. Title: <span{block:TrackName} style="display:none;"
  960. {/block:TrackName}>Unknown</span>
  961. {block:TrackName}{TrackName}{/block:TrackName}</br>
  962. Album: <span{block:Album} style="display:none;"
  963. {/block:Album}>Unknown</span>
  964. {block:Album}{Album}{/block:Album}{block:PlayCount}</br>
  965. Plays: {FormattedPlayCount}{/block:PlayCount}
  966. </div>
  967. {/block:IndexPage}
  968. {block:PermalinkPage}
  969. {block:AlbumArt}<img src="{AlbumArtURL}" width="500"
  970. height="500"/>{/block:AlbumArt}
  971. {block:AudioPlayer}
  972. {AudioPlayerWhite}
  973. {/block:AudioPlayer}
  974. {/block:PermalinkPage}</div>
  975. {/block:Audio}
  976.  
  977. {block:Video}
  978. <div class="video">
  979. {block:IndexPage}
  980. <div class="video-player">{Video-250}</div>
  981. {/block:IndexPage}
  982. {block:PermalinkPage}
  983. <div class="video-player">{Video-500}</div>
  984. {/block:permalinkPage}</div>
  985. {/block:Video}
  986.  
  987. {block:Answer}
  988. <div class="answer">
  989. <img class="asks" src="{block:IndexPage}{AskerPortraitURL-30}{/block:IndexPage}{block:PermalinkPage}{AskerPortraitURL-96}{/block:PermalinkPage}"><div class="question">{lang:Asker asked 2}: {Question}</div><hr style="visibility:hidden;width:100%;margin:0;">
  990. {block:Answerer}<img class="asks2" src="{block:IndexPage}{AnswererPortraitURL-30}{/block:IndexPage}{block:PermalinkPage}{AnswererPortraitURL-96}{/block:PermalinkPage}"><div class="question2">{Answerer} replied: {Answer}</div><br><hr style="visibility:hidden;">{/block:Answerer}
  991. {Replies}</div>
  992. {/block:Answer}
  993.  
  994. {block:indexpage}
  995. <!-- {block:NoRebloggedFrom}
  996. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  997. {/block:NoRebloggedFrom} -->
  998. {block:ContentSource}<!-- {SourceURL}
  999. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  1000. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1001. {/block:ContentSource}
  1002. {/block:IndexPage}
  1003.  
  1004. {block:IndexPage}
  1005. <div class="permalinks">
  1006. <a href="{Permalink}" title="{block:NotReblog}Posted {/block:NotReblog}{block:RebloggedFrom}Reblogged {block:RebloggedFrom}{TimeAgo}.">{NoteCount}</a>
  1007. <span class="other_permas">
  1008. {block:IfNotBlackPermalinks}
  1009. <li>{LikeButton color="white" size="14"}</li>
  1010. <li>{ReblogButton color="white" size="14"}</li>
  1011. {/block:IfNotBlackPermalinks}
  1012. {block:IfBlackPermalinks}
  1013. <li>{LikeButton color="black" size="14"}</li>
  1014. <li>{ReblogButton color="black" size="14"}</li>
  1015. {/block:IfBlackPermalinks}
  1016. </span>
  1017. </div>
  1018. {/block:IndexPage}
  1019. </article>
  1020. {block:PermalinkPage}
  1021. {block:Photo}
  1022. {block:Caption}<div class="detailios">{Caption}</div>{/block:Caption}
  1023. {/block:Photo}
  1024. {block:Photoset}
  1025. {block:Caption}<div class="detailios">{Caption}</div>{/block:Caption}
  1026. {/block:Photoset}
  1027. {block:Quote}
  1028. {block:Source}<div class="detailios"><cite style="font-style:normal;"> &mdash;&nbsp;{Source}</cite></div>{/block:Source}
  1029. {/block:Quote}
  1030. {block:Link}
  1031. {block:Description}<div class="detailios">{Description}</div>{/block:Description}
  1032. {/block:Link}
  1033. {block:Audio}
  1034. <div class="detailios">
  1035. Artist: <span{block:Artist} style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}<br>
  1036. Title: <span{block:TrackName} style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br>
  1037. Album: <span{block:Album} style="display:none;"{/block:Album}>Unknown</span>{block:Album}{Album}{/block:Album}{block:PlayCount}<br>
  1038. Plays: {FormattedPlayCount}{/block:PlayCount}</div>
  1039. {block:Caption}<div class="detailios">{Caption}</div>{/block:Caption}
  1040. {/block:Audio}
  1041. {block:Video}
  1042. <div class="detailios">{Caption}</div>{/block:Caption}
  1043. {/block:Video}
  1044. {block:HasTags}
  1045. <div id="tags" class="detailios">
  1046. filed under: {block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;{/block:Tags}
  1047. </div>{/block:HasTags}
  1048. {block:PostNotes}
  1049. <div id="notes" class="postnotes detailios">
  1050. {PostNotes}
  1051. </div>
  1052. {/block:PostNotes}
  1053. {/block:PermalinkPage}
  1054. {/block:Posts}
  1055.  
  1056. <!--Close of article-->
  1057. </div>
  1058. </div>
  1059. <div class="credit">
  1060. <i class="fa fa-diamond"></i>&nbsp;<a class="mine" target="_blank" href="http://dontbrag.tumblr.com">ByChloeThemes</a>
  1061. </div>
  1062. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"> </script>
  1063. <!--//////////Tooltips////////-->
  1064.  
  1065. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script> <script> (function($){ $(document).ready(function(){ $("[title],a[title],img[title]").style_my_tooltips({ tip_follows_cursor:true, tip_delay_time:100, tip_fade_speed:300, attribute:"title" }); }); })(jQuery); </script>
  1066. <!--//////////End Tooltips/////-->
  1067. <!--//////////Masonry////////////-->
  1068. <!--Links to jQuery library, Masonry, infinite scroll and imagesLoaded-->
  1069.  
  1070. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1071. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  1072. <script src="http://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
  1073. <!--Code for infinite scroll and grid layout-->
  1074. <script>
  1075. (function () {
  1076. var $tumblelog = $('#tumblrcontent');
  1077. $tumblelog.imagesLoaded(function () {
  1078. $tumblelog.masonry({
  1079. columnWidth: function (containerWidth) {
  1080. return containerWidth / 100;
  1081. }
  1082. });
  1083. });
  1084. {block:IfNotPagination}
  1085. $tumblelog.infinitescroll({
  1086. navSelector: ".pagination",
  1087. nextSelector: ".pagination a:last-child",
  1088. itemSelector: "article",
  1089. loading: {
  1090. finishedMsg: "<p>You've reached the end of the Earth.</p>",
  1091. img : "",
  1092. msg: null,
  1093. msgText: "<p><i class='fa fa-spinner fa-pulse fa-3x'></i></p>"
  1094. },
  1095. behavior: 'local',
  1096. binder: $('.content'), // scroll on this element rather than on the window
  1097. },
  1098. function (newElements) {
  1099. var $newElems = $(newElements).css({
  1100. opacity: 0
  1101. });
  1102. $newElems.imagesLoaded(function () {
  1103. $newElems.animate({
  1104. opacity: 1
  1105. });
  1106. $tumblelog.masonry('appended', $newElems);
  1107. });
  1108. });
  1109.  
  1110. {/block:IfNotPagination}
  1111. })();
  1112. </script>
  1113. <!--/////////End Masonry//////////-->
  1114. </body>
  1115. </html>
Advertisement
Add Comment
Please, Sign In to add comment