[2375] Add styles for the main site footer

ckan · May 10, 2012 · a71ca80 · a71ca80
1 parent cb39109
commit a71ca80
Show file tree

Hide file tree

Showing 4 changed files with 56 additions and 2 deletions.
diff --git a/ckan/public/base/less/ckan.less b/ckan/public/base/less/ckan.less
@@ -3,3 +3,4 @@
 @import "nav.less";
 @import "dataset.less";
 @import "masthead.less";
+@import "footer.less";
diff --git a/ckan/public/base/less/footer.less b/ckan/public/base/less/footer.less
@@ -0,0 +1,31 @@
+.site-footer {
+  .masthead;
+  font-size: 12px;
+}
+
+.site-footer a {
+  color: @masthead-link-color;
+}
+
+.footer-links,
+.attribution {
+  .opacity(80);
+  float: left;
+  width: 50%;
+}
+
+.footer-links li {
+  display: inline-block;
+  width: 40%;
+  margin-right: 5%;
+  margin-bottom: 5px;
+}
+
+.attribution strong {
+  display: block;
+}
+
+.attribution small {
+  color: @masthead-text-color;
+  font-size: 12px;
+}
diff --git a/ckan/public/base/less/masthead.less b/ckan/public/base/less/masthead.less
@@ -66,17 +66,20 @@
 .masthead .account .image {
   position: absolute;
   left: 10px;
-  top: 8px;
+  top: 6px;
 }
 
 .masthead .account .image img {
   display: block;
 }
 
-.masthead .account .links {
+.masthead .account .links a {
   line-height: 11px;
+  float: left;
 }
 
 .masthead .account .links .logout {
+  font-size: 11px;
+  clear: left;
   color: rgba(255, 255, 255, 0.6);
 }
diff --git a/ckan/public/base/test/primer/index.html b/ckan/public/base/test/primer/index.html
@@ -623,6 +623,25 @@ <h1><a href="">My Site Title</a></h1>
           </ul>
         </nav>
       </header>
+      <div class="primer-spacer"></div>
+      <footer class="site-footer">
+        <nav class="footer-links row-fluid">
+          <ul class="unstyled row-fluid">
+            <li><a href="#">Terms and Conditions</a></li>
+            <li><a href="#">Accessibility</a></li>
+            <li><a href="#">Code of conduct</a></li>
+            <li><a href="#">Moderation policy</a></li>
+            <li><a href="#">FAQ</a></li>
+            <li><a href="#">Privacy</a></li>
+            <li><a href="#">Contact us</a></li>
+            <li><a href="#">Consultation</a></li>
+          </ul>
+        </nav>
+        <div class="attribution">
+          <p><strong>Powered by</strong> <a href="">CityData</a> from <a href="">CKAN</a></p>
+          <p><small>Maps powered by Leaflet, map data &copy; OpenStreetMap contributors, CC-BY-SA, map imagery &copy; CloudMade</small></p>
+        </div>
+      </footer>
     </div>
   </body>
 </html>