Don't like ads? PRO users don't see any ads ;-)
Public Pastes

windows 98 theme

By: m3ghanj0nes on Aug 22nd, 2012  |  syntax: None  |  size: 21.78 KB  |  hits: 11  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. <html>
  2.     <head>
  3.         <!-- "Win98" (v2), by edada.ms -->
  4.         <title>{Title}</title>
  5.         {block:Description}<meta name="description" value="{MetaDescription}" />{/block:Description}
  6.         <link rel="shortcut icon" href="{Favicon}" />
  7.         <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  8.         <meta http-equiv="Content-Type" value="text/html; charset=utf-8" />
  9.  
  10.         <meta name="image:Background" content="" />
  11.  
  12.         <meta name="color:Background" content="#008080" />
  13.         <meta name="color:Link Color" content="#000000" />
  14.        
  15.         <meta name="if:Display Photo Captions" content="1" />
  16.         <meta name="if:Display Description" content="0" />
  17.         <meta name="if:Display Home Icon" content="1" />
  18.         <meta name="if:Display Ask Icon" content="1" />
  19.         <meta name="if:Display Submit Icon" content="1" />
  20.         <meta name="if:Display Pages Icon" content="1" />
  21.         <meta name="if:Display Archive Icon" content="1" />
  22.  
  23.         <style type="text/css">
  24.             body, html {
  25.                 margin: 0;
  26.                 padding: 0;
  27.             }
  28.        
  29.             body {
  30.                 background: {color:Background} url('{image:Background}') repeat fixed;
  31.                 font-family: 'Arial', sans-serif;
  32.                 font-size: 12px;
  33.             }
  34.        
  35.             a {
  36.                 color: {color:Link Color};
  37.                 text-decoration: none;
  38.             }
  39.        
  40.             a:hover {
  41.                 text-decoration: underline;
  42.             }
  43.        
  44.             .icons {
  45.                 margin: 0 0 0 10px;
  46.                 list-style-type: none;
  47.                 padding: 0;
  48.                 width: 100px;
  49.                 float: left;
  50.                 position: fixed;
  51.                 z-index: 2;
  52.             }
  53.        
  54.             .my_computer, .my_documents, .network_neighborhood, .folder, .recycle_bin, .start_menu, .application_icons, .start_bar .start_button .logo, .start_bar .tray .calendar, .start_menu, .window .top, .window .middle, .window .bottom, .description .top, .description .ok_button, .description .bottom {
  55.                 background-image: url('http://static.tumblr.com/fpdiq1j/O6Um4f3al/master_sprite.png');
  56.                 margin: auto;
  57.             }
  58.        
  59.             .my_computer {
  60.                 height: 32px;
  61.                 width: 32px;
  62.                 background-position: -616px -157px;
  63.             }
  64.        
  65.             .my_documents {
  66.                 height: 30px;
  67.                 width: 32px;
  68.                 background-position: -616px -189px;
  69.             }
  70.        
  71.             .network_neighborhood {
  72.                 height: 32px;
  73.                 width: 32px;
  74.                 background-position: -616px -219px;
  75.             }
  76.        
  77.             .recycle_bin {
  78.                 height: 32px;
  79.                 width: 30px;
  80.                 background-position: -616px -251px;
  81.             }
  82.        
  83.             .folder{
  84.                 height: 27px;
  85.                 width: 32px;
  86.                 background-position: -616px -283px;
  87.             }
  88.        
  89.             .start_bar .start_button .logo {
  90.                 width: 16px;
  91.                 height: 14px;
  92.                 background-position: -633px -103px;
  93.             }
  94.        
  95.             .application_icons {
  96.                 height: 16px;
  97.                 width: 84px;
  98.                 background-position: -565px -69px;
  99.             }
  100.        
  101.             .start_bar .tray .calendar {
  102.                 height: 16px;
  103.                 width: 16px;
  104.                 background-position: -632px -87px;
  105.             }
  106.        
  107.             .start_menu {
  108.                 height: 383px;
  109.                 width: 168px;
  110.                 background-position: 0px 0px;
  111.             }
  112.        
  113.             .window .top {
  114.                 height: 44px;
  115.                 background-position: -168px 0px;
  116.             }
  117.            
  118.             .description .top {
  119.                 height: 21px;
  120.                 background-position: -168px -134px;
  121.             }
  122.            
  123.             .description .ok_button  {
  124.                 height: 23px;
  125.                 width: 75px;
  126.                 margin-top: 7px;
  127.                 background-position: -231px -158px;
  128.             }
  129.            
  130.             .description .bottom {
  131.                 height: 2px;
  132.                 background-position: -168px -155px;
  133.             }
  134.        
  135.             .window .middle, div.notes, div.attribution, div.tags {
  136.                 background: url('http://static.tumblr.com/fpdiq1j/utSm3gwcy/large_middle.png');
  137.                 background-repeat: repeat-y;
  138.             }
  139.        
  140.             .window .bottom {
  141.                 background-position: -168px -46px;
  142.                 height: 22px;
  143.             }
  144.        
  145.             .icon_label {
  146.                 padding-top: 6px;
  147.                 padding-bottom: 15px;
  148.                 color: white;
  149.                 text-align: center;
  150.             }
  151.        
  152.             .icons a{
  153.                 color: white;
  154.                 text-decoration: none;
  155.             }
  156.        
  157.             .title {
  158.                 font-size: 1.4em;
  159.                 margin-bottom: 3px;
  160.             }
  161.        
  162.             .attempt_resize {
  163.                 max-width: 100%;
  164.             }
  165.        
  166.             .label {
  167.                 font-weight: bold;
  168.             }
  169.            
  170.             .body img, .caption img {
  171.                 max-width: 100%;
  172.                 overflow: hidden;
  173.             }
  174.        
  175.             #desktop {
  176.                 margin: 20px auto 0 auto;
  177.                 width: 480px;
  178.                 z-index: 3;
  179.                 position: relative;
  180.             }  
  181.        
  182.             .window {
  183.                 width: 480px;
  184.                 max-width: 480px;
  185.                 margin: 0 0 30px;
  186.             }
  187.        
  188.             .window .top {
  189.                 height: 44px;
  190.             }
  191.        
  192.             .window .top .info {
  193.                 top: 26px;
  194.                 left: 10px;
  195.                 position: relative;
  196.                 width: 300px;
  197.                 z-index: 4;
  198.                 font-size: 11px;
  199.                 line-height: 13px;
  200.             }
  201.        
  202.             .window .middle, div.notes, div.attribution, div.tags {
  203.                 background-repeat: repeat-y;
  204.                 padding: 4px 26px 4px 10px;
  205.             }
  206.            
  207.             .middle .caption {
  208.                 margin-top: 5px;
  209.             }
  210.        
  211.             .window .bottom {
  212.                 height: 22px;
  213.             }
  214.            
  215.             .description {
  216.                 position: fixed;
  217.                 top: 20%;
  218.                 right: 10%;
  219.                 z-index: 4;
  220.                 width: 200px;
  221.             }
  222.            
  223.             .description .middle {
  224.                 background: url('http://static.tumblr.com/fpdiq1j/leqm4f39j/description_middle.png') repeat-y;
  225.                 display: block;
  226.                 padding: 5px;
  227.                 max-width: 190px;
  228.                 font-size: 11px;
  229.             }
  230.        
  231.             .start_bar {
  232.                 position: fixed;
  233.                 background-color: rgb(192,192,192);
  234.                 bottom: 0;
  235.                 height: 28px;
  236.                 width: 100%;
  237.                 z-index: 4;
  238.             }
  239.        
  240.             .start_menu {
  241.                 position: fixed;
  242.                 z-index: 3;
  243.                 bottom: 28px;
  244.                 display: none;
  245.             }
  246.        
  247.             .start_bar .top_border {
  248.                 border-bottom: 1px solid rgb(255,255,255);
  249.                 border-top: 1px solid rgb(223,223,223);
  250.             }
  251.        
  252.             .start_bar .start_button {
  253.                 float: left;
  254.                 border-top: 2px solid white;
  255.                 border-left: 2px solid white;
  256.                 border-bottom: 2px solid gray;
  257.                 border-right: 2px solid gray;
  258.                 height: 18px;
  259.                 width: 54px;
  260.                 margin-left: 2px;
  261.                 margin-top: 2px;
  262.             }
  263.        
  264.             .sb_click {
  265.                 border-bottom: 2px solid white !important;
  266.                 border-right: 2px solid white !important;
  267.                 border-top: 2px solid gray !important;
  268.                 border-left: 2px solid gray !important;
  269.             }
  270.        
  271.             .start_bar .start_button .text{
  272.                 float: right;
  273.                 display: inline;
  274.                 margin-right: 4px;
  275.                 line-height: 18px;
  276.                 font-weight: bold;
  277.             }
  278.        
  279.             .start_bar .start_button .logo{
  280.                 float: left;
  281.                 margin-top: 2px;
  282.                 margin-left: 2px;
  283.             }
  284.        
  285.             .start_bar .big_seperator {
  286.                 float: left;
  287.                 border-left: 1px solid rgb(128,128,128);
  288.                 border-right: 1px solid rgb(255,255,255);
  289.                 height: 22px;
  290.                 margin-top: 2px;
  291.                 margin-left: 2px;
  292.             }
  293.        
  294.             .start_bar .small_seperator {
  295.                 float: left;
  296.                 border-left: 1px solid rgb(255,255,255);
  297.                 border-top: 1px solid rgb(255,255,255);
  298.                 border-right: 1px solid rgb(128,128,128);
  299.                 border-bottom: 1px solid rgb(128,128,128);
  300.                 background-color: rgb(192,192,192);
  301.                 width: 1px;
  302.                 height: 16px;
  303.                 margin-top: 4px;
  304.                 margin-left: 2px;
  305.             }
  306.        
  307.             .start_bar .application_icons {
  308.                 float: left;
  309.                 margin-top: 5px;
  310.                 margin-left: 7px;
  311.                 margin-right: 7px;
  312.             }
  313.        
  314.             .start_bar .tray {
  315.                 float: right;
  316.                 border-top: 1px solid rgb(128,128,128);
  317.                 border-left: 1px solid rgb(128,128,128);
  318.                 border-bottom: 1px solid rgb(255,255,255);
  319.                 border-right: 1px solid rgb(255,255,255);
  320.                 height: 18px;
  321.                 width: 79px;
  322.                 margin-right: 5px;
  323.                 margin-top: 2px;
  324.             }
  325.        
  326.             .start_bar .tray .time {
  327.                 line-height: 18px;
  328.                 float: right;
  329.                 font-size: 10px;
  330.                 margin-right: 10px;
  331.             }
  332.        
  333.             .start_bar .tray .calendar {
  334.                 float: left;
  335.                 margin-top: 1px;
  336.                 margin-left: 3px;
  337.             }
  338.            
  339.             /* COMMON */
  340.            
  341.             blockquote {
  342.                 margin-left: 10px;
  343.                 padding-left: 10px;
  344.                 border-left: 1px solid #000;
  345.             }
  346.            
  347.             #infscr-loading {
  348.                 display: none !important;
  349.                 opacity: 0 !important;
  350.                 visibility: hidden !important;
  351.             }
  352.            
  353.             .middle img {
  354.                 display: block;
  355.             }
  356.            
  357.             .middle a img {
  358.                 border: 0;    
  359.             }
  360.            
  361.             .middle p:first-child, ul:first-child, ol:first-child, blockquote:first-child {
  362.                 margin-top: 0;
  363.             }
  364.            
  365.             /*.middle p:only-child, ul:only-child, ol:only-child, blockquote:only-child {
  366.                 margin-top: 0;
  367.                 margin-bottom: 0;  
  368.             }*/
  369.            
  370.             .middle p:last-child, ul:last-child, ol:last-child, blockquote:last-child {
  371.                 margin-bottom: 0;
  372.             }
  373.            
  374.             /* END COMMON */
  375.            
  376.             {block:IfNotDisplayPhotoCaptions}.caption{
  377.                 display:none;
  378.             }{/block:IfNotDisplayPhotoCaptions}
  379.  
  380.             {block:IfNotDisplayHomeIcon}.home{
  381.                 display:none;
  382.             }{/block:IfNotDisplayHomeIcon}
  383.  
  384.             {block:IfNotDisplayAskIcon}.ask{
  385.                 display:none;
  386.             }{/block:IfNotDisplayAskIcon}
  387.  
  388.             {block:IfNotDisplaySubmitIcon}.submit{
  389.                 display:none;
  390.             }{/block:IfNotDisplaySubmitIcon}
  391.  
  392.             {block:IfNotDisplayPagesIcon}.pages{
  393.                 display:none;
  394.             }{/block:IfNotDisplayPagesIcon}
  395.  
  396.             {block:IfNotDisplayArchiveIcon}.archive{
  397.                 display:none;
  398.             }{/block:IfNotDisplayArchiveIcon}
  399.        
  400.             {CustomCSS}
  401.         </style>
  402.    
  403.         <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  404.         <script type="text/javascript" src="http://static.tumblr.com/fpdiq1j/bTQm8gyse/win98.js"></script>
  405.     </head>
  406.  
  407.     <body>
  408.         <div class="wrapper">
  409.             <div class="icons">
  410.                 <a href="/" class="home">
  411.                     <div class="my_computer"></div>
  412.                     <div class="icon_label">{Title}</div>
  413.                 </a>
  414.            
  415.                 {block:AskEnabled}
  416.                     <a href="/ask" class="ask">
  417.                         <div class="my_documents"></div>
  418.                         <div class="icon_label">{AskLabel}</div>
  419.                     </a>
  420.                 {/block:AskEnabled}
  421.                
  422.                 {block:SubmissionsEnabled}
  423.                     <a href="/submit" class="submit">
  424.                         <div class="network_neighborhood"></div>
  425.                         <div class="icon_label">{SubmitLabel}</div>
  426.                     </a>
  427.                 {/block:SubmissionsEnabled}
  428.  
  429.                 {block:HasPages}
  430.                     {block:Pages}
  431.                         <a href="{URL}" class="pages">
  432.                             <div class="folder"></div>
  433.                             <div class="icon_label">{Label}</div>
  434.                         </a>    
  435.                     {/block:Pages}
  436.                 {/block:HasPages}
  437.  
  438.                 <a href="/archive" class="archive">
  439.                     <div class="recycle_bin"></div>
  440.                     <div class="icon_label">Archive</div>
  441.                 </a>
  442.             </div>
  443.             {block:IfDisplayDescription}
  444.                 {block:Description}
  445.                     <div class="description">
  446.                         <div class="top"></div>
  447.                         <div class="middle">
  448.                             {Description}
  449.                             <div class="ok_button"></div>
  450.                         </div>
  451.                         <div class="bottom"></div>
  452.                     </div>        
  453.                 {/block:Description}
  454.             {block:IfDisplayDescription}
  455.             <div id="desktop">
  456.                 {block:Posts}
  457.                     <div class="window">
  458.                         <a href="{Permalink}">
  459.                             <div class="top">
  460.                                 {block:Date}
  461.                                     <div class="info">
  462.                                         Posted on {DayOfMonth}{DayOfMonthSuffix} {ShortMonth} at {12Hour}:{Minutes} {CapitalAmPm}{block:NoteCount}, with {NoteCountWithLabel}{/block:NoteCount}
  463.                                     </div>
  464.                                 {/block:Date}
  465.                             </div>
  466.                         </a>
  467.                         <div class="middle">
  468.                             {block:Text}
  469.                                 {block:Title}
  470.                                     <div class="title">
  471.                                         {Title}
  472.                                     </div>
  473.                                 {/block:Title}
  474.                                 <div class="body">
  475.                                     {Body}
  476.                                 </div>
  477.                             {/block:Text}
  478.  
  479.                             {block:Photo}
  480.                                 {LinkOpenTag}<img src="{PhotoURL-500}" class="attempt_resize" alt="{PhotoAlt}" />{LinkCloseTag}
  481.                                 {block:Caption}
  482.                                     <div class="caption">
  483.                                         {Caption}
  484.                                     </div>
  485.                                 {/block:Caption}
  486.                             {/block:Photo}
  487.  
  488.                             {block:Photoset}
  489.                                 {Photoset-400}
  490.                                 {block:Caption}
  491.                                     <div class="caption">
  492.                                         {Caption}
  493.                                     </div>
  494.                                 {/block:Caption}
  495.                             {/block:Photoset}
  496.  
  497.                             {block:Quote}
  498.                                 <div class="title">
  499.                                     "{Quote}"
  500.                                 </div>
  501.                                 {block:Source}
  502.                                     <div class="body">
  503.                                         &mdash; {Source}
  504.                                     </div>
  505.                                 {/block:Source}
  506.                             {/block:Quote}
  507.  
  508.                             {block:Link}
  509.                                 <a href="{URL}" class="title" {Target}>
  510.                                     {Name} ยป
  511.                                 </a>
  512.                                 {block:Description}
  513.                                     <div class="body">
  514.                                         {Description}
  515.                                     </div>
  516.                                 {/block:Description}
  517.                             {/block:Link}
  518.  
  519.                             {block:Chat}
  520.                                 {block:Title}
  521.                                     <div class="title">
  522.                                         {Title}
  523.                                     </div>
  524.                                 {/block:Title}
  525.                                 <div class="body">
  526.                                     {block:Lines}
  527.                                         <div class="line">
  528.                                             {block:Label}
  529.                                                 <span class="label">
  530.                                                     {Label}
  531.                                                 </span>
  532.                                             {/block:Label}
  533.                                             <span class="text">
  534.                                                 {Line}
  535.                                             <span>
  536.                                         </div>
  537.                                     {/block:Lines}      
  538.                                 </div>
  539.                             {/block:Chat}
  540.  
  541.                             {block:Video}
  542.                             {Video-400}
  543.                                 {block:Caption}
  544.                                     <div class="caption">
  545.                                         {Caption}
  546.                                     </div>
  547.                                 {/block:Caption}
  548.                             {/block:Video}
  549.  
  550.                             {block:Audio}
  551.                                 {AudioPlayerBlack}
  552.                                 {block:Caption}
  553.                                     <div class="body">
  554.                                         {Caption}
  555.                                     </div>
  556.                                 {/block:Caption}
  557.                             {/block:Audio}
  558.                         </div>
  559.                         {block:PermalinkPage}
  560.                             {block:ContentSource}<div class="attribution">(Source: <a href="{SourceURL}">{SourceTitle}</a>{block:RebloggedFrom}, via <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom})</div>{/block:ContentSource}
  561.                             {block:HasTags}<div class="tags">Tagged: {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  562.                             {block:PostNotes}
  563.                                 <div class="notes">  
  564.                                     {PostNotes}
  565.                                 </div>
  566.                             {/block:PostNotes}
  567.                         {/block:PermalinkPage}
  568.                         <div class="bottom"></div>
  569.                     </div>
  570.                 {/block:Posts}
  571.                 {block:Pagination}
  572.                     <div class="navigation">
  573.                         {block:NextPage}
  574.                             <a class="next" href="{NextPage}">Next</a>
  575.                         {/block:NextPage}
  576.                         {block:PreviousPage}
  577.                             <a class="prev" href="{PreviousPage}">Previous</a>
  578.                         {/block:PreviousPage}
  579.                     </div>
  580.                 {/block:Pagination}
  581.             </div>
  582.             <div class="start_menu">
  583.             </div>
  584.             <div class="start_bar">
  585.                 <div class="top_border"></div>
  586.                 <div class="start_button">
  587.                     <span class="logo">
  588.                     </span>
  589.                     <span class="text">
  590.                         Start
  591.                     </span>
  592.                 </div>
  593.                 <span class="big_seperator">
  594.                 </span>
  595.                 <span class="small_seperator">
  596.                 </span>
  597.                 <span class="application_icons">
  598.                 </span>
  599.                 <span class="big_seperator">
  600.                 </span>
  601.                 <span class="small_seperator">
  602.                 </span>
  603.                 <div class="tray">
  604.                     <span class="calendar">
  605.                     </span>
  606.                     <span class="time" id="showClock">
  607.                         00:00 AM
  608.                     </span>
  609.                 </div>
  610.             </div>
  611.         </div>
  612.     </body>
  613. </html>
create a new version of this paste RAW Paste Data