flag icons in page header

Author: alexch

lib/doc_page.rb

@@ -4,6 +4,7 @@
 require 'erector_scss'
 require 'titleizer'
 require 'html5_page'
+require 'flags'
 
 class DocPage < Html5Page
   needs :site_name, :doc_title, :doc_path, :page_name, :src, :locale
@@ -96,6 +97,10 @@ def body_content
       }
       ul(class: "navbar-nav nav") {
 
+        li {
+          widget Flags
+        }
+
         li(class: "dropdown") {
           a("sites", href: "#", class: "dropdown-toggle", "data-toggle" => "dropdown")
           widget SiteIndex, site_name: site_name, locale: @locale

lib/flags.rb

@@ -0,0 +1,31 @@
+
+# Flag icons borrowed from https://www.gosquared.com/resources/flag-icons/
+# Put them in public/flags
+class Flags < Erector::Widget
+
+  # swiped from DocPage -- todo: unify
+  def self.css_path
+    here = File.expand_path File.dirname(__FILE__)
+    File.expand_path "#{here}/../public/css"
+  end
+
+  external :style, scss(File.read("#{css_path}/flags.scss"))
+
+  def initialize *args
+    super
+    @locales = ["us", "es"]
+  end
+
+  def content
+    ul.flags do
+      @locales.each do |locale|
+        subdomain = (locale == "us" ? "docs" : locale)
+        li {
+          a(href:"http://#{subdomain}.railsbridge.org") {
+            img src: "/flags/#{locale.upcase}.png"
+          }
+        }
+      end
+    end
+  end
+end

public/css/flags.scss

@@ -0,0 +1,22 @@
+ul.flags {
+  padding: 0;
+  margin: 0;
+
+  > li {
+    position: relative;
+    display: block;
+    float: left;
+
+    > a {
+      position: relative;
+      display: block;
+      padding: 10px 15px;
+      line-height: 20px;
+    }
+
+    > img:hover {
+      background-color: #eee;
+    }
+  }
+
+}