Permalink
Browse files

MINOR: added site info and back to top link

  • Loading branch information...
1 parent 1a56cb4 commit 30d2d648f6a29181cbb6004441f4f8d37d1ded30 @Zauberfisch committed Feb 24, 2012
View
@@ -1,6 +1,29 @@
-/* get a sprite image from the social icons */
-.socialmediaicons-sprite, .layout-wrapper .socialmedia-wrapper .socialmediaicons-facebook, .layout-wrapper .socialmedia-wrapper .socialmediaicons-flickr, .layout-wrapper .socialmedia-wrapper .socialmediaicons-twitter, .layout-wrapper .socialmedia-wrapper .socialmediaicons-youtube {
- background: url('../images/socialmediaicons-s19e97c8559.png') no-repeat; }
+/* get a sprite image from the icons */
+/* include all icons as css classes (eg: .icon-facebook) */
+/* see ../images/icons for all avaliable icons */
+.icons-sprite, .icons-backtotop, .icons-facebook, .icons-flickr, .icons-gallery, .icons-sitenotice, .icons-twitter, .icons-youtube {
+ background: url('../images/icons-s16acbcd365.png') no-repeat; }
+
+.icons-backtotop {
+ background-position: 0 0; }
+
+.icons-facebook {
+ background-position: 0 -38px; }
+
+.icons-flickr {
+ background-position: 0 -76px; }
+
+.icons-gallery {
+ background-position: 0 -114px; }
+
+.icons-sitenotice {
+ background-position: 0 -148px; }
+
+.icons-twitter {
+ background-position: 0 -186px; }
+
+.icons-youtube {
+ background-position: 0 -224px; }
* {
margin: 0;
@@ -80,12 +103,25 @@ a:hover {
font-weight: bold; }
.footer {
- margin: 10px 0;
+ margin: 10px auto;
+ width: 90%;
+ max-width: 900px;
text-align: center;
line-height: 18px; }
.footer .break {
/* don't remove the line break on default, we only use breaks in the footer on smaller screens */
display: none; }
+.footer .left, .footer .right {
+ margin: 0 5px; }
+.footer .left a, .footer .right a {
+ color: #727272;
+ font-weight: normal;
+ padding: 0 0 0 20px;
+ line-height: 18px; }
+.footer .left {
+ float: left; }
+.footer .right {
+ float: right; }
/* Layout
---------------------------------------- */
@@ -153,9 +189,7 @@ a:hover {
.layout-wrapper .socialmedia-wrapper {
overflow: hidden;
text-align: center;
- margin: -16px 0 0;
- /* include all icons as css classes (eg: .socialmediaicons-facebook) */
- /* see ../images/socialmediaicons for all avaliable icons */ }
+ margin: -16px 0 0; }
.layout-wrapper .socialmedia-wrapper .socialmedia {
padding: 5px;
margin: 2px 0;
@@ -191,11 +225,3 @@ a:hover {
-o-transition: opacity 0.5s ease-out 0s;
transition: opacity 0.5s ease-out 0s;
text-decoration: none; }
-.layout-wrapper .socialmedia-wrapper .socialmediaicons-facebook {
- background-position: 0 0; }
-.layout-wrapper .socialmedia-wrapper .socialmediaicons-flickr {
- background-position: 0 -18px; }
-.layout-wrapper .socialmedia-wrapper .socialmediaicons-twitter {
- background-position: 0 -36px; }
-.layout-wrapper .socialmedia-wrapper .socialmediaicons-youtube {
- background-position: 0 -54px; }
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
File renamed without changes
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Deleted file not rendered
View
@@ -1,9 +1,27 @@
.footer {
- margin: 10px 0;
+ margin: 10px auto;
+ width: $layout-width;
+ max-width: $layout-max-width;
text-align: center;
line-height: 18px;
.break {
/* don't remove the line break on default, we only use breaks in the footer on smaller screens */
display: none;
}
+ .left, .right {
+ margin: 0 5px;
+
+ a {
+ color: #727272;
+ font-weight: normal;
+ padding: 0 0 0 20px;
+ line-height: 18px;
+ }
+ }
+ .left {
+ float: left;
+ }
+ .right {
+ float: right;
+ }
}
View
@@ -3,8 +3,12 @@
@import "config.scss";
-/* get a sprite image from the social icons */
-@import "socialmediaicons/*.png";
+/* get a sprite image from the icons */
+/* include all icons as css classes (eg: .icon-facebook) */
+/* see ../images/icons for all avaliable icons */
+$icons-spacing: 20px;
+@import "icons/*.png";
+@include all-icons-sprites;
* {
@@ -150,8 +154,5 @@ a {
}
}
}
- /* include all icons as css classes (eg: .socialmediaicons-facebook) */
- /* see ../images/socialmediaicons for all avaliable icons */
- @include all-socialmediaicons-sprites;
}
}
@@ -1,9 +1,11 @@
<div class="socialmedia-wrapper">
<span class="socialmedia">
<%-- the &nbsp; are required to get width in IE7 --%>
- <a target="_blank" href="http://facebook.com" class="socialmediaicons-facebook" title="facebook">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
- <a target="_blank" href="http://twitter.com" class="socialmediaicons-twitter" title="twitter">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
- <a target="_blank" href="http://youtube.com" class="socialmediaicons-youtube" title="youtube">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
- <a target="_blank" href="http://www.flickr.com" class="socialmediaicons-flickr" title="flickr">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
+ <%-- icons can be used by css classes (eg: .icon-facebook) --%>
+ <%-- see ../images/icons for all avaliable icons --%>
+ <a target="_blank" href="http://facebook.com" class="icons-facebook" title="facebook">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
+ <a target="_blank" href="http://twitter.com" class="icons-twitter" title="twitter">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
+ <a target="_blank" href="http://youtube.com" class="icons-youtube" title="youtube">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
+ <a target="_blank" href="http://www.flickr.com" class="icons-flickr" title="flickr">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
</span>
</div>
View
@@ -20,7 +20,7 @@
<![endif]-->
</head>
<body>
- <div class="container">
+ <div id="top" class="container">
<div class="header-wrapper">
<div class="header">
@@ -44,6 +44,9 @@
</div>
<div class="footer">
+ <p class="left"><a class="icons-backtotop" href="#top"><% _t('BACKTOTOP', 'Back to top') %></a></p>
+ <%-- hardcoded link to your site notice, contact page or something like this, which doesn't really belong into the navigation --%>
+ <p class="right"><a class="icons-sitenotice" href="/sitenotice"><% _t('SITENOTICE', 'site notice') %></a></p>
<p>
<% _t('COPYRIGHT', 'Copyright') %> &copy; $Now.Year
<span class="seperator"> | </span><span class="break"><br /></span><%-- use seperator on desktop, and line break on handhelds --%>

0 comments on commit 30d2d64

Please sign in to comment.