API tools faq
paste
jacktherph

theme 001: ubermain

jacktherph
Jan 9th, 2019
133
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 33.83 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <head>
  3.  
  4. <title>{Title}</title>
  5. {block:Description}<meta name="description" content="{MetaDescription}">{/block:Description}
  6. <link rel="shortcut icon" href="{Favicon}">
  7. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  8. <meta name="description" content="" />
  9. <meta http-equiv="x-dns-prefetch-control" content="off"/>
  10.  
  11. <!--------------------
  12.  
  13. THEME INFO & CREDITS
  14.  
  15.  
  16.  
  17.  
  18. pagination tutorial: themesbyeris
  19. blockquote tutorial: riverbellthemes
  20. reblog/like button tutorial: zcthemes
  21. ask stylization tutorial: excolo
  22. tumblr posts base code: sodapopcodes
  23. calendar html/css & major props: w3schools
  24. misc. help & motivation: cvmpbell
  25.  
  26.  
  27.  
  28. ---------------------->
  29.  
  30. <!--------------------META TAGS---------------------->
  31.  
  32. <meta name="image:Background" content=""/>
  33. <meta name="image:Header" content="https://imgur.com/nTdm5k2.png"/>
  34. <meta name="image:Plot1" content="https://imgur.com/anueKtA.png"/>
  35. <meta name="image:Plot2" content="https://imgur.com/anueKtA.png"/>
  36. <meta name="image:Plot3" content="https://imgur.com/anueKtA.png"/>
  37. <meta name="image:Prompt" content="https://imgur.com/d57isPh.png"/>
  38.  
  39. <meta name="color:Background" content="#e1e1e1"/>
  40. <meta name="color:PostBackground" content="#aaaaaa"/>
  41. <meta name="color:Font" content="#000000"/>
  42. <meta name="color:Italic" content="#39a44a"/>
  43. <meta name="color:Bold" content="#3fd258"/>
  44. <meta name="color:Highlight" content="#a2dbac"/>
  45. <meta name="color:Scrollbar" content="#39a44a"/>
  46. <meta name="color:Blockquote" content="#39a44a"/>
  47. <meta name="color:Links" content="#29aba3"/>
  48. <meta name="color:LinksHover" content="#a0dbd8"/>
  49.  
  50. <meta name="color:Title" content="#39bada"/>
  51. <meta name="color:SecondaryTitle" content="#7bc7da"/>
  52.  
  53. <meta name="color:NavigationBar" content="#39bada"/>
  54. <meta name="color:Header" content="#bbf2f7"/>
  55. <meta name="color:Sidebar" content="#bbf2f7"/>
  56. <meta name="color:SidebarText" content="#000000"/>
  57. <meta name="color:CalendarSection1" content="#e5eba2"/>
  58. <meta name="color:CalendarSection2" content="#ebd0a2"/>
  59. <meta name="color:CalendarSection3" content="#eba6a2"/>
  60.  
  61. <meta name="color:AskerBackground" content="#e0e0e0"/>
  62. <meta name="color:BottomBar" content="#e0e0e0"/>
  63. <meta name="color:ToolTipBackground" content="#a2dbac"/>
  64. <meta name="color:ToolTipFont" content="#39a44a"/>
  65.  
  66. <meta name="if:Show Link 1" content="1"/>
  67. <meta name="if:Show Link 2" content="1"/>
  68. <meta name="if:Show Link 3" content="1"/>
  69. <meta name="if:Show Link 4" content="1"/>
  70.  
  71. <meta name="if:Sidebar Links" content="1"/>
  72. <meta name="if:Admin Section" content="1"/>
  73. <meta name="if:Affiliate Section" content="1"/>
  74. <meta name="if:Stats Section" content="1"/>
  75. <meta name="if:Disclaimer Section" content="1"/>
  76. <meta name="if:Calendar" content="1"/>
  77. <meta name="if:Most Wanted Section" content="1"/>
  78. <meta name="if:Plots Section" content="1"/>
  79. <meta name="if:Prompt Section" content="1"/>
  80.  
  81. <meta name="text:Link1URL" content="/"/>
  82. <meta name="text:Link1" content="link1"/>
  83. <meta name="text:Link2URL" content="/"/>
  84. <meta name="text:Link2" content="link2"/>
  85. <meta name="text:Link3URL" content="/"/>
  86. <meta name="text:Link3" content="link3"/>
  87. <meta name="text:Link4URL" content="/"/>
  88. <meta name="text:Link4" content="link4"/>
  89.  
  90. <meta name="text:DescriptionTitle" content="Description Title"/>
  91.  
  92. <meta name="text:SidebarLinkTitle" content="Sidebar Link Title"/>
  93. <meta name="text:SidebarLink1URL" content="/"/>
  94. <meta name="text:SidebarLink1" content="link 1"/>
  95. <meta name="text:SidebarLink2URL" content="/"/>
  96. <meta name="text:SidebarLink2" content="link 2"/>
  97. <meta name="text:SidebarLink3URL" content="/"/>
  98. <meta name="text:SidebarLink3" content="link 3"/>
  99. <meta name="text:SidebarLink4URL" content="/"/>
  100. <meta name="text:SidebarLink4" content="link 4"/>
  101. <meta name="text:SidebarLink5URL" content="/"/>
  102. <meta name="text:SidebarLink5" content="link 5"/>
  103.  
  104. <meta name="text:AdminTitle" content="Admin Title"/>
  105. <meta name="text:AffiliatesTitle" content="Affiliates Title"/>
  106.  
  107. <meta name="text:StatsTitle" content="Stats Title"/>
  108. <meta name="text:Opened" content="opened"/>
  109. <meta name="text:Genre" content="genre"/>
  110. <meta name="text:Stats" content="stats"/>
  111. <meta name="text:Currently" content="currently"/>
  112.  
  113. <meta name="text:DisclaimerTitle" content="Disclaimer Title"/>
  114. <meta name="text:Disclaimer" content="disclaimer"/>
  115.  
  116. <meta name="text:CalendarMonth" content="month"/>
  117.  
  118. <meta name="text:StatsTitle" content="Stats Title"/>
  119.  
  120. <meta name="text:MostWantedTitle" content="Most Wanted Title"/>
  121.  
  122. <meta name="text:PlotsTitle" content="Plots Title"/>
  123. <meta name="text:Plot1Title" content="plot 1"/>
  124. <meta name="text:Plot1Date" content="plot 1 date"/>
  125. <meta name="text:Plot1Content" content="plot 1 content"/>
  126. <meta name="text:Plot2Title" content="plot 2"/>
  127. <meta name="text:Plot2Date" content="plot 2 date"/>
  128. <meta name="text:Plot2Content" content="plot 2 content"/>
  129. <meta name="text:Plot3Title" content="plot 3"/>
  130. <meta name="text:Plot3Date" content="plot 3 date"/>
  131. <meta name="text:Plot3Content" content="plot 3 content"/>
  132.  
  133. <meta name="text:PromptSecTitle" content="Prompt Title"/>
  134. <meta name="text:PromptTitle" content="Prompt Title"
  135. <meta name="text:PromptURL" content="/"/>
  136. <meta name="text:PromptContent" content="prompt content"/>
  137. <meta name="text:PromptFeatureURL" content="/"/>
  138.  
  139.  
  140.  
  141.  
  142.  
  143. <!--------------------YIKES---------------------->
  144.  
  145. <script type="text/javascript" src="https://static.tumblr.com/tiu5k68/xTkm8wqw2/tumblr-title-qtip.js"></script>
  146.  
  147.  
  148. <style type="text/css">
  149.  
  150. @font-face { font-family: "Angel"; src: url('https://dl.dropboxusercontent.com/s/9z3uorb6yvdxjd7/Angel.TTF'); format("truetype");}
  151. @font-face { font-family: "Exodus"; src: url('https://dl.dropboxusercontent.com/s/1ywg9xsi6zyevd5/Exodus-PersonalUse-Sharpen.otf'); format("truetype");}
  152. @font-face { font-family: "Crimson-Text"; src: url('https://dl.dropboxusercontent.com/s/p14ir6fbwreqzi4/Crimson-Roman.otf'); format("truetype");}
  153.  
  154. ::selection{
  155. background-color: {color:Highlight};
  156. color: {color:Highlight};
  157. }
  158. ::-moz-selection{
  159. background-color: {color:Highlight};
  160. color: {color:Highlight};
  161. }
  162.  
  163. /* SCROLLBAR */
  164.  
  165.  
  166. ::-webkit-scrollbar {
  167. width:5px;
  168. height:5px;
  169. background:#000;
  170. }
  171.  
  172.  
  173. ::-webkit-scrollbar-track {
  174. border:5px solid;
  175. background: transparent;
  176. }
  177.  
  178.  
  179. ::-webkit-scrollbar-thumb:vertical {
  180. background: {color:Scrollbar};
  181. min-height:20px;
  182. }
  183.  
  184.  
  185. ::-webkit-scrollbar-thumb:horizontal {
  186. background: {color: Scrollbar};
  187. min-height:20px;
  188. }
  189.  
  190. pre {
  191. white-space: pre-wrap;
  192. white-space: -moz-pre-wrap;
  193. white-space: -pre-wrap;
  194. white-space: -o-pre-wrap;
  195. word-wrap: break-word;
  196. }
  197.  
  198. /* TOOL TIP */
  199.  
  200. div#qTip {
  201. background: {color:ToolTipBackground};
  202. color: {color:ToolTipFont};
  203. border: 1px;
  204. border-style: solid;
  205. font-size: 10px;
  206. display: none;
  207. text-align: center;
  208. position: absolute;
  209. z-index: 99;
  210. letter-spacing: 1px;
  211. padding: 3px 4px;
  212. text-transform: uppercase;
  213.  
  214. }
  215.  
  216. /* ACTUAL SHIT */
  217.  
  218. body {
  219. font-size: 11px; /* font size */
  220. font-family: Calibri, Candara, Segoe; /* font */
  221. color: {color:Font}; /* font color */
  222. background-image: url({image:Background}); /* background image */
  223. background-color: {color:Background}; /* background color */
  224. background-size:cover;
  225. background-attachment:fixed;
  226. margin: 0px;
  227. }
  228.  
  229. a {
  230. color: {color:Links}; /* link color */
  231. text-decoration: none;
  232. -moz-transition-duration: 0.5s;
  233. -o-transition-duration: 0.5s;
  234. -webkit-transition-duration: 0.5s;
  235. transition-duration: 0.5s;
  236. }
  237.  
  238. a:hover {
  239. color: {color:LinksHover}; /* link hover color */
  240. -moz-transition-duration: 0.5s;
  241. -o-transition-duration: 0.5s;
  242. -webkit-transition-duration: 0.5s;
  243. transition-duration: 0.5s;
  244. }
  245.  
  246.  
  247. h1 {
  248. color: {color:Title};
  249. font-family: 'Exodus';
  250. font-size: 22px;
  251. border-bottom: 1px solid {color:Title};
  252. }
  253.  
  254. h2 {
  255. font-size: 17px;
  256. text-transform: uppercase;
  257. text-align: center;
  258. text-decoration: none;
  259. font-weight: 100;
  260. margin: auto;
  261. color: {color:SecondaryTitle};
  262. font-family: 'crimson-text';
  263. }
  264.  
  265. h3 {
  266. font-size: 17px;
  267. text-transform: uppercase;
  268. text-align: center;
  269. text-decoration: underline;
  270. font-weight: 100;
  271. margin: auto;
  272. color: {color:SecondaryTitle};
  273. font-family: 'crimson-text';
  274. }
  275.  
  276. ul {
  277. list-style-type: none;
  278. }
  279.  
  280. /* This is to change how text appears in different formats like bold, italic, headers etc */
  281. b {
  282. font-weight:800;
  283. color:{color:Bold};
  284. }
  285.  
  286. i {
  287. color:{color:Italic};
  288. }
  289.  
  290. small {
  291. font-size: 11px;
  292. }
  293.  
  294. big {
  295. font-size: 13px;
  296. }
  297.  
  298. blockquote {
  299. border-left: 1px {color:Blockquote} solid;
  300. padding-left: 5px;
  301. margin-left: 12px;
  302. max-width: 100%;
  303. }
  304.  
  305. blockquote blockquote {
  306. padding: 0 0 0 5px;
  307. margin: 0 0 0 12px;
  308. }
  309.  
  310. /* ----------------------NAVBAR INFO---------------------- */
  311.  
  312. #navbar { /* edit everything in here for the actual positioning of the links, and the more detailed stuff about each individual link is down below */
  313. width: 1200px; /* if changing the header size, adjust width here */
  314. margin: auto;
  315. overflow: hidden;
  316. z-index: 20;
  317. background-color: {color:NavigationBar};
  318. text-align: center;
  319. font-family: 'calibri';
  320. text-transform: uppercase;
  321. word-spacing: 100px;
  322. padding: 5px 0px 5px 0px; /* center position of the links */
  323. }
  324.  
  325. #navbar a {
  326. display: inline-block;
  327. color: {color:Links};
  328. text-decoration: none;
  329. font-size: 15px;
  330. }
  331.  
  332. #navbar a:hover {
  333. background-color: transparent;
  334. color: {color:LinksHover};
  335. }
  336.  
  337. #navbar a.active {
  338. background-color: transparent;
  339. color: white;
  340. }
  341.  
  342. .sticky {
  343. position: sticky;
  344. top: 0px;
  345. width: 1200px; /* correspong with navbar width */
  346. }
  347.  
  348. .sticky + .posts {
  349. padding-top: 0px;
  350. }
  351.  
  352. /* ----------------------HEADER INFO---------------------- */
  353.  
  354. #header {
  355. width: 1200px; /*change header size here */
  356. height: 350px;
  357. margin: auto;
  358. background-color: {color:Header};
  359. }
  360. #header img {
  361. display: block;
  362. width: 1200px; /*if changing header size, adjust here to correspond */
  363. height: 350px;
  364. margin: auto;
  365. }
  366.  
  367. /* ----------------------SIDEBAR1 INFO---------------------- */
  368.  
  369. #sidebar1 {
  370. width: 260px;
  371. height: auto;
  372. position: absolute;
  373. margin-left: 0px;
  374. background-color: {color:Sidebar};
  375. padding: 0px 10px 20px 10px;
  376. }
  377.  
  378. #s1description {
  379. position: relative;
  380. width: auto;
  381. height: auto;
  382. color: {color:SidebarText};
  383. }
  384. #s1description .title {
  385. position: relative;
  386. padding: 0px 0px 0px 0px;
  387. }
  388. #s1description .description {
  389. text-align: justify;
  390. padding: 0px 25px 0px 25px;
  391. }
  392.  
  393. #s1sidelinks {
  394. position: relative;
  395. color: {color:Links};
  396. padding: 1px 0px 0px 0px; /* gap between title and description content */
  397. }
  398. #s1sidelinks .title {
  399. position: relative;
  400. }
  401. #s1sidelinks .links {
  402. position: relative;
  403. font-family: 'calibri';
  404. margin: -10px 70px; /* length of dotted border */
  405. font-size: 14px;
  406. text-transform: uppercase;
  407. }
  408. #s1sidelinks ul {
  409. list-style-type: none;
  410. position: relative;
  411. margin: auto;
  412. text-align: center;
  413. padding: 0px 0px 0px 0px;
  414. }
  415. #s1sidelinks li {
  416. display: block;
  417. margin: auto;
  418. border-bottom: 1px dotted {color:Links};
  419. padding: 12px 0px 1px 0px;
  420.  
  421. }
  422.  
  423. #s1admins {
  424. position: relative;
  425. width: auto;
  426. height: auto;
  427. z-index: 13;
  428. padding: 10px 0px 0px 0px; /* gap between title and links content */
  429. }
  430. #s1admins .title {
  431. position: relative;
  432. }
  433. #s1admins .admins {
  434. position: relative;
  435. padding: 0px 25px 0px 25px; /* move position of images */
  436. }
  437. #s1admins .admins img {
  438. display: block;
  439. float: left;
  440. width: 50px; /*if changing admin size */
  441. height: 50px;
  442. margin: auto;
  443. padding: 0px 10px 0px 0px;
  444. }
  445.  
  446. #s1affiliates {
  447. position: relative;
  448. width: auto;
  449. height: auto;
  450. z-index: 12;
  451. padding: 55px 0px 0px 0px; /* gap between title and admins content */ /*FIND OUT WHY THIS IS 75 AND NOT 10 */
  452. }
  453. #s1affiliates .title {
  454. position: relative;
  455. }
  456. #s1affiliates .affiliates {
  457. position: relative;
  458. padding: 0px 0px 0px 25px; /* move position of images */
  459. }
  460. #s1affiliates .affiliates img {
  461. display: block;
  462. float: left;
  463. width: 40px; /*if changing affiliate size */
  464. height: 40px;
  465. margin: auto;
  466. padding: 0px 10px 0px 0px;
  467. }
  468.  
  469. #s1stats {
  470. position: relative;
  471. width: auto;
  472. height: auto;
  473. color: {color:SidebarText};
  474. padding: 45px 0px 0px 0px;
  475. }
  476. #s1stats .title {
  477. position: relative;
  478. }
  479. #s1stats .description {
  480. text-align: justify;
  481. padding: 0px 25px 0px 25px;
  482. }
  483.  
  484. #s1disclaimer {
  485. position: relative;
  486. width: auto;
  487. height: auto;
  488. color: {color:SidebarText};
  489. padding: 10px 0px 0px 0px;
  490. }
  491. #s1disclaimer .title {
  492. position: relative;
  493. }
  494. #s1disclaimer .description {
  495. text-align: justify;
  496. font-size: 9.5px;
  497. padding: 0px 25px 0px 25px;
  498. }
  499. /* ----------------------SIDEBAR2 INFO---------------------- */
  500.  
  501. #sidebar2 {
  502. width: 260px;
  503. height: auto;
  504. position: absolute;
  505. margin-left: 920px;
  506. background-color: {color:Sidebar};
  507. padding: 0px 10px 20px 10px;
  508. }
  509.  
  510. #s2calendar {
  511. position: relative;
  512. width: auto;
  513. height: auto;
  514. }
  515.  
  516. .month {
  517. width: 85%; /* center month name */
  518. background: transparent;
  519. text-align: center;
  520. }
  521.  
  522. .month ul li {
  523. color: white;
  524. font-size: 15px;
  525. text-transform: uppercase;
  526. font-family: 'crimson-text';
  527. letter-spacing: 3px;
  528. }
  529.  
  530. .weekdays {
  531. margin: 0px 20px; /* margin on weekdays shrink */
  532. padding: 0px 0px 5px;
  533. background-color: transparent;
  534. }
  535.  
  536. .weekdays li {
  537. display: inline-block;
  538. width: 13%;
  539. color: {color:SidebarText};
  540. text-align: center;
  541. }
  542.  
  543. .days {
  544. padding: 10px 0px;
  545. background: transparent;
  546. margin: 0px 20px; /* margin on days shrink */
  547. }
  548.  
  549. .days li {
  550. list-style-type: none;
  551. display: inline-block;
  552. width: 13%;
  553. text-align: center;
  554. margin-bottom: 10px;
  555. font-size: 12px;
  556. color: {color:SidebarText};
  557. }
  558.  
  559. /* Highlight different days */
  560. .days li .appday {
  561. padding: 3px;
  562. background: {color:CalendarSection1};
  563. color: #fff !important /*best to leave these white no matter the colour because of the background*/
  564. }
  565.  
  566. .days li .plotdrop {
  567. padding: 3px;
  568. background: {color:CalendarSection2};
  569. color: #fff !important /*best to leave these white no matter the colour because of the background*/
  570. }
  571.  
  572. .days li .event {
  573. padding: 3px 10px;
  574. margin: -2px;
  575. background: {color:CalendarSection3};
  576. color: #fff !important /*best to leave these white no matter the colour because of the background*/
  577. }
  578.  
  579. /* to have another section and colour, copy + paste and change the class to a new title. if you want to add the meta tags, add the corresponding meta above:
  580.  
  581. .days li .titlehere {
  582. padding: 3px 14px 3px 14px;
  583. background: #;
  584. color: #fff !important
  585. }
  586.  
  587. */
  588.  
  589. #s2mostwanted {
  590. position: relative;
  591. width: auto;
  592. height: auto;
  593. margin: -10px 0px;
  594. }
  595. #s2mostwanted .title {
  596. position: relative;
  597. }
  598. #s2mostwanted .content {
  599. position: relative;
  600. display: inline-block;
  601. padding: 0px 25px 0px 25px; /* move position of images */
  602. }
  603. #s2mostwanted .content img {
  604. display: block;
  605. float: left;
  606. width: 68px; /*if changing most wanted size */
  607. height: 100px;
  608. margin: auto;
  609. padding: 3px 2px 3px 0px;
  610. }
  611.  
  612. #s2plots {
  613. position: relative;
  614. width: auto;
  615. height: auto;
  616. padding: 15px 0px 10px 0px;
  617. }
  618. #s2plots .title {
  619. position: relative;
  620. }
  621. #s2plots .plots {
  622. position: relative;
  623. display: inline-block;
  624. color: {color:SidebarText};
  625. text-align: center;
  626. padding: 0px 0px;
  627. margin: auto;
  628. }
  629. #s2plots .plots img {
  630. display: block;
  631. width: 230px; /*if changing plots size */
  632. height: 125px;
  633. margin: auto;
  634. padding: 15px 15px 0px; /* move position of images */
  635. }
  636.  
  637. #s2prompt {
  638. position: relative;
  639. width: auto;
  640. height: auto;
  641. }
  642. #s2prompt .monthtitle {
  643. position: relative;
  644. font-size: 13px;
  645. text-transform: uppercase;
  646. }
  647. #s2prompt .prompts {
  648. position: relative;
  649. color: {color:SidebarText};
  650. text-align: justify;
  651. padding: 0px 25px 0px 25px;
  652. }
  653. #s2prompt .promptimage img {
  654. display: block;
  655. float: left;
  656. border-radius: 50%;
  657. background: transparent;
  658. width: 100px; /*if changing prompt size */
  659. height: 100px;
  660. margin: 0px 0px 0px -14px;
  661. padding: 10px;
  662. }
  663. #s2prompt .prompt {
  664. padding: 0px 0px 0px 0px;
  665. }
  666.  
  667. /* ----------------------CONTAINER INFO---------------------- */
  668.  
  669.  
  670. #container {
  671. width: 1200px;
  672. margin: auto;
  673. padding-top: 20px;
  674. }
  675.  
  676. #entries {
  677. width: 500px;
  678. padding: 20px 40px 20px 40px; /* move up down sides of container */
  679. height: auto; /* COME BACK LATER */
  680. margin: auto;
  681. display: block;
  682. background: transparent; /* you CAN include a colour, but i'd recommend against it */
  683. }
  684.  
  685. #post {
  686. width: 500px;
  687. margin: -20px 0px 40px 0px;
  688. padding: 5px 5px 0px;
  689. background: {color:PostBackground};
  690. }
  691. .postcontent {
  692. margin: 20px 30px 10px;
  693. }
  694. .postcontent blockquote {
  695. padding-left: 10px;
  696. }
  697.  
  698. .post p img, .post blockquote img {
  699. max-width: 100%;
  700. }
  701. /* ----------------------POST INFO---------------------- */
  702.  
  703. /* CHAT */
  704.  
  705. ul.chat{
  706. list-style:none;
  707. margin-left:-40px;
  708. }
  709.  
  710. .chat span {
  711. float: left;
  712. }
  713.  
  714. /* QUOTES */
  715.  
  716. .quote{
  717. font-size:20px;
  718. line-height:150%;
  719. text-align:center;
  720. }
  721.  
  722. .quotesource{
  723. text-align:right;
  724. margin-bottom:10px;
  725. }
  726.  
  727. /* QUESTIONS */
  728.  
  729. .askstyle {
  730. background: {color:AskerBackground};
  731. padding: 5px 1px;
  732. margin-bottom: 5px;
  733. }
  734.  
  735. .question{
  736. margin-bottom:15px;
  737. }
  738.  
  739. .answer {
  740. font-size:11px;
  741. }
  742.  
  743. .askerimg{
  744. position:relative;
  745. display:inline-block;
  746. margin-right:10px;
  747. }
  748.  
  749. /* AUDIO */
  750.  
  751. .songart{
  752. float:left;
  753. margin-right:10px;
  754. }
  755.  
  756. .songart img{
  757. width:80px;
  758. height:80px;
  759. }
  760.  
  761. .songtitle{
  762. margin-bottom:10px;
  763. margin-left:90px;
  764. }
  765.  
  766. .songauthor{
  767. margin-bottom:10px;
  768. font-size:8px;
  769. margin-left:90px;
  770. }
  771.  
  772. .tumblr_audio_player {
  773. height: 50px;
  774. }
  775.  
  776. /* ----------------------INTERNAL POST INFO---------------------- */
  777.  
  778. .postinfo{
  779. margin: 0px -5px 0px;
  780. padding: 2px 3px 5px;
  781. font-weight: bold;
  782. text-align: right;
  783. color:{color:Links};
  784. text-transform:uppercase;
  785. background-color: {color:BottomBar};
  786. }
  787.  
  788. .tags {
  789. margin-top:5px;
  790. font-weight:normal;
  791. text-align: right;
  792. color:{color:Links};
  793. font-size:9px;
  794. text-decoration: bold;
  795. letter-spacing: 1px;
  796. }
  797.  
  798.  
  799.  
  800. ol.notes {
  801. display:block;
  802. text-align: left;
  803. list-style-type:none;
  804. margin-left: -40px;
  805. margin-bottom: -25px;
  806. padding-bottom: 10px;
  807. }
  808.  
  809. ol.notes li.note{
  810. margin-bottom:5px;
  811. }
  812.  
  813. .pagenotes {
  814. text-align: right;
  815. margin-top:15px;
  816. }
  817.  
  818. .pagenotes img{
  819. padding-right:5px;
  820. padding-top:5px;
  821. margin-bottom:-5px;
  822. }
  823.  
  824. .likereblogbutton li {
  825. overflow: hidden;
  826. width: 13px;
  827. float: right;
  828. padding: 2px 0px 0px 0px;
  829. display: block;
  830. margin: 0px 2px 0px 2px;
  831. }
  832.  
  833. /* ----------------------PAGINATION INFO---------------------- */
  834.  
  835. #pagination {
  836. position: relative;
  837. width: 260px;
  838. font-size: 14px;
  839. margin: auto;
  840. padding: 20px 0px 0px 0px;
  841. text-align:center;
  842. background-color: transparent;
  843. color: {color:Links};
  844. }
  845.  
  846. /* ----------------------CREDIT INFO---------------------- */
  847.  
  848. /* DO NOT TOUCH! THANK YOU!!! */
  849.  
  850. #credit {
  851. position: fixed;
  852. padding-top: 3px;
  853. bottom: 5px;
  854. right: 5px;
  855. line-height: 90%;
  856. text-align: center;
  857. background-color: transparent;
  858. }
  859. #credit img {
  860. width: 27px;
  861. height: 27px;
  862. }
  863.  
  864. </style>
  865. </head>
  866.  
  867. <!-----------------------------HTML------------------------------>
  868.  
  869. <body>
  870.  
  871. <!---------HEADER & NAVBAR--------->
  872. <div id="header">
  873. <img src="{image:Header}">
  874. </div>
  875.  
  876. <div id="navbar">
  877. <a href="/">index</a>
  878. <a href="/ask">message</a>
  879. {block:IfShowLink1}<a href="{text:Link1URL}">{text:Link1}</a>{/block:IfShowLink1}
  880. {block:IfShowLink2}<a href="{text:Link2URL}">{text:Link2}</a>{/block:IfShowLink2}
  881. {block:IfShowLink3}<a href="{text:Link3URL}">{text:Link3}</a>{/block:IfShowLink3}
  882. {block:IfShowLink4}<a href="{text:Link4URL}">{text:Link4}</a>{/block:IfShowLink4}
  883. </div>
  884.  
  885.  
  886. <div id="container">
  887.  
  888. <!---------SIDEBAR ONE--------->
  889. <div id="sidebar1">
  890.  
  891. <!---------SIDEBAR ONE: DESCRIPTION--------->
  892.  
  893. <div id="s1description">
  894. <p><div class="title"><h1>{text:DescriptionTitle}</h1></div>
  895. <div class="description">
  896. <p>{Description}
  897. </div></div>
  898.  
  899. <!---------SIDEBAR ONE: SIDEBAR LINKS--------->
  900.  
  901. {block:IfSidebarLinks}
  902. <div id="s1sidelinks">
  903. <p><div class="title"><h1>{text:SidebarLinkTitle}</h1></div>
  904. <div class="links"><table>
  905. <ul>
  906. <li><a href="{text:SidebarLink1URL}" title="{text:SidebarLink1}">{text:SidebarLink1}</a></li>
  907. <li><a href="{text:SidebarLink2URL}" title="{text:SidebarLink2}">{text:SidebarLink2}</a></li>
  908. <li><a href="{text:SidebarLink3URL}" title="{text:SidebarLink3}">{text:SidebarLink3}</a></li>
  909. <li><a href="{text:SidebarLink4URL}" title="{text:SidebarLink4}">{text:SidebarLink4}</a></li>
  910. <li><a href="{text:SidebarLink5URL}" title="{text:SidebarLink5}">{text:SidebarLink5}</a></li>
  911. </ul>
  912. </table></div></div>
  913. {/block:IfSidebarLinks}
  914.  
  915. <!---------SIDEBAR ONE: ADMIN SECTION--------->
  916.  
  917. {block:IfAdminSection}
  918. <div id="s1admins">
  919. <p><div class="title"><h1>{text:AdminTitle}</h1></div>
  920. <div class="admins">
  921. <a href="/" title="admin1"><img src="https://imgur.com/44frVj4.png"></a>
  922. <a href="/" title="admin2"><img src="https://imgur.com/44frVj4.png"></a>
  923. </div></div>
  924. {/block:IfAdminSection}
  925.  
  926. <!---------SIDEBAR ONE: AFFILIATES--------->
  927.  
  928. {block:IfAffiliateSection}
  929. <div id="s1affiliates">
  930. <p><div class="title"><h1>{text:AffiliatesTitle}</h1></div>
  931. <div class="affiliates">
  932. <a href="/" title="affiliate1"><img src="https://imgur.com/aUAjWEQ.png"></a>
  933. <a href="/" title="affiliate2"><img src="https://imgur.com/aUAjWEQ.png"></a>
  934. <a href="/" title="affiliate3"><img src="https://imgur.com/aUAjWEQ.png"></a>
  935. <a href="/" title="affiliate4"><img src="https://imgur.com/aUAjWEQ.png"></a>
  936. </div></div>
  937. {/block:IfAffiliateSection}
  938.  
  939. <!---------SIDEBAR ONE: STATS--------->
  940.  
  941. {block:IfStatsSection}
  942. <div id="s1stats">
  943. <p><div class="title"><h1>{text:StatsTitle}</h1></div>
  944. <div class="description">
  945. <li><strong>Opened:</strong> {text:Opened}</li>
  946. <li><strong>Genre:</strong> {text:Genre}</li>
  947. <li><strong>Stats:</strong> {text:Stats}</li>
  948. <li><strong>Currently:</strong> {text:Currently}</li>
  949. <li><strong>Theme Credit:</strong> <a href="http://jacktherph.tumblr.com">jacktherph</a></li> <!--do not touch-->
  950. </div></div>
  951. {/block:IfStatsSection}
  952.  
  953. <!---------SIDEBAR ONE: DISCLAIMER--------->
  954.  
  955. {block:IfDisclaimerSection}
  956. <div id="s1disclaimer">
  957. <p><div class="title"><h1>{text:DisclaimerTitle}</h1></div>
  958. <div class="description">
  959. <p>{text:Disclaimer}
  960. </div></div>
  961. {block:IfDisclaimerSection}
  962.  
  963. <!---------PAGINATION--------->
  964. {block:Pagination}
  965. <div id="pagination">
  966. {block:PreviousPage}
  967. <a href="{PreviousPage}">Previous</a>
  968. {/block:PreviousPage}
  969.  
  970. {block:JumpPagination length="5"}
  971. {block:CurrentPage}
  972. <span class="current_page">{PageNumber}</span>
  973. {/block:CurrentPage}
  974.  
  975. {block:JumpPage}
  976. <a class="jump_page" href="{URL}">{PageNumber}</a>
  977. {/block:JumpPage}
  978. {/block:JumpPagination}
  979.  
  980. {block:NextPage}
  981. <a href="{NextPage}">Next</a>
  982. {/block:NextPage}
  983. </div>
  984. {/block:Pagination}
  985.  
  986. <!---------SIDEBAR ONE END--------->
  987. </div>
  988.  
  989.  
  990. <!---------SIDEBAR TWO--------->
  991. <div id="sidebar2">
  992.  
  993. <!---------SIDEBAR TWO: CALENDAR--------->
  994.  
  995. {block:IfCalendar}
  996. <div id="s2calendar">
  997. <p><div class="title"><h1>CALENDAR</h1></div>
  998. <div class="month">
  999. <ul><li>{text:CalendarMonth}</li></ul>
  1000. </div>
  1001.  
  1002. <ul class="weekdays">
  1003. <li>Mo</li>
  1004. <li>Tu</li>
  1005. <li>We</li>
  1006. <li>Th</li>
  1007. <li>Fr</li>
  1008. <li>Sa</li>
  1009. <li>Su</li>
  1010. </ul>
  1011.  
  1012. <ul class="days">
  1013. <li></li>
  1014. <li>01</li>
  1015. <li><a href="#" title="acceptance day"><span class="appday">02</span></li></a>
  1016. <li><a href="#" title="plot drop"><span class="plotdrop">03</span></li></a>
  1017. <li>04</li>
  1018. <li><a href="#" title="acceptance day"><span class="appday" title="acceptance day">05</span></li></a>
  1019. <li>06</li>
  1020. <li>07</li>
  1021. <li>08</li>
  1022. <li><a href="#" title="acceptance day"><span class="appday" title="acceptance day">09</span></li></a>
  1023. <li>10</li>
  1024. <li>11</li>
  1025. <li><a href="#" title="acceptance day"><span class="appday" title="acceptance day">12</span></li></a>
  1026. <li>13</li>
  1027. <li>14</li>
  1028. <li>15</li>
  1029. <li><a href="#" title="acceptance day"><span class="appday" title="acceptance day">16</span></li></a>
  1030. <li>17</li>
  1031. <li>18</li>
  1032. <li><a href="#" title="acceptance day"><span class="appday" title="acceptance day">19</span></li></a>
  1033. <li>20</li>
  1034. <li><a href="#" title="event"><span class="event">21</span></li></a>
  1035. <li><a href="#" title="event"><span class="event">22</span></li></a>
  1036. <li><a href="#" title="event"><span class="event">23</span></li></a>
  1037. <li><a href="#" title="event"><span class="event">24</span></li></a>
  1038. <li>25</li>
  1039. <li><a href="#" title="acceptance day"><span class="appday" title="acceptance day">26</span></li></a>
  1040. <li>27</li>
  1041. <li>28</li>
  1042. <li>29</li>
  1043. <li><a href="#" title="acceptance day"><span class="appday" title="acceptance day">30</span></li></a>
  1044. <li>31</li>
  1045. </ul>
  1046.  
  1047. </div>
  1048. {/block:IfCalendar}
  1049.  
  1050. <!---------SIDEBAR TWO: MOST WANTED--------->
  1051.  
  1052. {block:IfMostWantedSection}
  1053. <div id="s2mostwanted">
  1054. <p><div class="title"><h1>{text:MostWantedTitle}</h1></div>
  1055. <div class="content">
  1056. <a href="#" title="character1 here"><img src="https://imgur.com/EfWPe3p.png"></a>
  1057. <a href="#" title="character2 here"><img src="https://imgur.com/EfWPe3p.png"></a>
  1058. <a href="#" title="character3 here"><img src="https://imgur.com/EfWPe3p.png"></a>
  1059. <a href="#" title="character4 here"><img src="https://imgur.com/EfWPe3p.png"></a>
  1060. <a href="#" title="character5 here"><img src="https://imgur.com/EfWPe3p.png"></a>
  1061. <a href="#" title="character6 here"><img src="https://imgur.com/EfWPe3p.png"></a>
  1062. </div></div>
  1063. {/block:IfMostWantedSection}
  1064.  
  1065. <!---------SIDEBAR TWO: PLOT DROPS & EVENTS--------->
  1066.  
  1067. {block:IfPlotsSection}
  1068. <div id="s2plots">
  1069. <p><div class="title"><h1>{text:PlotsTitle}</h1></div>
  1070. <div class="plots">
  1071. <img src="{image:Plot1}">
  1072. <br><h3>{text:Plot1Title}</h3>
  1073. <br><i>{text:Plot1Date}</i>
  1074. <br>{text:Plot1Content}
  1075.  
  1076. <img src="{image:Plot2}">
  1077. <br><h3>{text:Plot2Title}</h3>
  1078. <br><i>{text:Plot2Date}</i>
  1079. <br>{text:Plot2Content}
  1080.  
  1081. <img src="{image:Plot3}">
  1082. <br><h3>{text:Plot3Title}</h3>
  1083. <br><i>{text:Plot3Date}</i>
  1084. <br>{text:Plot3Content}
  1085. </div></div>
  1086. {/block:IfPlotsSection}
  1087.  
  1088. <!---------SIDEBAR TWO: MONTHLY WRITING PROMPT--------->
  1089.  
  1090. {block:IfPromptSection}
  1091. <div id="s2prompt">
  1092. <p><div class="title"><h1>{text:PromptSecTitle}</h1></div>
  1093. <div class="prompts">
  1094. <div class="promptimage"><img src="{image:Prompt}"></div>
  1095. <div class="monthtitle"><a href="{text:PromptURL}">{text:PromptTitle}</a></div>
  1096. <div class="prompt"><p>{text:PromptContent}
  1097. <a href="{text:PromptFeatureURL}" title="read more">[CONT]</a>
  1098. </div>
  1099. </div></div>
  1100. {/block:IfPromptSection}
  1101.  
  1102. <!---------SIDEBAR TWO END--------->
  1103. </div>
  1104.  
  1105.  
  1106. <!---------CREDIT--------->
  1107.  
  1108. <div id="credit">
  1109. <a href="http://jacktherph.tumblr.com"><img src="https://imgur.com/Ri3Jm6O.png"></a>
  1110. </div>
  1111.  
  1112. <!--------------------------TUMBLR POST THINGS--------------------->
  1113.  
  1114. <div id="entries">
  1115. {block:Posts}
  1116. <div id="post">
  1117.  
  1118. {block:Text}
  1119. {block:Title}
  1120. <h1 class="title">
  1121. <a href="{Permalink}">{Title}</a></h1>
  1122. {/block:Title}
  1123. <div class="postcontent">
  1124. {Body}
  1125. </div>
  1126. {/block:Text}
  1127.  
  1128.  
  1129. <!--PHOTO POST-->
  1130. {block:Photo}
  1131. {block:IndexPage}
  1132. {LinkOpenTag}
  1133. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  1134. {LinkCloseTag}
  1135. {/block:IndexPage}
  1136. {block:PermalinkPage}
  1137. {LinkOpenTag}
  1138. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  1139. {LinkCloseTag}{/block:PermalinkPage}
  1140. {/block:Photo}
  1141.  
  1142.  
  1143. <!--PHOTOSET POST-->
  1144. {block:Photoset}
  1145. {block:IndexPage}{Photoset-500}{/block:IndexPage}
  1146. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  1147. {/block:Photoset}
  1148.  
  1149.  
  1150. <!--QUOTE POST-->
  1151. {block:Quote}
  1152. <div class="quote">❝{Quote}❞</div>
  1153. {block:Source}
  1154. <div class="quotesource">{Source}</div>
  1155. {/block:Source}
  1156. {/block:Quote}
  1157.  
  1158.  
  1159. <!--LINK POST-->
  1160. {block:Link}
  1161. <h1 class="title"><a href="{URL}">{Name}</a></h1>
  1162. {block:Description}
  1163. <div class="postcontent">{Description}</div>
  1164. {/block:Description}
  1165. {/block:Link}
  1166.  
  1167.  
  1168. <!--CHAT POST-->
  1169. {block:Chat}
  1170. <div class="postcontent">
  1171. <ul class="chat">
  1172. {block:Lines}<li class="{Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label}<p> {Line} </p></li>{/block:Lines}
  1173. </ul>
  1174. </div>
  1175. {/block:Chat}
  1176.  
  1177.  
  1178. <!--AUDIO POST-->
  1179. {block:Audio}
  1180. {block:AlbumArt}
  1181. <div class="songart">
  1182. <img src="{AlbumArtURL}">
  1183. </div>
  1184. {/block:AlbumArt}
  1185. <div class="songtitle">
  1186. {block:TrackName}
  1187. {TrackName}
  1188. {/block:TrackName}
  1189. </div>
  1190. <div class="songauthor">
  1191. By
  1192. {block:Artist}
  1193. {Artist}
  1194. {/block:Artist}
  1195. </div>
  1196. {AudioPlayerWhite}
  1197. {/block:Audio}
  1198.  
  1199.  
  1200. <!--VIDEO POST-->
  1201. {block:Video}
  1202. <div class="video">
  1203. <div class="video-player">{Video-500}</div>
  1204. {/block:Video}
  1205.  
  1206.  
  1207. <!--ANSWER POST-->
  1208. {block:Answer}
  1209. <div class="postcontent">
  1210. <div class="askstyle"><table>
  1211. <tr>
  1212. <td style="vertical-align:top;padding-right:10px;">
  1213. <img src="{AskerPortraitURL-24}">
  1214. </td>
  1215. <td style="vertical-align:top;">
  1216. <strong>{Asker} asked:</strong> {Question}
  1217. </td>
  1218. </tr>
  1219. </table></div>
  1220. {Answer}
  1221. </div>
  1222. {/block:Answer}
  1223.  
  1224. <!--CAPTIONS-->
  1225. {block:Caption}
  1226. <div class="postcontent">
  1227. {Caption}
  1228. </div>
  1229. {/block:Caption}
  1230.  
  1231. <!--POST INFORMATION-->
  1232. <div class="postinfo">
  1233.  
  1234. <!--PERMALINK-->
  1235. <a href="{Permalink}">
  1236. {block:Date}
  1237. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} {24Hour}.{Minutes} {AmPm}
  1238. {/block:Date}
  1239. </a>
  1240.  
  1241. <!--NOTES-->
  1242. {block:NoteCount}
  1243. <a href="{Permalink}"> + {NoteCount} </a>
  1244. {/block:NoteCount}
  1245.  
  1246. <!--VIA AND SOURCE-->
  1247. {block:RebloggedFrom}
  1248. ( <a href="{ReblogParentURL}">Via</a>
  1249. {/block:RebloggedFrom}
  1250. {block:ContentSource}
  1251. & <a href="{SourceURL}">Source</a>
  1252. {/block:ContentSource}
  1253. {block:RebloggedFrom} ){/block:RebloggedFrom}
  1254.  
  1255. <!--REBLOG AND LIKE BUTTONS-->
  1256. <div class="likereblogbutton">
  1257. <li>{ReblogButton size="13" color="white"}</li>
  1258. <li>{LikeButton size="13" color="white"}</li>
  1259. </div>
  1260.  
  1261. <!--TAGS-->
  1262. {block:HasTags}
  1263. <div class="tags">
  1264. {block:Tags}
  1265. <a href="{TagURL}">#{Tag}</a>
  1266. {/block:Tags}
  1267. </div>
  1268. {/block:HasTags}
  1269.  
  1270. </div>
  1271.  
  1272. <!--POST NOTES-->
  1273. {block:PostNotes}
  1274. <div class="pagenotes">{PostNotes-16}</div>
  1275. {/block:PostNotes}
  1276.  
  1277.  
  1278.  
  1279. </div>
  1280. {/block:Posts}
  1281. </div>
  1282.  
  1283. <!-----------------------------JAVA------------------------------>
  1284.  
  1285. <script>
  1286. window.onscroll = function() {myFunction()};
  1287.  
  1288. var navbar = document.getElementById("navbar");
  1289. var sticky = navbar.offsetTop;
  1290.  
  1291. function myFunction() {
  1292. if (window.pageYOffset >= sticky) {
  1293. navbar.classList.add("sticky")
  1294. } else {
  1295. navbar.classList.remove("sticky");
  1296. }
  1297. }
  1298. </script>
  1299.  
  1300. </body>
  1301. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!