cartodb/Leaflet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

minor style improvements, logo easter egg

Browse Source
This commit is contained in:
Vladimir Agafonkin 2012-07-18 11:25:20 +03:00
parent eecf619855
commit b4f509abd3
3 changed files with 83 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
_layouts/default.html
View File

@ -41,6 +41,30 @@
<h1><a href="http://leaflet.cloudmade.com">Leaflet</a></h1>
<h3 class="alt">An Open-Source JavaScript Library for Mobile-Friendly Interactive Maps by <a href="http://cloudmade.com">CloudMade</a></h3>
<div class="social-buttons">
<iframe src="http://markdotto.github.com/github-buttons/github-btn.html?user=CloudMade&amp;repo=Leaflet&amp;type=watch&amp;count=true" allowtransparency="true" frameborder="0" scrolling="0" width="113px" height="20px"></iframe>
<!--<iframe src="http://markdotto.github.com/github-buttons/github-btn.html?user=CloudMade&amp;repo=Leaflet&amp;type=fork&amp;count=true" allowtransparency="true" frameborder="0" scrolling="0" width="96px" height="20px"></iframe>-->
<a href="http://twitter.com/share" class="twitter-share-button" data-url="http://leaflet.cloudmade.com" data-text="Leaflet — an open-source JavaScript library for mobile-friendly interactive maps by @cloudmade" data-via="LeafletJS" data-related="CloudMade">Tweet</a>
<a href="https://twitter.com/LeafletJS" class="twitter-follow-button" data-show-count="true" data-show-screen-name="false">Follow @LeafletJS</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="http://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fleaflet.cloudmade.com&amp;layout=button_count&amp;show_faces=false&amp;width=430&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:87px; height:20px;" allowTransparency="true"></iframe>
<!--<div class="g-plusone" data-size="medium" data-href="http://leaflet.cloudmade.com/"></div>
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>-->
</div>
<ul class="nav clearfix">
<!-- <li><a class="cloudmade-link" href="http://cloudmade.com"></a></li> -->
<li>
@ -97,31 +121,6 @@
<li><a class="github-link" href="http://github.com/CloudMade/Leaflet">GitHub</a></li>
</ul>
<div class="social-buttons">
<iframe src="http://markdotto.github.com/github-buttons/github-btn.html?user=CloudMade&amp;repo=Leaflet&amp;type=watch&amp;count=true" allowtransparency="true" frameborder="0" scrolling="0" width="113px" height="20px"></iframe>
<!--<iframe src="http://markdotto.github.com/github-buttons/github-btn.html?user=CloudMade&amp;repo=Leaflet&amp;type=fork&amp;count=true" allowtransparency="true" frameborder="0" scrolling="0" width="96px" height="20px"></iframe>-->
<a href="http://twitter.com/share" class="twitter-share-button" data-url="http://leaflet.cloudmade.com" data-text="Leaflet — an open-source JavaScript library for mobile-friendly interactive maps by @cloudmade" data-via="LeafletJS" data-related="CloudMade">Tweet</a>
<a href="https://twitter.com/LeafletJS" class="twitter-follow-button" data-show-count="true" data-show-screen-name="false">Follow @LeafletJS</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="http://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fleaflet.cloudmade.com&amp;layout=button_count&amp;show_faces=false&amp;width=430&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:87px; height:20px;" allowTransparency="true"></iframe>
<!--<div class="g-plusone" data-size="medium" data-href="http://leaflet.cloudmade.com/"></div>
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>-->
</div>
{{ content }}
<div class="footer">

2
docs/css/blueprint/screen.css
View File

@ -22,7 +22,7 @@ table, th, td {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:'';}
blockquote, q {quotes:"" "";}
a img {border:none;}
:focus {outline:0;}
/*:focus {outline:0;}*/
/* typography.css */
html {font-size:100.01%;}

82
docs/css/screen.css
View File

@ -30,7 +30,27 @@ h1 a {
margin-left: -10px;
margin-bottom: 8px;
text-decoration: none;
-webkit-transition: 0.8s all;
-webkit-animation-duration: 2s;
-webkit-animation-delay: 10s;
-webkit-animation-name: autumn;
-webkit-animation-iteration-count: 2;
-webkit-animation-direction: alternate;
}
@-webkit-keyframes autumn {
from { -webkit-filter: none; }
to { -webkit-filter: hue-rotate(-70deg) saturate(2); }
}
h1 a:hover, h1 a:focus {
-webkit-filter: hue-rotate(-70deg) saturate(2);
}
h2 {
font-size: 1.8em;
font-weight: bold;
@ -122,7 +142,7 @@ td {
.nav {
padding: 0;
margin: 28px -13px 2.5em;
margin: 28px 0 2.5em;
list-style: none;
font-size: 1.2em;
@ -131,9 +151,9 @@ td {
background-color: #ffffff;
background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#eaebec)); /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(top, #ffffff, #eaebec); /* Chrome 10+, Saf5.1+, iOS 5+ */
background-image: -moz-linear-gradient(top, #ffffff, #eaebec); /* FF3.6+ */
background-image: -o-linear-gradient(top, #ffffff, #eaebec); /* Opera 11.10+ */
background-image: -webkit-linear-gradient(top, #ffffff, #eaebec); /* Chrome 10+, Saf5.1+, iOS 5+ */
background-image: -moz-linear-gradient(top, #ffffff, #eaebec); /* FF3.6+ */
background-image: -o-linear-gradient(top, #ffffff, #eaebec); /* Opera 11.10+ */
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#eff0f1'); /* IE6<45>IE9 */
border-radius: 10px;
@ -144,6 +164,7 @@ td {
-moz-box-shadow: 0 0 8px #eee;
-webkit-box-shadow: 0 0 8px #eee;
}
.nav li a, .nav li span {
float: left;
padding: 0 13px;
@ -161,31 +182,21 @@ td {
.nav li span {
color: #000;
background-color: #f8f9fa;
background-image: -moz-linear-gradient(top, #f8f9fa, #d4d5d6);
background-image: -o-linear-gradient(top, #f8f9fa, #d4d5d6);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #f8f9fa),color-stop(1, #d4d5d6));
background-image: -webkit-linear-gradient(#f8f9fa, #d4d5d6);
background-image: linear-gradient(top, #f8f9fa, #d4d5d6);
background-color: #e8e9ea;
background-color: #f3f4f5;
background-image: -webkit-gradient(linear, left top, left bottom, from(#f3f4f5), to(#cacbcc)); /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(top, #f3f4f5, #cacbcc); /* Chrome 10+, Saf5.1+, iOS 5+ */
background-image: -moz-linear-gradient(top, #f3f4f5, #cacbcc); /* FF3.6+ */
background-image: -o-linear-gradient(top, #f3f4f5, #cacbcc); /* Opera 11.10+ */
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f8f9fa', EndColorStr='#d4d5d6');
}
.nav li a:hover {
.nav li a:hover, .nav li a:focus {
color: black;
background-color: rgba(0,0,0,0.03);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#eff0f1', EndColorStr='#f6f7f8');
}
.nav li a.github-link {
background-image: url(../images/github.png);
}
.nav li a.twitter-link {
background-image: url(../images/twitter.png);
}
.nav li a.forum-link {
padding-right: 12px;
background-image: url(../images/forum.png);
}
.nav li a.github-link,
.nav li a.twitter-link,
.nav li a.forum-link {
@ -197,8 +208,20 @@ td {
padding-left: 30px;
padding-right: 10px;
filter: none;
background-position: 10px 12px;
background-position: 9px 12px;
}
.nav li a.github-link {
background-image: url(../images/github.png);
background-position: 10px 12px;
padding-left: 32px;
}
.nav li a.twitter-link {
background-image: url(../images/twitter.png);
}
.nav li a.forum-link {
padding-right: 12px;
background-image: url(../images/forum.png);
}
.nav li a.github-link:hover,
.nav li a.twitter-link:hover,
.nav li a.forum-link:hover {
@ -210,10 +233,21 @@ td {
top: 0;
right: 0;
border: 0;
opacity: 0.4;
opacity: 0.3;
-webkit-filter: blur(1px);
-webkit-transform: scale(0.8);
-webkit-transform-origin: 100% 0;
-webkit-transition: all 0.3s ease-out; /* Saf3.2+, Chrome */
-moz-transition: all 0.3s ease-out; /* FF4+ */
-o-transition: all 0.3s ease-out; /* Opera 10.5+ */
transition: all 0.3s ease-out;
}
a:hover #forkme {
a:hover #forkme, a:focus #forkme {
opacity: 1;
-webkit-filter: none;
-webkit-transform: scale(1);
}
#toc {