Add a smaller version of the site logo and title for small screens
authorDan Karran <dan@karran.net>
Sun, 3 Apr 2011 13:50:39 +0000 (14:50 +0100)
committerTom Hughes <tom@compton.nu>
Sun, 3 Apr 2011 14:16:35 +0000 (15:16 +0100)
app/views/layouts/site.html.erb
public/stylesheets/common.css
public/stylesheets/small.css

index d04a2877fcaa0318ad2921ebb7981b20660db35c..95289376e2d180898c257358a291bbda5bdf3135 100644 (file)
@@ -2,6 +2,10 @@
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<%= I18n.locale %>" lang="<%= I18n.locale %>" dir="<%= t'html.dir' %>">
   <%= render :partial => "layouts/head" %>
   <body>
+    <div id="small-title">
+      <%= link_to(image_tag("osm_logo.png", :size => "16x16", :border => 0, :alt => t('layouts.logo.alt_text')), :controller => 'site', :action => 'index') %>
+      <h1><%= t 'layouts.project_name.h1' %></h1>
+    </div>
     <div id="content">
       <%= render :partial => "layouts/flash", :locals => { :flash => flash } %>
 
index 5490b1a9b42e2d3c6ff4da9eed69ef787d78ba5b..1464c980762c87b720c10d3c69c3f5180ee03286 100644 (file)
@@ -67,6 +67,12 @@ hr {
   margin: 0px;
 }
 
+/* Rules for the site name */
+
+#small-title {
+  display: none;
+}
+
 /* Rules for the introductory text displayed in the left sidebar to new users */
 
 #intro {
index b11aebf69cf0688b0e0e964be8aaa20e64371fb8..59a38bba49618a23ad0b2b886b657a7761111fbb 100644 (file)
@@ -38,6 +38,28 @@ h1 {
   margin-right: 1px;
 }
 
+/* Rules for the site name - shown when left sidebar is hidden */
+
+#small-title {
+  font-size: 12px;
+  line-height: 14px;
+  display: block;
+  position: absolute;
+  top: 0;
+  margin: 3px;
+}
+
+#small-title img {
+  position: absolute;
+}
+
+#small-title h1 {
+  position: absolute;
+  left: 18px;
+  font-size: 12px;
+  margin: 2px;
+}
+
 /* Rules for greeting bar in the top right corner */
 
 #greeting {