Tumblr Theme 日付ブロック



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <!-- DEFAULT COLORS -->
        <meta name="color:Background" content="#666"/>
        <meta name="color:Content Background" content="#fff"/>
        <meta name="color:Header Background" content="#4AADF0"/>
        <meta name="color:Title" content="#fff"/>
        <meta name="color:Description" content="#094E7C"/>
        <meta name="color:Date" content="#666"/>
        <meta name="color:Permalinks" content="#4AADF0"/>
        <meta name="color:Post Title" content="#222"/>    
        <meta name="color:Text" content="#222"/>
        <meta name="color:Inline Link" content="#ff9900"/>
        <meta name="color:Quote" content="#333"/>
        <meta name="color:Quote Source" content="#666"/>
        <meta name="color:Link Post" content="#ff9900"/>
        <meta name="color:Conversation Background 1" content="#f4f4f4"/>
        <meta name="color:Conversation Background 2" content="#e8e8e8"/>
        <meta name="color:Conversation Border" content="#ccc"/>
        <meta name="color:Conversation Text" content="#000"/>
        <meta name="color:Photo Background" content="#ccc"/>   
        <meta name="color:Video Background" content="#eee"/>   
        <!-- END DEFAULT COLORS -->

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>{Title}{block:PostSummary} - {PostSummary}{/block:PostSummary}</title>
        <link rel="icon" href="{Favicon}"/>
        <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}"/>
        <meta name="viewport" content="width=675"/> <!-- iPhone -->

        <style type="text/css">
            body {
                color:            {color:Text};
                margin:           30px;
                background-color: {color:Background};
                font-family:      'Lucida Grande', Helvetica, sans-serif;
            }
            
            #content {
                width:            92%;
                margin:           auto;
                padding:          35px;
                background-color: {color:Content Background};
            }

            a {
                color:            {color:Inline Link};
            }

            h1 {
                padding:          0px;
                margin:           0px;
                font:             Normal 30px Helvetica, sans-serif;
                line-height:      33px;
                letter-spacing:   -1px;
            }
            
            h1 a {
                color:            {color:Title};
                text-decoration:  none;
            }

            div#header {
                background-color: {color:Header Background};
                margin:           -20px -20px 30px -20px;
                padding:          20px 30px 10px 30px;
            }

            div#description {
                font-size:        15px;
                margin-top:       10px;
                color:            {color:Description};
            }
            
            div#description a {
                color:            {color:Description};
            }
div#tag{
  font-size:        12px;
  margin:0,0,0,0;
}

                        div#search {
                                text-align:                right;
                                margin:                        10px 0 0;
                        }
            
            .date {
                font:             Normal 16px Helvetica, sans-serif;
                color:            {color:Date};
                line-height:      32px;
                height:           28px;
                padding-top:      7px;
                background:       {color:Content Background} url('/themes/3/stripes.gif') top repeat-x;
                border-bottom:    dotted 1px #bbb;
                margin-bottom:    10px;
                text-transform:   uppercase;
                clear:            both;
            }
            
            .post {
                margin:    2px;
                position:         relative;
                height:           275px;
                width:            275px;
                float:            left;
                overflow:         hidden;

            }

            .post h2 {
                font-weight:      Normal;
                font-size:        20px;
                color:            {color:Post Title};
                margin:           0px 0px 10px 0px;
            }

            .post h2 a {
                color:            {color:Post Title};
                text-decoration:  none;
            }
            
            /* Regular Post */
            .post .regular {
                font-size:        12px;
                line-height:      17px;
            }

            .post .regular blockquote {
                font-style:       italic;
            }
            
            /* Photo Post */
            .post .photo {
                padding:          2px;
                background-color: {color:Photo Background};
                height:           1000px;
            }
            
            .post .photo img {
                border:           solid 2px {color:Content Background};
                height:           80px;
                width:            80px;
            }

            .post .photo .caption {
                font-size:        12px;
                margin-top:       5px;
                background-color: {color:Photo Background};
            }
            
            .post .photo .caption a {
                color:            {color:Text};
            }

a.brick {
    border: solid 1px #aaa;
    display: block;
    width: 250px;
    height: 250px;
    list-style-type: none;
    overflow: hidden;
    margin: 0px 5px 5px 0px;
    font: Normal 11px Helvetica, sans-serif;
    color: #444;
    position: relative;
    background-color: #FdFcFF;
    text-decoration: none;
}

.inside_brick {
}

span.caption {
    background-color: #000;
    color: #fff;
    font: Bold 11px Helvetica, sans-serif;
}

            /* Quote Post */
            .post div.quote {
                padding: 0px 0px 0px 0px;
            }
            
            .post div.quote span.quote {
                font-size:        10px;
                letter-spacing:   -1px;
                color:            {color:Quote};
            }

            .post div.quote span.quote a {
                color:            {color:Quote};
            }

            .post div.quote span.quote big.quote {
                font-weight:      bold;
                font-size:        12px;
                line-height:      0px;
                vertical-align:   0px;
                opacity:          0.5;
                -moz-opacity:     0.5;
                filter:           alpha(opacity=50);
            }
            
            .post div.quote .source {
                font-size:        12px;
                color:            {color:Quote Source};
            }

            .post div.quote .source a {
                color:            {color:Quote Source};
            }
            
            /* Link Post */
            .post .link a.link {
                font:             Bold 14px Helvetica, sans-serif;
                letter-spacing:   -1px;
                color:            {color:Link Post};
                text-decoration:  none;
                border-bottom:    dotted 1px {color:Link Post};
                line-height:      20px;
            }

            .post .link .description {
                font-weight:      normal;
                font-size:        14px;
                margin-top:       5px;
            }
            
            /* Conversation Post */
            .post .conversation ul {
                list-style-type:  none;
                margin:           0px 0px 5px 0px;
                padding:          1px;
                border:           solid 5px {color:Conversation Border};
            }
            
            .post .conversation ul li {
                font-size:        12px;
                padding:          4px 0px 4px 8px;
                color:            {color:Conversation Text};
            }
            
            .post .conversation ul li span.label {
                font-weight:      bold;
            }
            
            .post .conversation ul li.odd {
                background-color: {color:Conversation Background 1};
            }
            
            .post .conversation ul li.even {
                background-color: {color:Conversation Background 2};
            }
            
            /* Audio Post */
            .post .audio .caption {
                margin-top:       5px;
                font-size:        11px;
                color:            {color:Text};
            }
            
            .post .audio .caption a {
                color:            {color:Text};
            }
            
            /* Video Post */
            .post .video {
                height:            150px;
                margin:           auto;
                padding:          35px;
                background-color: {color:Video Background};
            }

            .post .video .caption {
                margin-top:       15px;
                font-size:        13px;
                color:            {color:Text};
            }
            
            .post .video .caption a {
                color:            {color:Text};
            }

            /* Footer */
            #footer {
                margin:           20px 0px 0px 0px;
                text-align:       center;
                font-size:        18px;
                clear:            both;
            }
            
            #footer a {
                text-decoration:  none;
                color:            {color:Text};
            }
            
            #footer a:hover {
                text-decoration:  underline;
            }

            #footer p.tiny {
                margin:           30px 0px 0px 0px;
                font-size:        11px;
            }
            
            #footer p.tiny a {
                text-decoration:  underline;
                color:            {color:Text};
                font-weight:      bold;
            }
            
            #footer p.tiny .dim {
                filter:           alpha(opacity=50); 
                -moz-opacity:     0.5; 
                opacity:          0.5;
            }
            
            /* Permalinks */
            .post a.permalink,
            .post .audio .caption a.permalink,
            .post .quote .source a.permalink {
                font-size:        10px;
                font-weight:      bold;
                color:            {color:Permalinks};
            }


                        .searchresultcount {
                                text-align:             center;
                        }
                        
                        .query {
                                font-weight:            bold;
                        }
            
            {CustomCSS}
        </style>
    </head>
    <body>
        <div id="content">
            <div id="header">
                <h1><a href="/">{Title}</a></h1>
                
                {block:Description}
                    <div id="description">
                        {Description}
                    </div>
                {/block:Description}

                                <div id="search">
                                    <form action="/search" method="get">
                                        <input type="text" name="q" value="{SearchQuery}"/>
                                        <input type="submit" value="Search"/>
                                    </form>
                                </div>
            </div>
<div id="tag">
TAG:
<a href="/tagged/PC">PC</a> 
<a href="/tagged/カメラ">カメラ</a> 
<a href="/tagged/電子">電子</a> 
<a href="/tagged/株式">株式</a> 
<a href="/tagged/Books">Books</a> 
<a href="/tagged/可愛い">可愛い</a> 
<a href="/tagged/綺麗">綺麗</a> 
<a href="/tagged/笑い">笑い</a> 
<a href="/tagged/美味しい">美味しい</a> 
<a href="/tagged/凄い">凄い</a> 
<a href="/tagged/生活">生活</a> 
<a href="/tagged/文房具">文房具</a> 
</div>
<div id="footer">

                {block:PreviousPage}
                    <a href="{PreviousPage}">← Previous</a>   
                {/block:PreviousPage}
                
                {block:NextPage}
                    <a href="{NextPage}">Next →</a>
                {/block:NextPage}
</div>
                        {block:SearchPage}
                            <div class="searchresultcount">
                                <p>Your search for <span class="query">{SearchQuery}</span> returned {SearchResultCount} result(s)</p>
                            </div>
                        {/block:SearchPage}

            {block:Posts}
                {block:NewDayDate}
                    <div class="date">
                        {Month} {DayOfMonth}, {Year}
                    </div>
                {/block:NewDayDate}
            
                <div class="post">
                    {block:Regular}
                        <div class="regular">
                            {block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}
                            {Body}
                            <a href="{Permalink}" class="permalink">{TimeAgo}</a>
                        </div>
                    {/block:Regular}
                    
                    {block:Photo}
                            <a class="brick" href="{LinkURL}" style="background:url('{PhotoURL-250}') center no-repeat;">
                                 <span class="caption">{PhotoAlt}</span>

                       </a>
                            <a href="{Permalink}" class="permalink">{TimeAgo}</a> 
                            <a href="{PhotoURL-500}" class="permalink">500px</a>
                    {/block:Photo}
                    
                    {block:Quote}
                        <div class="quote">
                            <div class="source">
                                {Source}
                                <a href="{Permalink}" class="permalink">{TimeAgo}</a>
                            </div>
                            <span class="quote">
                                {Quote}
                            </span>
                        </div>
                    {/block:Quote}
                    
                    {block:Link}
                        <div class="link">
                            <a href="{URL}" class="link" {Target}>{Name}</a>
                            <div class="description">
                                {Description}
                                <a href="{Permalink}" class="permalink">{TimeAgo}</a>
                            </div>
                        </div>
                    {/block:Link}
                    
                    {block:Conversation}
                        <div class="conversation">
                            {block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}
                            <ul>
                                {block:Lines}
                                    <li class="{Alt}">
                                        {block:Label}<span class="label">{Label}</span>{/block:Label}
                                        {Line}
                                    </li>
                                {/block:Lines}
                            </ul>
                            <a href="{Permalink}" class="permalink">{TimeAgo}</a>
                        </div>
                    {/block:Conversation}
                    
                    {block:Audio}
                        <div class="audio">
                            {AudioPlayerBlack}
                            <div class="caption">
                                {Caption}
                                <a href="{Permalink}" class="permalink">{TimeAgo}</a>
                            </div>
                        </div>
                    {/block:Audio}
                    
                    {block:Video}
                        <div class="video">
                            {Video-500}
                            <div class="caption">
                                {Caption}
                                <a href="{Permalink}" class="permalink">{TimeAgo}</a>
                            </div>
                        </div>
                    {/block:Video}
                </div>
            {/block:Posts}

            <div id="footer">
                {block:PreviousPage}
                    <a href="{PreviousPage}">← Previous</a>   
                {/block:PreviousPage}
                
                {block:NextPage}
                    <a href="{NextPage}">Next →</a>
                {/block:NextPage}

                <p class="tiny">
                    Browse the <a href="/archive">Archive</a>
                     <span class="dim">/</span> 
                    Subscribe via <a href="/rss">RSS</a>
                     <span class="dim">/</span> 
                    Powered by <a href="http://tumblr.com/">Tumblr</a>
                </p>
            </div>
        </div>
    </body>
</html>
yuki

初めての作業で調べた事、困った時の解決方法を記録するブログ。 主なテーマは、パソコン、プログラミング、カメラ、DTM、スピリチュアル、化学物質過敏症

コメントを投稿

Please Select Embedded Mode To Show The Comment System.*