Advertisement
extasisthemes

Solace

Sep 5th, 2017
681
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.47 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC>
  2.  
  3. <html>
  4.  
  5. <head>
  6.  
  7. <title>{Title}</title>
  8.  
  9. <link rel="shortcut icon" href="{Favicon}">
  10.  
  11. <meta name="color:Asker Background" content="#fcfcfc"/>
  12. <meta name="color:Background" content="#fffff"/>
  13. <meta name="color:Border" content="#eeeeee"/>
  14. <meta name="color:Credit Background" content="#ffffff"/>
  15. <meta name="color:Link" content="#000000"/>
  16. <meta name="color:Link Hover" content="#cfcfcf"/>
  17. <meta name="color:Main Color" content="#ccccdd"/>
  18. <meta name="color:Scrollbar" content="#000000"/>
  19. <meta name="color:Text" content="#555555"/>
  20. <meta name="color:Tooltip Background" content="#ffffff"/>
  21.  
  22. <meta name="image:Image" content="http://i.imgur.com/1DDW5rZ.jpg"/>
  23.  
  24. <meta name="text:Title" content="Solace"/>
  25.  
  26. <meta name="text:Subtitle" content="Lorem ipsum dolor sit amet."/>
  27.  
  28. <meta name="text:Link 1" content="/"/>
  29. <meta name="text:Link 1 Title" content="Link One"/>
  30. <meta name="text:Link 2" content="/"/>
  31. <meta name="text:Link 2 Title" content="Link Two"/>
  32. <meta name="text:Link 3" content="/"/>
  33. <meta name="text:Link 3 Title" content="Link Three"/>
  34. <meta name="text:Link 4" content="/"/>
  35. <meta name="text:Link 4 Title" content="Link Four"/>
  36. <meta name="text:Link 5" content="/"/>
  37. <meta name="text:Link 5 Title" content="Link Five"/>
  38. <meta name="text:Link 6" content="/"/>
  39. <meta name="text:Link 6 Title" content="Link Six"/>
  40.  
  41. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  42.  
  43. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  44.  
  45. <script>
  46. (function($){
  47. $(document).ready(function(){
  48. $("a[title]").style_my_tooltips({
  49. tip_follows_cursor:true,
  50. tip_delay_time:90,
  51. tip_fade_speed:600,
  52. attribute:"title"
  53. });
  54. });
  55. })(jQuery);
  56. </script>
  57.  
  58. <script type="text/javascript" src="https://pastebin.com/raw/0QibYDaZ"></script>
  59.  
  60. <script>
  61. $(document).ready(function(){
  62. $(".more-links").hide();
  63. $(".icon").click(function(){
  64. $(this).next(".more-links").slideToggle('fast');
  65. });
  66. });
  67. </script>
  68.  
  69. <script src="https://use.fontawesome.com/b01aac9904.js"></script>
  70.  
  71. <style type="text/css">
  72.  
  73. @import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,700,700i');
  74.  
  75. ::-webkit-scrollbar-thumb:vertical {
  76. background: {color:Scrollbar};
  77. }
  78.  
  79. ::-webkit-scrollbar {
  80. width: 3px;
  81. }
  82.  
  83. #s-m-t-tooltip {
  84. background: {color:Tooltip Background};
  85. border: 1px solid {color:Border};
  86. font-size: 10px;
  87. letter-spacing:0px;
  88. margin-top: 30px;
  89. padding: 5px;
  90. text-align: center;
  91. text-transform: uppercase;
  92. z-index: 999999999999999999999999999999999999;
  93. }
  94.  
  95. body {
  96. background: {color:Background};
  97. color: {color:Text};
  98. cursor: url(http://i.imgur.com/lhPqll6.png), progress;
  99. font-family: 'Source Sans Pro', sans-serif;
  100. font-size: 13px;
  101. font-style: normal;
  102. font-weight: 400;
  103. letter-spacing: 0px;
  104. margin: 0px;
  105. text-align: justify;
  106. text-transform: none;
  107. word-break: break-word;
  108. }
  109.  
  110. a {
  111. border-bottom: 1px solid {color:Border};
  112. color: {color:Link};
  113. text-decoration: none;
  114. -webkit-transition: all 0.5s ease;
  115. -moz-transition: all 0.5s ease;
  116. -o-transition: all 0.5s ease;
  117. }
  118.  
  119. a:hover {
  120. color: {color:Link Hover};
  121. }
  122.  
  123. h1 {
  124. font-size: 14px;
  125. }
  126.  
  127. blockquote {
  128. border-left: 1px solid {color:Border};
  129. margin: 5px;
  130. padding-left: 5px;
  131. }
  132.  
  133. blockquote img {
  134. height: auto;
  135. max-width: 300px;
  136. }
  137.  
  138. blockquote blockquote {
  139. border-left: 1px solid {color:Border};
  140. padding-left: 5px;
  141. }
  142.  
  143. #left {
  144. border-left: 1px solid {color:Border};
  145. height: 100%;
  146. right: 0px;
  147. top: 0px;
  148. position: fixed;
  149. width: 401px;
  150. }
  151.  
  152. #sidebar {
  153. background-image: url("{image:Image}");
  154. background-position: top;
  155. background-repeat: no-repeat;
  156. background-size: cover;
  157. height: 55%;
  158. right: 100px;
  159. position: absolute;
  160. top: 22.5%;
  161. width: 200px;
  162. }
  163.  
  164. .icon {
  165. background: {color:Tooltip Background};
  166. margin-left: 10px;
  167. padding: 10px;
  168. position:fixed;
  169. margin-top: 10px;
  170. }
  171.  
  172. .more-links {
  173. background: {color:Tooltip Background};
  174. margin-left: 10px;
  175. margin-top: 53px;
  176. padding: 10px;
  177. width: 160px;
  178. }
  179.  
  180. .more-links a {
  181. display: block;
  182. padding-bottom: 10px;
  183. padding-top: 10px;
  184. }
  185.  
  186. #right {
  187. right: 401px;
  188. width: calc(100% - 401px);
  189. }
  190.  
  191. #container1 {
  192. border-bottom: 1px solid {color:Border};
  193. padding-bottom: 100px;
  194. width: 100%;
  195. }
  196.  
  197. #user-information {
  198. margin-left: auto;
  199. margin-right: auto;
  200. margin-top: 100px;
  201. width: 442px;
  202. }
  203.  
  204. .title {
  205. color: {color:Main Color};
  206. text-transform: uppercase;
  207. }
  208.  
  209. .subtitle {
  210. text-transform: none;
  211. }
  212.  
  213. .description {
  214. margin-top: 20px;
  215. }
  216.  
  217. .links {
  218. font-size: 10px;
  219. margin-top: 20px;
  220. text-transform: uppercase;
  221. }
  222.  
  223. .links a {
  224. background: {color:Main Color};
  225. border-bottom: none;
  226. border-radius: 3px;
  227. color: {color:Tooltip Background};
  228. display: inline-block;
  229. margin-right: 10px;
  230. padding: 3px;
  231. }
  232.  
  233. .links a:hover {
  234. color: {color:Link Hover};
  235. }
  236.  
  237. #container2 {
  238. margin-left: auto;
  239. margin-right: auto;
  240. width: 442px;
  241. }
  242.  
  243. #posts {
  244. margin-bottom: 100px;
  245. margin-top: 100px;
  246. width: 442px;
  247. }
  248.  
  249. .entries {
  250. border: 1px solid {color:Border};
  251. border-radius: 3px;
  252. margin-bottom: 50px;
  253. padding: 20px;
  254. width: 400px;
  255. }
  256.  
  257. .caption {
  258. font-style: italic;
  259. margin-top: 5px;
  260. text-align: left;
  261. }
  262.  
  263. .ask {
  264. text-align: justify;
  265. }
  266.  
  267. .asker {
  268. background: {color:Asker Background};
  269. font-size: 12px;
  270. padding: 10px;
  271. text-transform: uppercase;
  272. }
  273.  
  274. .asker a {
  275. border-bottom: none;
  276. padding: 0px;
  277. }
  278.  
  279. .question {
  280. border-bottom: 1px solid {color:Border};
  281. margin-bottom: 30px;
  282. padding-bottom: 10px;
  283. padding-top: 10px;
  284. }
  285.  
  286. .quote, .website a {
  287. font-size: 16px;
  288. text-align: left;
  289. }
  290.  
  291. .chat {
  292. text-align: left;
  293. }
  294.  
  295. .audio {
  296. width: 400px;
  297. }
  298.  
  299. .player-container {
  300. margin-left: 17px;
  301. margin-top: 17px;
  302. position: absolute;
  303. width: 34px;
  304. }
  305.  
  306. .player {
  307. margin-left: -3px;
  308. overflow: hidden;
  309. padding: 5px;
  310. position: relative;
  311. }
  312.  
  313. .audio-information {
  314. font-size: 12px;
  315. padding: 12.5px;
  316. margin-left: 70px;
  317. margin-top: -70px;
  318. text-transform: uppercase;
  319. width: 305px;
  320. }
  321.  
  322. .entries-information {
  323. border-top: 1px solid {color:Border};
  324. font-size: 12px;
  325. margin-top: 20px;
  326. padding-top: 20px;
  327. text-transform: uppercase;
  328. }
  329.  
  330. .notes {
  331. text-align: left;
  332. }
  333.  
  334. .notes img {
  335. display: none;
  336. }
  337.  
  338. .pagination {
  339. font-size: 12px;
  340. text-transform: uppercase;
  341. }
  342.  
  343. #credit {
  344. background: {color:Credit Background};
  345. border: 1px solid {color:Border};
  346. bottom: 15px;
  347. float: right;
  348. font-size: 10px;
  349. padding: 5px;
  350. position: fixed;
  351. right: 15px;
  352. text-align: center;
  353. text-transform: uppercase;
  354. -webkit-transition: all 0.5s ease;
  355. -moz-transition: all 0.5s ease;
  356. -o-transition: all 0.5s ease;
  357. }
  358.  
  359. #credit a {
  360. border-bottom: none;
  361. color: {color:Link};
  362. }
  363.  
  364. #credit a:hover {
  365. color: {color:Link Hover};
  366. }
  367.  
  368. {CustomCSS}
  369.  
  370. </style>
  371.  
  372. </head>
  373.  
  374. <body>
  375.  
  376. <div id="left">
  377.  
  378. <div id="sidebar">
  379.  
  380. <p class="icon"><i class="fa fa-bars" aria-hidden="true"></i></p>
  381.  
  382. <div class="more-links">
  383. {block:ifLink3}<a href="{text:Link 3}">{text:Link 3 Title}</a>{/block:ifLink3}
  384. {block:ifLink4}<a href="{text:Link 4}">{text:Link 4 Title}</a>{/block:ifLink4}
  385. {block:ifLink5}<a href="{text:Link 5}">{text:Link 5 Title}</a>{/block:ifLink5}
  386. {block:ifLink6}<a href="{text:Link 6}">{text:Link 6 Title}</a>{/block:ifLink6}
  387. <a href="/archive" style="border-bottom:none;">Archive</a>
  388. </div>
  389.  
  390. </div>
  391.  
  392. </div>
  393.  
  394. <div id="right">
  395.  
  396. <div id="container1">
  397.  
  398. <div id="user-information">
  399.  
  400. <div class="title">{text:Title}</div>
  401.  
  402. <div class="subtitle">{text:Subtitle}</div>
  403.  
  404. {block:Description}<div class="description">{Description}</div>{/block:Description}
  405.  
  406. <div class="links">
  407. <a href="/">Home</a>
  408. <a href="/ask">Ask</a>
  409. {block:ifLink1}<a href="{text:Link 1}">{text:Link 1 Title}</a>{/block:ifLink1}
  410. {block:ifLink2}<a href="{text:Link 2}">{text:Link 2 Title}</a>{/block:ifLink2}
  411. <a href="/archive">Archive</a>
  412. </div>
  413.  
  414. </div>
  415.  
  416. </div>
  417.  
  418. <div id="container2">
  419.  
  420. <div id="posts">
  421.  
  422. {block:Posts}
  423.  
  424. <div class="entries">
  425.  
  426. {block:Answer}
  427. <div class="ask">
  428. <div class="asker">
  429. <a href="{AskerURL}">{Asker}</a> left a message: {Question}
  430. </div>
  431. {Answer}
  432. </p>
  433. </div>
  434. {/block:Answer}
  435.  
  436. {block:Quote}
  437. <div class="quote">
  438. "{Quote}</i>" {block:Source}— {Source}{/block:Source}
  439. </div>
  440. {/block:Quote}
  441.  
  442. {block:Link}
  443. <div class="website"><a href="{URL}">{Name}</a></div>
  444. {block:Description}
  445. {Description}
  446. {/block:Description}
  447. {/block:Link}
  448.  
  449. {block:Chat}
  450. <div class="chat">
  451. {block:Title}
  452. <h1>{Title}</h1>
  453. {/block:Title}
  454. {block:Lines}
  455. {block:Label}<u>{Label}</u>{/block:Label}
  456. {Line}
  457. <br>
  458. {/block:Lines}
  459. </div>
  460. {/block:Chat}
  461.  
  462. {block:Text}
  463. {block:Title}
  464. <h1>{Title}</h1>
  465. {/block:Title}
  466. {Body}
  467. {/block:Text}
  468.  
  469. {block:Audio}
  470. <div class="audio">
  471. <div class="player-container">
  472. <div class="player">
  473. {block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}
  474. </div>
  475. </div>
  476. {block:AlbumArt}
  477. <img src="{AlbumArtURL}" height="70" width="70">
  478. {/block:AlbumArt}
  479.  
  480. <div class="audio-information">
  481. {block:TrackName}
  482. <b>Title:</b> {TrackName} <br>
  483. {/block:TrackName}
  484. {block:Artist}
  485. <b>Artist:</b> {Artis} <br>
  486. {/block:Artist}
  487. {block:Album}
  488. <b>Album:</b> {Album}
  489. {/block:Album}
  490. </div>
  491. {block:Caption}
  492. <div class="caption">{Caption}</div>
  493. {/block:Caption}
  494. </div>
  495. {/block:Audio}
  496.  
  497. {block:Photo}
  498. <img src="{PhotoURL-400}"/>
  499. {block:Caption}
  500. <div class="caption">{Caption}</div>
  501. {/block:Caption}
  502. {/block:Photo}
  503.  
  504. {block:Photoset}
  505. {Photoset}
  506. {block:Caption}
  507. <div class="caption">{Caption}</div>
  508. {/block:Caption}
  509. {/block:Photoset}
  510.  
  511. {block:Video}
  512. {Video-400}
  513. {block:Caption}
  514. <div class="caption">{Caption}</div>
  515. {/block:Caption}
  516. {/block:Video}
  517.  
  518. {block:Date}
  519. <div class="entries-information">
  520. {Month} {DayOfMonth}, {Year}
  521. <font style="margin-left:10px;">
  522. <a href="{Permalink}">{NoteCount}</a> notes
  523. </font>
  524. <font style="float:right;">
  525. <a href="{ReblogParentURL}">Via</a> /
  526. {block:ContentSource}
  527. <a href="{SourceURL}">Source</a> /
  528. {/block:ContentSource}
  529. <a href="{ReblogURL}" target="_blank">Reblog</a>
  530. </font>
  531. <br>
  532. {block:HasTags}
  533. {block:Tags}
  534. <a href="{TagURL}">#{Tag}</a>
  535. {/block:Tags}
  536. {/block:HasTags}
  537. {block:PostNotes}
  538. <div class="notes">{PostNotes}</div>
  539. {/block:PostNotes}
  540. </div>
  541. {/block:Date}
  542.  
  543. </div>
  544.  
  545. {/block:Posts}
  546.  
  547. {block:IndexPage}
  548. <div class="pagination">
  549. {CurrentPage} out of {TotalPages}
  550. <font style="float:right;">
  551. {block:PreviousPage}
  552. <a href="{PreviousPage}">previous</a> /
  553. {/block:PreviousPage}
  554. {block:NextPage}
  555. <a href="{NextPage}">next</a>
  556. {/block:NextPage}
  557. </font>
  558. </div>
  559. {/block:IndexPage}
  560.  
  561. </div>
  562.  
  563. </div>
  564.  
  565. <div id="credit">
  566. <a href="http://extasisthemes.tumblr.com/">ET</a>
  567. </div>
  568.  
  569. </body>
  570.  
  571. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement