Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <head>
- <!----------------------------------------------------------------------
- "blogroll" by farrells ~ crimicalthemes
- you may
- - customize the code as much as you want
- as long as you do not
- - claim the base as your own
- - take parts of the code for other themes
- - delete the credit
- thank you!
- if you want to change the primary colour of this page, ctrl+f "#c09992" and change all instances to whatever you want. find help with hex colours here: http://www.colorpicker.com/c09992
- ----------------------------------------------------------------------->
- <title>
- blogroll
- </title>
- <link rel="shortcut icon" href="{Favicon}">
- <link rel="alternate" type="application/rss+xml" href="{RSS}">
- <link href='https://fonts.googleapis.com/css?family=Roboto:400,400italic,700,700italic|Montserrat' rel='stylesheet' type='text/css'>
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
- <script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
- <script>
- $(function(){
- var $container = $('.b');
- $container.imagesLoaded(function(){
- $container.masonry({
- itemSelector: '.i',
- });
- });
- });
- </script>
- <style type="text/css">
- /* * basic * */
- body{
- margin:0px;
- padding:0px;
- background:white repeat;
- color:#666;
- font-family:'roboto';
- font-size:9px;
- line-height:180%;
- text-align:justify;
- }
- a{
- text-decoration:none;
- color:#c09992; /* change */
- }
- a:hover{
- opacity:0.8;
- color:#666;
- }
- hr{
- width:30px;
- height:1px;
- background:#c09992; /* change */
- margin:3px auto 5px;
- border:0;
- }
- *, *:hover{
- -webkit-transition:0.8s ease-in-out;
- -moz-transition:0.8s ease-in-out;
- -o-transition:0.8s ease-in-out;
- transition:0.8s ease-in-out;
- }
- /* * features * */
- #tumblr_controls, .tmblr-iframe.tmblr-iframe--desktop-loggedin-controls.iframe-controls--desktop{
- position:fixed !important;
- opacity:0.5 !important;
- -webkit-filter:invert(100%) !important;
- }
- #tumblr_controls:hover, .tmblr-iframe.tmblr-iframe--desktop-loggedin-controls.iframe-controls--desktop:hover{ opacity:1; }
- ::-webkit-scrollbar{
- height:auto;
- width:5px;
- background-color:#fbfbfb;
- border-left:1px solid #fff;
- }
- ::-webkit-scrollbar-thumb{
- background-color:#c09992; /* change */
- border-left:1px solid #fff;
- height:auto;
- }
- ::selection{ color:#fff; background:#c09992; } /* change */
- .tmblr-iframe--unified-controls{
- display:none;
- height:0px;
- }
- .cr{
- position:fixed;
- bottom:15px; right:10px;
- text-transform:uppercase;
- font-size:7px;
- letter-spacing:1px;
- opacity:.5;
- line-height:7px;
- }
- .cr:hover{ opacity:.8 }
- .cr a{
- border:1px solid;
- padding:6px 4px 4px 4px;
- }
- .cr a:hover{ -webkit-border-radius:100%; }
- /* * start * */
- #main{
- width:705px;
- margin:100px auto 100px;
- }
- .head{
- text-align:center;
- width:300px;
- margin:0 auto 30px;
- }
- .head .ic{
- margin:0 auto 0;
- width:40px;
- }
- .head .ic img{
- width:40px;
- -webkit-border-radius:3px;
- }
- .head .ic:hover img{
- -webkit-border-radius:100px;
- }
- h1{
- text-transform:uppercase;
- font-family:'montserrat';
- font-size:7px;
- letter-spacing:1px;
- word-break:break-all;
- line-height:10px;
- margin:0;
- }
- .b{ margin:55px auto 0; }
- .i{
- width:110px;
- background:#fefefe;
- padding:8px;
- text-align:center;
- border-right:1px solid #eee;
- border-bottom:1px solid #eee;
- margin:7px;
- display:inline-block;
- float:left;
- }
- .i img{
- width:40px;
- -webkit-border-radius:3px;
- margin:2px auto 0;
- }
- .i img:hover{
- -webkit-border-radius:100px;
- }
- .i a.a{
- display:block;
- text-transform:uppercase;
- font-family:'montserrat';
- font-size:7px;
- letter-spacing:1px;
- word-break:break-all;
- line-height:10px;
- margin:0;
- }
- .i .t{
- line-height:10px;
- margin-top:4px;
- font-style:italic;
- }
- </style>
- </head>
- <body>
- <div id="main">
- <div class="cr"><a href="http://crimicalthemes.tumblr.com/" title="back">cr</a></div>
- <div class="head">
- <div class="ic"><a href="/"><img src="{PortraitURL-128}" /></a></div>
- <hr>
- <h1>following</h1>
- </div>
- {block:Following}
- <div class="b">
- {block:Followed}<div class="i {FollowedName}">
- <a href="{FollowedURL}" target="_blank"><img src="{FollowedPortraitURL-40}" /></a><hr>
- <a href="{FollowedURL}" target="_blank" class="a">{FollowedName}</a><hr>
- <div class="t">{FollowedTitle}</div>
- </div>{/block:Followed}
- </div>
- {/block:Following}
- </div>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement