Guest

Theme3-Demure

By: meimei on Jan 28th, 2012  |  syntax: None  |  size: 15.28 KB  |  hits: 32  |  expires: Never
download  |  raw  |  embed  |  report abuse
Copied
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <!-----------
  5. CREDITS
  6. DO NOT REMOVE!
  7.  
  8. Theme: Demure
  9. by the mei factory
  10. themeifactory.tumblr.com
  11.  
  12. ------------->
  13.  
  14. <html>
  15. <head>
  16.  
  17. <!--META DESCRIPTION-->
  18.  
  19. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  20. {block:Description}
  21. <meta name="description" content="{MetaDescription}" />
  22. {/block:Description}
  23.  
  24. <link rel="shortcut icon" href="{Favicon}" />
  25. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  26. <title>{Title}</title>
  27.  
  28. <!--DEFAULT STYLES-->
  29.  
  30. <meta name="text:LinkOne" content="" />
  31. <meta name="text:LinkOneURL" content="" />
  32. <meta name="text:LinkTwo" content="" />
  33. <meta name="text:LinkTwoURL" content="" />
  34. <meta name="text:LinkThree" content="" />
  35. <meta name="text:LinkThreeURL" content="" />
  36.  
  37. <meta name="image:Background" content="http://static.tumblr.com/erioqhc/nMolyc1ff/bg6.png" />
  38.  
  39. <meta name="color:Background Color" content="#999999" />
  40. <meta name="color:Link Hover" content="#83b9bf" />
  41. <meta name="color:Scrollbar" content="#171717" />
  42. <meta name="color:Scrollbar Track" content="#83b9bf" />
  43. <meta name="color:Scrollbar Right Border" content="#ffffff" />
  44. <meta name="color:Title" content="#ffffff" />
  45. <meta name="color:Sidebar" content="#000000" />
  46. <meta name="color:Sidebar Content" content="#000000" />
  47. <meta name="color:Sidebar Buttons" content="#ffffff" />
  48. <meta name="color:Body" content="#000000" />
  49. <meta name="color:Posts" content="#000000" />
  50. <meta name="color:Reblog Bar" content="#000000" />
  51. <meta name="color:Reblog Content" content="#ffffff" />
  52. <meta name="color:Text Title Hover" content="#ffffff" />
  53. <meta name="color:Post Separator" content="#ffffff" />
  54. <meta name="color:Permalink Info" content="#000000" />
  55. <meta name="color:Notes" content="#ffffff" />
  56.  
  57. <meta name="if:TranslucentBack" content="1" />
  58. <meta name="if:SmallerFont" content="0" />
  59.  
  60. <script type="text/javascript" src="http://static.tumblr.com/erioqhc/ciHlydc46/jquery_library.js"></script>
  61. <script type="text/javascript">
  62.     $(document).ready(function(){
  63. $(".title,.buttons").hide();
  64.     $("#sheep").hover(function(){
  65.         $(".title,.buttons").fadeIn(500,"linear");
  66.     });
  67. $(".bottom").hide();
  68.     $(".top").click(function(){
  69.         $(this).next().fadeToggle(500,"linear");
  70.     });
  71. $(".mid").hide();
  72.     $(".top2").click(function(){
  73.         $(this).next().live().animate({opacity:"toggle",height:"toggle"},650,"linear");
  74.     });
  75. });
  76. </script>
  77.  
  78. <style type="text/css">
  79.  
  80. html {
  81.     overflow-y: scroll;
  82. }
  83.  
  84. body {
  85.     font-family: {font:Posts};
  86.     font-size: 12px;
  87.     background: url("{image:Background}") top left fixed repeat;
  88.     background-position: fixed;
  89.     background-color: {color:Background Color};
  90. }
  91.  
  92. a, a:visited, a:active {text-decoration: none;color: inherit;-webkit-transition: 0.3s ease-out;-moz-transition: 0.3s ease-out;-o-transition: 0.3s ease-out;}
  93.  
  94. a:hover {color: {color:Link Hover};-webkit-transition: 0.3s ease-out;-moz-transition: 0.3s ease-out;-o-transition: 0.3s ease-out;}
  95.  
  96. ::-webkit-scrollbar {
  97.     height: 10px;
  98.     width: 15px;
  99. }
  100.  
  101. ::-webkit-scrollbar-track-piece:vertical {
  102.     background-color: #525252;
  103.     border-right: 10px solid {color:Scrollbar Right Border};
  104. }
  105.  
  106. ::-webkit-scrollbar-thumb:vertical {
  107.     background-color: {color:Scrollbar Track};
  108.     border-right: 10px solid {color:Scrollbar Right Border};
  109. }
  110.  
  111. #meow {
  112.     position: fixed; width: 420px; height: 100%;
  113.     left: 50%; margin-left: -210px; top: 0;
  114.     background-color: {color:Body};
  115.     {Block:ifTranslucentBack}
  116.     opacity: 0.4;
  117.     -moz-opacity: 0.4;
  118.     filter: alpha(opacity=40);
  119.     {/Block:ifTranslucentBack}
  120.     box-shadow: 0px 0px 15px #000000;
  121. -moz-box-shadow: 0px 0px 10px #000000;-o-box-shadow: 0px 0px 10px #000000;-webkit-box-shadow: 0px 0px 10px #000000;
  122. }
  123.  
  124. #meow2 {
  125.     position: absolute;
  126.     width: 200px;
  127.     height: 100%;
  128.     background-color: {color:Sidebar};
  129.     margin-left: 440px;
  130.     box-shadow: 0px 0px 15px #000000;
  131. -moz-box-shadow: 0px 0px 10px #000000;-o-box-shadow: 0px 0px 10px #000000;-webkit-box-shadow: 0px 0px 10px #000000;
  132. }
  133.  
  134. #sidebar{
  135.     position: fixed;
  136.     width: 180px;
  137.     left: 50%; top: 50%;
  138.     margin-top: -250px; margin-left: 240px;
  139.     font-family: Georgia,serif;
  140.     text-transform: lowercase;
  141.     text-align: center;
  142. }
  143.  
  144. #nav {
  145.     position: relative;
  146.     font-size: 25px;
  147.     color: {color:Sidebar Content};
  148. }
  149.  
  150. #sheep {
  151.     width: 150px; height: 150px;
  152.     border-radius: 75px;
  153.     overflow: hidden;
  154.     border: 2px solid {color:Title};
  155.     cursor: crosshair;
  156.     margin: 10px auto;
  157.     -webkit-transition: 0.4s ease-out;
  158.     -moz-transition: 0.4s ease-out;
  159.     -o-transition: 0.4s ease-out;
  160. }
  161.  
  162. #sheep:hover {
  163.     border: 2px solid {color:Link Hover};
  164.     -webkit-transition: 0.4s ease-out;
  165.     -moz-transition: 0.4s ease-out;
  166.     -o-transition: 0.4s ease-out;
  167. }
  168.  
  169. .title {
  170.     font-size: 13px;
  171.     {Block:ifSmallerFont}
  172.     font-size: 12px;
  173.     {/Block:ifSmallerFont}
  174.     color: {color:Title};
  175.     letter-spacing: 2px;
  176.     text-align: center;
  177.     padding: 8px;
  178.     border-bottom: 2px solid {color:Title};
  179.     margin: auto;
  180. }
  181.  
  182. .buttons {
  183.     width: 150px;
  184.     display: block;
  185.     padding: 5px;
  186.     margin: 3px auto;
  187.     font-size: 10px;
  188.     color: {color:Sidebar Content};
  189.     background-color: {color:Sidebar Buttons};
  190.     -webkit-transition: 0.4s ease-out;
  191.     -moz-transition: 0.4s ease-out;
  192.     -o-transition: 0.4s ease-out;
  193.     border-left: 10px solid {color:Sidebar Buttons};
  194.     border-right: 10px solid {color:Sidebar Buttons};
  195. }
  196.  
  197. .buttons:hover {
  198.     border-left: 0px solid {color:Sidebar Buttons};
  199.     border-right: 0px solid {color:Sidebar Buttons};
  200.     -webkit-transition: 0.4s ease-out;
  201.     -moz-transition: 0.4s ease-out;
  202.     -o-transition: 0.4s ease-out;
  203. }
  204.  
  205. #wrapper {
  206.     position: absolute;
  207.     width: 400px;
  208.     left: 50%;
  209.     margin-left: -200px;
  210. }
  211.  
  212. #roar {
  213.     padding: 10px 0px 10px 0px;
  214.     border-bottom: 2px solid {color:Post Separator};
  215.     -webkit-transition: 0.3s linear;
  216.     -moz-transition: 0.3s linear;
  217.     -o-transition: 0.3s linear;
  218. }
  219.  
  220. .reblogg {
  221.     position: absolute;
  222.     margin: -20px 0px 0px 0px;
  223.     font-family: Consolas,serif;
  224.     font-size: 10px;
  225.     color: {color:Reblog Content};
  226.     width: 360px; height: 12px;
  227.     padding-left: 40px;
  228.     background-color: {color:Reblog Bar};
  229.     z-index: 0;
  230. }
  231.  
  232. @-webkit-keyframes rotate {
  233.   from {
  234.     -webkit-transform: rotate(0deg);
  235.   }
  236.   to {
  237.     -webkit-transform: rotate(360deg);
  238.   }
  239. }
  240.  
  241. .wee {
  242.     position: absolute;
  243.     font-size: 25px;
  244.     color: {color:Reblog Content};
  245.     margin: -30px 0px 0px 10px;
  246.     z-index: 1;
  247.    
  248.     -webkit-animation-name: rotate;
  249.     -webkit-animation-duration: 7s;
  250.     -webkit-animation-iteration-count: infinite;
  251.     -webkit-animation-timing-function: linear;
  252. }
  253.  
  254. #text {
  255.     font-family: Georgia;
  256.     font-size: 11px;
  257.     {Block:ifSmallerFont}
  258.     font-size: 10px;
  259.     {/Block:ifSmallerFont}
  260.     letter-spacing: -1px;
  261. }
  262.  
  263. .top2 {
  264.     font-size: 13px;
  265.     {Block:ifSmallerFont}
  266.     font-size: 12px;
  267.     {/Block:ifSmallerFont}
  268.     font-weight: bold;
  269.     padding: 5px 0px 5px 0px;
  270.     text-align: center;
  271.     cursor: crosshair;
  272.     -webkit-transition: 0.4s linear;
  273.     -moz-transition: 0.4s linear;
  274.     -o-transition: 0.4s linear;    
  275. }
  276.  
  277. .top2:hover {
  278.     background-color: {color:Posts};
  279.     color: {color:Text Title Hover};
  280.     -webkit-transition: 0.4s linear;
  281.     -moz-transition: 0.4s linear;
  282.     -o-transition: 0.4s linear;  
  283. }
  284.  
  285. blockquote {
  286.     border-left: 2px solid #ffffff;
  287.     margin: 0px 10px 0px 10px;
  288.     padding-left: 5px;
  289. }
  290.  
  291.  
  292. #giraffe {
  293.     font-family: Consolas,serif;
  294.     font-size: 10px;
  295.     letter-spacing: 1px;
  296.     color: {color:Permalink Info};
  297.     width: 370px;
  298.     padding: 15px;
  299.     background-color: {color:Post Separator};
  300.     border-radius: 0px 0px 30px 30px;
  301.     -webkit-border-bottom-right-radius: 30px;
  302.     -webkit-border-bottom-left-radius: 30px;
  303.     -moz-border-radius-bottomright: 30px;
  304.     -moz-border-radius-bottomleft: 30px;
  305. }
  306.  
  307. ol.notes {
  308.     font-family: Consolas,serif;font-size: 10px;
  309.     letter-spacing: 1px;word-spacing: 1px;
  310.     padding: 5px;margin: 10px 0px 30px 0px;
  311.     list-style-type: none;border-bottom: solid 1px #ffffff;
  312. }
  313.  
  314. ol.notes li.note {
  315.     padding: 3px;color: {color:Notes};border-top: 1px solid {color:Notes};
  316. }
  317.  
  318. ol.notes li.note img.avatar {
  319.     vertical-align: -4px;margin-right: 5px;width: 20px;height: 20px;
  320.     border-radius: 10px;-webkit-border-radius: 10px;-moz-border-radius: 10px;
  321. }
  322.  
  323. ol.notes li.note span.action {
  324.     font-weight: normal;color: {color:Notes};
  325. }
  326.  
  327. ol.notes li.note .answer_content {font-weight: normal; color: {color:Notes};}
  328.  
  329. ol.notes li.note blockquote {
  330.     border-color: {color:Notes}; color: {color:Notes};
  331.     padding: 4px 10px;margin: 10px 0px 0px 20px;
  332. }
  333.  
  334. ol.notes li.note blockquote a {text-decoration: none; color: {color:Notes};}
  335.  
  336. {CustomCSS}
  337. </style>
  338.  
  339. </head>
  340.  
  341. <body>
  342. <div id="meow"><div id="meow2"></div></div>
  343.  
  344. <div id="sidebar">
  345.  
  346.     <div id="nav">
  347.     {Block:Pagination}
  348.     {Block:PreviousPage}
  349.         <a href="{PreviousPage}">←</a>
  350.     {/Block:PreviousPage}
  351.  
  352.     {Block:NextPage}
  353.         <a href="{NextPage}">→</a>
  354.     {/Block:NextPage}
  355.     {/Block:Pagination}
  356.     </div>
  357.  
  358. <div id="sheep">
  359. <img src="http://static.tumblr.com/erioqhc/xLxlybzxm/snow.png" style="width:150px;"/></div>
  360. <p class="title"><i><a href="/">{Title}</a></i></p><br>
  361.            
  362.         <a class="buttons" href="/">Index</a>
  363.         <a class="buttons" href="/ask">Ask</a>
  364.         <a class="buttons" href="/archive">Archive</a>
  365.  
  366. {Block:IfLinkOne}<a class="buttons" href="{block:IfLinkOneURL}{text:LinkOneURL}{/Block:IfLinkOneURL}">{text:LinkOne}</a>{/Block:IfLinkOne}
  367.  
  368. {Block:IfLinkTwo}<a class="buttons" href="{block:IfLinkTwoURL}{text:LinkTwoURL}{/Block:IfLinkTwoURL}">{text:LinkTwo}</a>{/Block:IfLinkTwo}
  369.  
  370. {Block:IfLinkThree}<a class="buttons" href="{block:IfLinkThreeURL}{text:LinkThreeURL}{/Block:IfLinkThreeURL}">{text:LinkThree}</a>{/Block:IfLinkThree}
  371.  
  372.         <a class="buttons" href="http://themeifactory.tumblr.com">Theme</a>
  373.                
  374. </div>
  375.  
  376.  
  377. <div id="wrapper">
  378.  
  379. {Block:Posts}
  380.  
  381. {Block:Text}
  382. <div id="roar">
  383. <div id="text">
  384. <p class="top2" style="margin:0px;"><i>{Title}</i>&nbsp;&nbsp;&nbsp;✩</p>
  385. <div class="mid" style="padding-bottom: 10px;">{Body}
  386.  
  387. <div class="bottom2">
  388. <p class="wee" style="margin-top:-10px;">❆</p>
  389. <div class="reblogg" style="margin-top:0px;"><a href="{ReblogURL}" target="_blank" class="details">reblog</a> | <a href="{Permalink}">{NoteCountWithLabel}</a></div>
  390. </div>
  391. </div></div>
  392. </div>
  393. {/Block:Text}
  394.  
  395. {Block:Photo}
  396. <div id="roar">
  397. <p class="top" style="margin:0px; cursor:crosshair;"><img src="{PhotoURL-400}" /></p>
  398.  
  399. <div class="bottom" {Block:ifPermalinkPage}style="position:fixed;margin-top:-9999px;"{/Block:ifPermalinkPage}>
  400. <p class="wee">❆</p>
  401. <div class="reblogg"><a href="{ReblogURL}" target="_blank" class="details">reblog</a> | <a href="{Permalink}">{NoteCountWithLabel}</a></div>
  402. </div>
  403. </div>
  404. {/Block:Photo}
  405.  
  406. {Block:Photoset}
  407. <div id="roar">
  408. <p class="top" style="margin:0px; cursor:crosshair;"><img src="{Photoset-400}" /></p>
  409.  
  410. <div class="bottom">
  411. <p class="wee">❆</p>
  412. <div class="reblogg"><a href="{ReblogURL}" target="_blank" class="details">reblog</a> | <a href="{Permalink}">{NoteCountWithLabel}</a></div>
  413. </div>
  414. </div>
  415. {/Block:Photoset}
  416.  
  417. {Block:Quote}
  418. <div id="roar">
  419. <div id="text">
  420. <p class="top2" style="margin:0px;"><i>"{Quote}"</i></p>
  421. <div class="mid" style="padding-bottom: 10px;"><p>{Block:Source}- {Source}{/Block:Source}</p>
  422.  
  423. <div class="bottom2">
  424. <p class="wee" style="margin-top:-10px;">❆</p>
  425. <div class="reblogg" style="margin-top:0px;"><a href="{ReblogURL}" target="_blank" class="details">reblog</a> | <a href="{Permalink}">{NoteCountWithLabel}</a></div>
  426. </div>
  427. </div></div>
  428. </div>
  429. {/Block:Quote}
  430.  
  431. {Block:Link}
  432. <div id="roar">
  433. <div id="text">
  434. <p class="top2" style="margin:0px;"><i><a href="{URL}" {Target}>{Name}</a></i></p>
  435. <div class="mid" style="padding-bottom: 10px;"><p>{Block:Description}{Description}{/Block:Description}</p>
  436.  
  437. <div class="bottom2">
  438. <p class="wee" style="margin-top:-10px;">❆</p>
  439. <div class="reblogg" style="margin-top:0px;"><a href="{ReblogURL}" target="_blank" class="details">reblog</a> | <a href="{Permalink}">{NoteCountWithLabel}</a></div>
  440. </div>
  441. </div></div>
  442. </div>
  443. {/Block:Link}
  444.  
  445. {Block:Chat}
  446. <div id="roar">
  447. <div id="text">
  448. <p class="top2" style="margin:0px;"><i>{Title}</i>&nbsp;&nbsp;&nbsp;✩</p>
  449. <div class="mid" style="padding-bottom: 10px;">
  450.     <p>
  451. <ul style="list-style:none; margin-left: -38px;">
  452.     {Block:Lines}    
  453. <li class="{Alt}">
  454. <div style="margin-bottom: 5px;">
  455. {block:Label}<span class="label" style="font-weight: bold;">{Label}</span>{/block:Label}
  456.         {Line}
  457.     {/Block:Lines}
  458. </div>
  459. </ul></li>
  460.     </p>
  461.  
  462. <div class="bottom2">
  463. <p class="wee" style="margin-top:-10px;">❆</p>
  464. <div class="reblogg" style="margin-top:0px;"><a href="{ReblogURL}" target="_blank" class="details">reblog</a> | <a href="{Permalink}">{NoteCountWithLabel}</a></div>
  465. </div>
  466. </div></div>
  467. </div>
  468. {/Block:Chat}
  469.  
  470. {Block:Audio}
  471. <div id="roar">
  472. <div id="text">
  473. <p class="top2" style="margin:0px;">{AudioPlayerWhite}</p>
  474. <div class="mid" style="padding-bottom: 10px;"><p><center>{PlayCountWithLabel}<br />{Caption}</center></p>
  475.  
  476. <div class="bottom2">
  477. <p class="wee" style="margin-top:-10px;">❆</p>
  478. <div class="reblogg" style="margin-top:0px;"><a href="{ReblogURL}" target="_blank" class="details">reblog</a> | <a href="{Permalink}">{NoteCountWithLabel}</a></div>
  479. </div>
  480. </div></div>
  481. </div>
  482. {/Block:Audio}
  483.  
  484. {Block:Video}
  485. <div id="roar">
  486. <p class="top" style="margin:0px;">{Video-400}</p>
  487.  
  488. <div class="bottom">
  489. <p class="wee">?</p>
  490. <div class="reblogg"><a href="{ReblogURL}" target="_blank" class="details">reblog</a> | <a href="{Permalink}">{NoteCountWithLabel}</a></div>
  491. </div>
  492. </div>
  493. {/Block:Video}
  494.  
  495. {Block:Answer}
  496. <div id="roar">
  497. <div id="text">
  498. <p class="top2" style="margin:0px;"><i>{Asker} asked: </i>{Question}</p>
  499. <div class="mid" style="padding-bottom: 10px;"><br>{Answer}
  500.  
  501. <div class="bottom2">
  502. <p class="wee" style="margin-top:-10px;">❆</p>
  503. <div class="reblogg" style="margin-top:0px;"><a href="{ReblogURL}" target="_blank" class="details">reblog</a> | <a href="{Permalink}">{NoteCountWithLabel}</a></div>
  504. </div>
  505. </div></div>
  506. </div>
  507. {/Block:Answer}
  508.  
  509. {Block:PermalinkPage}
  510. <div id="giraffe">
  511.  
  512. <center>{Block:Date}<p style="font-size:14px">Posted on {Month} {DayofMonth}, {Year} at {12Hour}:{Minutes} {AmPm}<br>{/Block:Date}{Block:NoteCount}{NoteCountWithLabel}</p>{/Block:NoteCount}</center>
  513.    
  514. {block:ContentSource}<b>Source:</b> <a href="{SourceURL}">{SourceTitle}</a><br>{/block:ContentSource}
  515.  
  516. {block:RebloggedFrom}<b>Via:</b> <a href="{ReblogParentURL}">{ReblogParentName}</a><br><b>Originally posted by:</b> <a href="{ReblogRootURL}">{ReblogRootName}</a><br>{/block:RebloggedFrom}
  517.    
  518. {Block:HasTags}<b>Tagged:</b> {Block:Tags}<a href="{TagURL}">{Tag}</a> | {/Block:Tags}{Block:HasTags}
  519. </div>
  520. {block:PostNotes}<div id="notes">{PostNotes}</div>{/block:PostNotes}
  521. {/Block:PermalinkPage}
  522. {/Block:Posts}
  523.  
  524. </div>
  525. </body>
  526. </html>