diff --git a/resources/pronouns.css b/resources/pronouns.css index 5753b25..3ad386d 100644 --- a/resources/pronouns.css +++ b/resources/pronouns.css @@ -11,6 +11,13 @@ body { border:4px solid #eeeeee; } +.title { + font: large; + margin: 8px; + padding: 4px 6px 4px 6px; + border:4px solid #eeeeee; +} + .about { font: large; margin: 8px; diff --git a/src/pronouns/pages.clj b/src/pronouns/pages.clj index 7aa2b0f..d7ef9fc 100644 --- a/src/pronouns/pages.clj +++ b/src/pronouns/pages.clj @@ -31,10 +31,14 @@ [subject reflexive] (render-sentence (wrap-pronoun (s/capitalize subject)) " threw the frisbee to " (wrap-pronoun reflexive) ".")) +(defn title-block [title] + [:div {:class "title"} + [:h1 title]]) + (defn examples-block [subject object possessive-determiner possessive-pronoun reflexive] [:div {:class "examples"} - [:p [:h1 "Here are some usage examples for my pronouns:"]] + [:p [:h2 "Here are some usage examples for my pronouns:"]] (subject-example subject) (object-example object) (posessive-determiner-example subject possessive-determiner) @@ -43,32 +47,40 @@ (defn about-block [] [:div {:class "about"} - [:p "Full usage:"] - [:p + [:p "Full usage: " [:tt "http://pronoun.is/subject-pronoun/object-pronoun/possessive-determiner/possessive-pronoun/reflexive"] - " displays examples of your pronouns. If we have a good guess we'll let you use just the first one or two."] - [:p "Quick examples:"] - [:p "My name is Thel Seraphim, my " [:a {:href "http://pronoun.is/she"} "pronoun.is/she"] "."] - [:p "My name is Morgan, my " [:a {:href "http://pronoun.is/ze/zir"} "pronoun.is/ze/zir"] "."]]) + " displays examples of your pronouns."] + [:p "This is a bit unwieldy. If we have a good guess we'll let you use just the first one or two."]]) (defn contact-block [] (let [twitter-name (fn [handle] [:a {:href (str "https://www.twitter.com/" handle)} (str "@" handle)])] [:div {:class "contact"} - [:p "Written by " (twitter-name "morganastra") " and " (twitter-name "thelseraphim") ". " + [:p + "Written by " + (twitter-name "morganastra") + ", whose " + [:a {:href "http://pronoun.is/ze/zir"} "pronoun.is/ze/zir"] + ", and " + (twitter-name "thelseraphim") + ", whose " + [:a {:href "http://pronoun.is/she"} "pronoun.is/she"] + ". " "Visit the project on " [:a {:href "https://github.com/witch-house/pronoun.is"} "github!"]]])) (defn format-pronoun-examples [subject object possessive-determiner possessive-pronoun reflexive] + (let [title "Pronoun Island: English Language Examples"] (html [:html [:head - [:title "Pronoun Island: Examples"] + [:title title] [:link {:rel "stylesheet" :href "/pronouns.css"}]] [:body + (title-block title) (examples-block subject object possessive-determiner possessive-pronoun reflexive) (about-block) - (contact-block)]])) + (contact-block)]]))) (defn parse-pronouns-with-lookup [pronouns-string pronouns-table] @@ -87,15 +99,17 @@ [:li [:a {:href link} label]])) (defn front [pronouns-table] - (let [links (map make-link (sort pronouns-table))] + (let [links (map make-link (sort pronouns-table)) + title "Pronoun Island"] (html [:html [:head - [:title "Pronoun Island"] + [:title title] [:link {:rel "stylesheet" :href "/pronouns.css"}]] [:body + (title-block title) [:div {:class "table"} - [:p "pronoun.is is a www site for showing people how to use pronouns"] + [:p "pronoun.is is a www site for showing people how to use pronouns in English."] [:p "here are some pronouns the site knows about:"] [:ul links]]] (contact-block)])))