API tools faq
paste
Advertisement
Amanduhh7

Theme 001

Amanduhh7
Jun 8th, 2016
239
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.70 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <head>
  3. <title>{Title}</title>
  4. <link rel="shortcut icon" href="{Favicon}">
  5. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  6. <meta name="description" content="" />
  7. <meta http-equiv="x-dns-prefetch-control" content="off"/>
  8.  
  9.  
  10. <!--DO NOT REMOVE CREDIT IN THEME-->
  11. <!--CREDIT TO SLAPDASHTHEMES-->
  12. <!--DO NOT REMOVE CREDIT IN THEME-->
  13.  
  14. <!--DO NOT USE AS BASE CODE-->
  15.  
  16. <!--popup box basecode at webdesignerdepot.com // redesigned by slapdashthemes-->
  17.  
  18. <meta name="color:titlebox" content="#f58f8d"/>
  19. <meta name="color:navigation" content="#bfbfbf"/>
  20. <meta name="color:postlink" content="#f58f8d"/>
  21. <meta name="color:tags" content="#f58f8d"/>
  22. <meta name="color:popupboxicon" content="#f58f8d"/>
  23. <meta name="color:popupboxtitles" content="#f58f8d"/>
  24. <meta name="color:popupboxnav" content="#f58f8d"/>
  25.  
  26. <meta name="image:sidebar" content=""/>
  27.  
  28. <meta name="text:link one URL" content=""/>
  29. <meta name="text:link one title" content="link"/>
  30. <meta name="text:link two URL" content=""/>
  31. <meta name="text:link two title" content="link"/>
  32.  
  33. <link href='https://fonts.googleapis.com/css?family=Fjalla+One' rel='stylesheet' type='text/css'>
  34.  
  35.  
  36.  
  37. <style type="text/css">
  38.  
  39. /*CSS GOES HERE*/
  40.  
  41. /*GOBAL*/
  42.  
  43. #body{
  44. background-color:#fff;
  45. color:#555;
  46. font-size:11px;
  47. font-family:Arial, Calibri, sans-serif;
  48. }
  49.  
  50. a{
  51. color:#000;
  52. text-decoration:none;
  53. -moz-transition-duration:0.5s;
  54. -o-transition-duration:0.5s;
  55. -webkit-transition-duration:0.5s;
  56. transition-duration:0.5s;
  57. }
  58.  
  59. a:hover{
  60. color:#eee;
  61. -moz-transition-duration:0.5s;
  62. -o-transition-duration:0.5s;
  63. -webkit-transition-duration:0.5s;
  64. transition-duration:0.5s;
  65. }
  66.  
  67. .container{
  68. width:800px;
  69. margin:auto;
  70. }
  71.  
  72. .sidebar{
  73. width:250px;
  74. height:auto;
  75. background:transparent;
  76. position:fixed;
  77. top:100px;
  78. left:300px;
  79. border-bottom:3px solid #ddd;
  80. padding-bottom:5px;
  81. float:left;
  82. }
  83.  
  84. .titlebox{
  85. width:250px;
  86. background-color:#eaeaea;
  87. padding-top:4px;
  88. padding-bottom:4px;
  89. margin-top:10px;
  90. margin-bottom:5px;
  91. text-align:center;
  92. color:{color:titlebox};
  93. text-transform:uppercase;
  94. font-family: 'Fjalla One', sans-serif;
  95. }
  96.  
  97. .titlebox a{
  98. color:{color:titlebox};
  99. }
  100.  
  101. .sidebar img{
  102. width:250px;
  103. }
  104.  
  105. .description{
  106. font-size:12px;
  107. padding-top:5px;
  108. color:#bfbfbf;
  109. }
  110.  
  111. .navigation{
  112. margin-left:-40px;
  113. }
  114.  
  115. .navigation ul{
  116. list-style-type:none;
  117. }
  118.  
  119. .navigation ul li{
  120. display:block;
  121. padding:2px;
  122. border-bottom:1px solid #eaeaea;
  123. }
  124.  
  125. .navigation ul li a{
  126. color:{color:navigation};
  127. font-size:12px;
  128. font-family: 'Fjalla One', sans-serif;
  129. }
  130.  
  131. .sidebar p{
  132. font-size:12px;
  133. font-family: 'Fjalla One', sans-serif;
  134. color:#bfbfbf;
  135. }
  136.  
  137. .sidebar p span{
  138. color:#f58f8d;
  139. }
  140.  
  141. .postscon{
  142. position:absolute;
  143. width:600px;
  144. margin-left:300px;
  145. margin-top:100px;
  146. float:right;
  147. }
  148.  
  149. .posts{
  150. width:500px;
  151. margin-bottom:20px;
  152. padding:10px;
  153. border:1px solid #eaeaea;
  154. }
  155.  
  156. h1{
  157. text-align:center;
  158. text-transform:uppercase;
  159. font-family: 'Fjalla One', sans-serif;
  160. font-size:20px;
  161. color:#bfbfbf;
  162. }
  163.  
  164. .posts li{
  165. list-style:disc;
  166. color{color:postlink};
  167. }
  168.  
  169. .posts blockquote{
  170. border-left:1px solid #555;
  171. padding-left:10px;
  172. }
  173.  
  174. .posts p{
  175. font-size:14px;
  176. font-family: 'Fjalla One', sans-serif;
  177. font-weight:normal;
  178. color:#bfbfbf;
  179. }
  180.  
  181. .posts p a{
  182. color:{color:postlink};
  183. }
  184.  
  185. .question{
  186. font-weight:bold;
  187. border-bottom:1px solid #ccc;
  188. padding-bottom:5px;
  189. text-align:center;
  190. }
  191.  
  192. .answer{
  193. text-align:left;
  194. }
  195.  
  196. h2{
  197. text-align:center;
  198. font-family: 'Fjalla One', sans-serif;
  199. font-size:17px;
  200. font-weight:normal;
  201. }
  202.  
  203. .source{
  204. text-align:center;
  205. font-style:italic;
  206. font-family: 'Fjalla One', sans-serif;
  207. font-size:12px;
  208. }
  209.  
  210. .chat{
  211. list-style:none;
  212. line-height:120%;
  213. font-size:15px;
  214. }
  215.  
  216. .line{
  217. border-bottom:1px solid #ddd;
  218. padding-bottom:3px;
  219. font-family: 'Fjalla One', sans-serif;
  220. }
  221.  
  222. .label{
  223. text-transform:uppercase;
  224. padding-right:5px;
  225. font-weight:bold;
  226. font-family: 'Fjalla One', sans-serif;
  227. font-size:12px;
  228. }
  229.  
  230. .linkpost_link a{
  231. font-family: 'Fjalla One', sans-serif;
  232. color:#f58f8d;
  233. }
  234.  
  235. #info{
  236. width:500px;
  237. background-color:#efefef;
  238. text-align:center;
  239. line-height:200%;
  240. font-size:12px;
  241. }
  242.  
  243. #info a{
  244. text-decoration:none;
  245. color:#000000;
  246. font-size:12px;
  247. font-family: 'Fjalla One', sans-serif;
  248.  
  249. }
  250.  
  251. .date{
  252. float:left;
  253. }
  254. .date a{
  255. text-decoration:none;
  256. color:black;
  257. font-size:9px;
  258. }
  259.  
  260. .reblog{
  261. float:right;
  262. font-size:9px;
  263. }
  264.  
  265. .tpages {
  266. width:600px;
  267. border:1px solid;
  268. border-color:{color:post borders};
  269. padding:0px;
  270. margin-top:75px;
  271. margin-bottom:-35px;
  272. font-family: 'Fjalla One', sans-serif;
  273. letter-spacing:1px;
  274. word-spacing:1px;
  275. text-align:center;
  276. font-size:10px;
  277. font-weight:bold;
  278. text-transform:lowercase;
  279. color:{color:text};
  280. background:{color:post bg};
  281. word-wrap: break-word;}
  282.  
  283.  
  284. #tags {
  285. width:600px;
  286. word-wrap:break-word;
  287. font-family: 'Fjalla One', sans-serif;
  288. text-transform:lowercase;
  289. text-align:left;
  290. font-size:10px;
  291. line-height:22px;
  292. letter-spacing:1px;
  293. padding-top:7px;
  294. color:{color:tags};
  295. -webkit-transition: opacity 0.5s linear;
  296. -webkit-transition: all 0.5s ease-in-out;
  297. -moz-transition: all 0.5s ease-in-out;
  298. -o-transition: all 0.5s ease-in-out; }
  299.  
  300. #tags a{
  301. color:{color:tags};}
  302.  
  303. #tags a:hover{
  304. color:{color:tags};}
  305.  
  306. ol.notes{padding:0px;margin 0px 0px;list-style-type:none;font-size:11px; width:400px;}
  307.  
  308. ol.notes li.note{border-bottom:1px dotted #cccccc;padding:0px;font-size:11px; display:block; width:400px; margin-bottom:-50px;}
  309.  
  310. ol.notes li.note img{padding:2px !important;}
  311.  
  312. ol.notes li.note img.avatar{vertical-align:-2px;margin-right:5px;width:16px;height:16px;}
  313.  
  314. ol.notes li.note a img.avatar{padding:0px;border-width:0 px;border:none;}
  315.  
  316. ol.notes li.note img{padding:0px;border-width:0 px;border:none;}
  317.  
  318. ol.notes li.note span.action{font-weight:bold;}
  319.  
  320. ol.notes li.note.answer_content{font-weight:normal;}
  321.  
  322. ol.notes li.note.blockquote{padding:1px 1px;margin:1px 0px 0px 1px;}
  323.  
  324. ol.notes li.note.blockquote a{text-decoration:none;}
  325.  
  326.  
  327.  
  328.  
  329. .modalDialog {
  330. position: fixed;
  331. font-family: Arial, Helvetica, sans-serif;
  332. top: -50px;
  333. right: 0;
  334. bottom: 0;
  335. left: 0;
  336. background: rgba(0,0,0,0.8);
  337. z-index: 99999;
  338. opacity:0;
  339. -webkit-transition: opacity 400ms ease-in;
  340. -moz-transition: opacity 400ms ease-in;
  341. transition: opacity 400ms ease-in;
  342. pointer-events: none;
  343. font-family: 'Fjalla One', sans-serif;
  344. color:#bfbfbf;
  345. }
  346.  
  347. .modalDialog:target {
  348. opacity:1;
  349. pointer-events: auto;
  350. }
  351.  
  352. .modalDialog > div {
  353. width: 800px;
  354. height:700px;
  355. position: relative;
  356. margin: 10% auto;
  357. padding: 5px 20px 13px 20px;
  358. border-radius: 10px;
  359. background-color:#ffffff;
  360. }
  361.  
  362. .close {
  363. background: #606061;
  364. color: #FFFFFF;
  365. line-height: 25px;
  366. position: absolute;
  367. right: -12px;
  368. text-align: center;
  369. top: -10px;
  370. width: 24px;
  371. text-decoration: none;
  372. font-weight: bold;
  373. -webkit-border-radius: 12px;
  374. -moz-border-radius: 12px;
  375. border-radius: 12px;
  376. -moz-box-shadow: 1px 1px 3px #000;
  377. -webkit-box-shadow: 1px 1px 3px #000;
  378. box-shadow: 1px 1px 3px #000;
  379. }
  380.  
  381. .close:hover { background: #00d9ff; }
  382. }
  383.  
  384. .list{
  385. width:800px;
  386. }
  387.  
  388. .list ul{
  389. float:left;
  390. list-style-type:none;
  391. }
  392.  
  393. .list ul li{
  394. width:200px;
  395. border-bottom:2px solid #bfbfbf;
  396. }
  397.  
  398. .list ul li a{
  399. color:{color:popupboxnav};
  400. }
  401.  
  402. .clear{
  403. width:500px;
  404. height:100px;
  405. }
  406.  
  407. .updates{
  408. width:100%;
  409. margin-left:15px;
  410. }
  411.  
  412. .updates p{
  413. width:200px;
  414. height:200px;
  415. float:left;
  416. padding-left:1px;
  417. padding-right:20px;
  418. margin-left:20px;
  419. text-align:justify;
  420. }
  421.  
  422. .modalDialog h2{
  423. color:{color:popupboxtitles};
  424. }
  425.  
  426.  
  427. #paginacaoml {font-family: verdana;font-size: 11px; font-weight: bold;}
  428.  
  429. #paginacaoml a {background: #eee;margin: 1px; padding: 4px 10px; color: #f58f8d; text-decoration: none;}
  430.  
  431. #paginacaoml a:hover {background: #fff; border: none;color:#000;text-decoration: none;}
  432.  
  433. #paginacaoml span.pagina_atual {background: #fff;margin: 1px; padding: 4px 10px; color: #666; text-decoration: none; }
  434.  
  435. #paginacaoml span.info { margin: 1px; padding: 4px 8px; color: #777; text-decoration: none;}
  436.  
  437. #pagi{
  438. background-color: #eaeaea;
  439. width:98%;
  440. height:30px;
  441. top:950px;
  442. position:fixed;
  443. padding:3px;
  444. opacity: 0.7;
  445. z-index:9999;
  446. text-align:center;
  447. }
  448.  
  449. {block:Permalink}#pagi{
  450. display:none;
  451. }{/block:Permalink}
  452.  
  453.  
  454. .pagi2{
  455. background-color: transparent;
  456. width:98%;
  457. height:30px;
  458. position:fixed;
  459. top:950px;
  460. padding:3px;
  461. opacity: 0.8;
  462. z-index:9999;
  463. text-align:center;
  464. }
  465.  
  466. {block:Permalink}
  467. .pagi2{
  468. display:none;
  469. }
  470. {/block:Permalink}
  471.  
  472. .pagi2:hover .des{
  473. opacity: 1;
  474. -webkit-transition: opacity 0.5s linear;
  475. -webkit-transition: all 0.5s linear;
  476. -moz-transition: all 0.5s linear;
  477. transition: all 0.5s linear;
  478. }
  479.  
  480. </style>
  481. </head>
  482.  
  483. <body>
  484.  
  485. <!--HTML GOES HERE-->
  486.  
  487. <div style="position:fixed; background-color:{color:popupboxicon}; width:50px; height:50px; color:#ffffff;"><a href="#openModal" style="color:#ffffff; font-size:30px; margin-left:0px; line-height:140%;"><img src="http://static.tumblr.com/utfeco8/KRmo8fxl3/morebarbackground.png"/></a></div>
  488.  
  489. <div id="openModal" class="modalDialog">
  490. <div>
  491. <a href="#close" title="Close" class="close">X</a>
  492.  
  493. <!--TO ADD YOUR OWN TEXT REPLACE WHAT IS BETWEEN THE <p> TAGS WITH YOUR OWN TEXT-->
  494. <h2>INFORMATION</h2>
  495. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed neque diam, finibus nec rhoncus id, rutrum et enim. In malesuada semper erat dictum efficitur. Nulla in metus vitae leo eleifend malesuada non et orci. Phasellus vel hendrerit ligula. Phasellus id ullamcorper odio. Nam eget mollis velit. Mauris quis nisl non mauris mollis fringilla quis interdum neque. Suspendisse sodales id odio sed vehicula. Nam quis vestibulum justo, sit amet pellentesque ligula. Proin facilisis, erat vitae lobortis porttitor, magna orci vestibulum lorem, nec molestie augue arcu eget orci. Cras consequat ut turpis eu viverra.</p>
  496.  
  497. <br>
  498.  
  499. <!--TO ADD YOUR LINKS REPLACE THE # WITH YOUR OWN URL, REPLACE CUSTOM LINK WITH YOUR URL TITLE-->
  500. <h2>NAVIGATION</h2>
  501. <div class="list">
  502. <ul>
  503. <li><a href="#">custom link</a></li>
  504. <li><a href="#">custom link</a></li>
  505. <li><a href="#">custom link</a></li>
  506. <li><a href="#">custom link</a></li>
  507. </ul>
  508.  
  509. <ul>
  510. <li><a href="#">custom link</a></li>
  511. <li><a href="#">custom link</a></li>
  512. <li><a href="#">custom link</a></li>
  513. <li><a href="#">custom link</a></li>
  514. </ul>
  515.  
  516. <ul>
  517. <li><a href="#">custom link</a></li>
  518. <li><a href="#">custom link</a></li>
  519. <li><a href="#">custom link</a></li>
  520. <li><a href="#">custom link</a></li>
  521. </ul>
  522. </div>
  523. <!--end navigation-->
  524.  
  525. <br><br>
  526. <div class="clear"></div>
  527.  
  528. <!--TO ADD YOUR OWN TEXT REPLACE WHAT IS BETWEEN THE <p> TAGS WITH YOUR OWN TEXT-->
  529. <h2>UPDATES</h2>
  530. <div class="updates">
  531. <p style="border-right:1px solid #bfbfbf;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed neque diam, finibus nec rhoncus id, rutrum et enim. In malesuada semper erat dictum efficitur. Nulla in metus vitae leo eleifend malesuada non et orci.Phasellus vel hendrerit ligula. Phasellus id ullamcorper odio. </p>
  532.  
  533. <p style="border-right:1px solid #bfbfbf;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed neque diam, finibus nec rhoncus id, rutrum et enim. In malesuada semper erat dictum efficitur. Nulla in metus vitae leo eleifend malesuada non et orci.Phasellus vel hendrerit ligula. Phasellus id ullamcorper odio.</p>
  534.  
  535. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed neque diam, finibus nec rhoncus id, rutrum et enim. In malesuada semper erat dictum efficitur. Nulla in metus vitae leo eleifend malesuada non et orci.Phasellus vel hendrerit ligula. Phasellus id ullamcorper odio.</p>
  536. </div>
  537. <!--end navigation-->
  538.  
  539.  
  540.  
  541. </div>
  542. </div>
  543.  
  544.  
  545. <div class="container">
  546.  
  547.  
  548. <!--BEGIN SIDEBAR-->
  549. <div class="sidebar">
  550.  
  551. <div class="titlebox"><a href="/">{Title}</a></div>
  552.  
  553. <img src="{image:sidebar}"/>
  554.  
  555. <div class="description">{Description} </div>
  556.  
  557. <div class="titlebox">navigation</div>
  558. <div class="navigation">
  559. <ul>
  560. <li><a href="/">refresh</a></li>
  561. <li><a href="/ask">message</a></li>
  562. <li><a href="{text: link one URL}">{text:link one title}</a></li>
  563. <li><a href="{text:link two URL}">{text:link two title}</a></li>
  564. <li><a href="http://www.slapdashthemes.tumblr.com">theme</a></li>
  565. </ul>
  566. </div><!--END NAVIGATION-->
  567.  
  568. <div class="titlebox">EXTRA BOX 1</div>
  569. <p>This is an extra box for you to put anything you want here. Write anything at all.</p>
  570. <!--end extra box 1-->
  571.  
  572. <div class="titlebox">extra box 2</div>
  573. <p><span>site started:</span> month xx, xxxx</p>
  574. <p><span>admins:</span> <a href="#">admin 1</a></p>
  575. <p><span>online/hit counter:</span> xxxx</p>
  576.  
  577. </div>
  578. <!--END SIDEBAR-->
  579.  
  580.  
  581.  
  582. <!--BEGIN POSTS-->
  583. <div class="postscon">
  584.  
  585. {block:TagPage}<div class="tpages"><i class="fa fa-tag"></i>&nbsp;Posts tagged <span style="color:{color:links}">#{Tag}</span></div>{/block:TagPage}
  586.  
  587. {block:Posts}
  588. <div class="posts">
  589.  
  590. {block:Text}
  591. {block:Title}<h1>{Title}</h1>{/block:Title}
  592. {Body}
  593. {/block:Text}
  594.  
  595. {block:Answer}
  596. <div class="question">{Asker} asked: {Question}</div>
  597. <div class="answer">{Answer}</div>
  598. {/block:Answer}
  599.  
  600. {block:Quote}
  601. <h2>{Quote}</h2>
  602. {block:Source}<div class="source">{Source}</div>{/block:Source}
  603. {/block:Quote}
  604.  
  605. {block:Link}
  606. <div class="linkpost_link"><a href="{URL}">{Name}</a></div>
  607. {block:Description}{Description}{/block:Description}
  608. {/block:Link}
  609.  
  610. {block:Chat}
  611. {block:Title}<h1>{Title}</h1>{/block:Title}
  612. <div class="chat">
  613. {block:Lines}<div class="line">{block:Label}<span class="label">{Label}</span>{/block:label}{Line}</div>{/block:Lines}</div>
  614. {/block:Chat}
  615.  
  616. {block:Photo}
  617. {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}">{LinkClostTag}
  618. {block:Caption}{Caption}{/block:Caption}
  619. {/block:Photo}
  620.  
  621. {block:Photoset}
  622. {Photoset-500}
  623. {block:Caption}{Caption}{/block:Caption}
  624. {/block:Photoset}
  625.  
  626. {block:Video}
  627. {Video-500}
  628. {block:Caption}{Caption}{/block:Caption}
  629. {/block:Video}
  630.  
  631.  
  632.  
  633. <div id="info"><div id="permalink">
  634. <a href="{Permalink}">
  635. {block:Date}{TimeAgo} |{/block:Date}
  636. {block:Date}{NoteCountWithLabel} |{/block:Date}
  637. {block:Date}<a href="{ReblogURL}">Reblog</a>{/block:Date}
  638. </a>
  639.  
  640. </div>
  641. </div><!--END POST FOOTER-->
  642.  
  643.  
  644. <div id="tags">{block:HasTags}{block:Tags}<a href="{TagURL}">#{Tag} </a>{/block:Tags}{/block:HasTags}</div>
  645.  
  646. {block:PostNotes}{PostNotes}{/block:PostNotes}
  647.  
  648. </div>
  649. {/block:Posts}
  650. </div>
  651.  
  652.  
  653. <!--END POSTS-->
  654.  
  655. </div><!--END CONTAINER-->
  656.  
  657. <div id="pagi"></div>
  658. <div class="pagi2"><center><div id="paginacaoml">{block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">&laquo;</a>{/block:PreviousPage}{/block:Pagination} {block:JumpPagination length="10"} {block:CurrentPage}<span class="pagina_atual">{PageNumber}</span>{/block:CurrentPage} {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage} {/block:JumpPagination} {block:Pagination}{block:NextPage}<a href="{NextPage}">&raquo;</a>{/block:NextPage}{/block:Pagination} </div></center></div>
  659.  
  660.  
  661.  
  662.  
  663. </body>
  664. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!