Small view and style tweaks.
* Put the footer in a paragraph. * Update the intro text. * Kill the stupid . * Make CSS pixel perfect.
This commit is contained in:
parent
16723078e8
commit
42a8917f5c
|
@ -1,6 +1,7 @@
|
|||
require "camping"
|
||||
require "camping/session"
|
||||
require "pathname"
|
||||
require "markaby"
|
||||
require "camping/session"
|
||||
|
||||
Markaby::Builder.set(:indent, 2)
|
||||
|
||||
|
@ -174,19 +175,21 @@ module Anne::Views
|
|||
h1 "Enquête ruimtelijke effecten"
|
||||
end
|
||||
div.content! { self << yield }
|
||||
div.footer! { "Copyright © 2010 Anne Pijl, Bram Senders, Paul van Tilburg" }
|
||||
div.footer! do
|
||||
p "Copyright © 2010 Anne Pijl, Bram Senders, Paul van Tilburg"
|
||||
end
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
def intro
|
||||
p "Met deze enquête worden een aantal ruimtelijke effecten onderzocht. " \
|
||||
"Je krijgt 45 keer een plaatje met twee afbeeldingen te zien. " \
|
||||
"Je kiest welke afbeelding, de linker of de rechter afbeelding, " \
|
||||
"je ruimtelijker ervaart. " \
|
||||
"In welk plaatje zie je meer diepte, welk plaatje lijkt jou het meest " \
|
||||
"3-dimensionaal? Als je het niet weet, klik je op een willekeurige " \
|
||||
"afbeelding. De test duurt 5 à 10 minuten. Succes!"
|
||||
"Je krijgt 45 keer twee afbeeldingen te zien. Je kiest welke afbeelding" \
|
||||
" je ruimtelijker ervaart. In welke afbeelding zie je meer diepte, " \
|
||||
"welke afbeelding lijkt jou het meest 3-dimensionaal? Als je het niet " \
|
||||
"weet, klik je op een willekeurige afbeelding. De test duurt 5 á 10 " \
|
||||
"minuten. Succes!"
|
||||
|
||||
p "Doe de test volledig om kans te maken op de prijs."
|
||||
p "– Anne Pijl"
|
||||
|
||||
|
@ -220,7 +223,8 @@ module Anne::Views
|
|||
"Technische Natuurkunde",
|
||||
"Werktuigbouwkunde",
|
||||
"Wiskunde & Informatica"]
|
||||
make_select "Studiejaar", "user_study_year", ["niet van toepassing"] + (1998..2009).to_a
|
||||
make_select "Studiejaar", "user_study_year",
|
||||
["niet van toepassing"] + (1998..2009).to_a
|
||||
make_select "Geslacht", "user_gender", ["", "man", "vrouw"]
|
||||
make_select "Ben je kleurenblind?", "user_colorblind", ["nee", "ja"]
|
||||
make_select "Vind je dat je een goed ruimtelijk voorstellingsvermogen hebt?",
|
||||
|
@ -234,17 +238,19 @@ module Anne::Views
|
|||
h2 "Welk beeld is ruimtelijker?"
|
||||
form :action => R(Vote), :method => :post do
|
||||
input :type => "hidden", :name => "image", :value => image
|
||||
input.image :type => "image", :src => R(ImageX, "#{image}-l.png"), :name => "left", :id => "left"
|
||||
input.image :type => "image", :src => R(ImageX, "#{image}-r.png"), :name => "right", :id => "right"
|
||||
input.image :type => "image", :src => R(ImageX, "#{image}-l.png"),
|
||||
:name => "left", :id => "left"
|
||||
input.image :type => "image", :src => R(ImageX, "#{image}-r.png"),
|
||||
:name => "right", :id => "right"
|
||||
end
|
||||
div.progressbar! do
|
||||
div.done! :style => "width: #{progress}%" do " " end
|
||||
div.done! :style => "width: #{progress}%" do end
|
||||
end
|
||||
end
|
||||
|
||||
def finish
|
||||
h2 "Dank je wel voor het meedoen aan dit onderzoek."
|
||||
p "Als je geïnteresseerd bent in de resultaten van de enquête of je wilt " +
|
||||
p "Als je geïnteresseerd bent in de resultaten van de enquête of je wilt " \
|
||||
"meedingen naar de prijs, vul dan hier je e-mailadres in."
|
||||
|
||||
form :action => R(Finish), :method => :post do
|
||||
|
@ -279,20 +285,18 @@ end
|
|||
__END__
|
||||
/* Style sheet for the Anne Survey Camping app */
|
||||
|
||||
html, body { margin: 0; padding: 0; background: #333; }
|
||||
html { background: #333; }
|
||||
|
||||
body {
|
||||
margin: 0 auto;
|
||||
margin-top: 10pt;
|
||||
border: thin solid #333;
|
||||
padding: 10px;
|
||||
margin: 10px auto;
|
||||
padding: 12px;
|
||||
width: 960px;
|
||||
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
|
||||
color: white;
|
||||
background-color: black;
|
||||
-webkit-border-radius: 1em;
|
||||
-moz-border-radius: 1em;
|
||||
border-radius: 1em;
|
||||
-webkit-border-radius: 12px;
|
||||
-moz-border-radius: 12px;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
#header {
|
||||
|
@ -300,28 +304,26 @@ body {
|
|||
height: 73px;
|
||||
}
|
||||
|
||||
#header h1 {
|
||||
padding-top: 20px;
|
||||
}
|
||||
#header h1 { padding-top: 25px; margin-top: 0px; }
|
||||
|
||||
.image { border: thin solid #888; text-align: center; }
|
||||
#left { margin-right: 10px; }
|
||||
#right { margin-left: 10px; }
|
||||
.image { border: thin solid #888; }
|
||||
#left { margin: 0px 15px 0px 0px; }
|
||||
#right { margin: 0px 0px 0px 15px; }
|
||||
|
||||
#progressbar {
|
||||
height: 6px;
|
||||
margin-top: 1.2em;
|
||||
margin-top: 14px;
|
||||
background-color: #101073;
|
||||
}
|
||||
|
||||
#progressbar #done {
|
||||
height: 5pt;
|
||||
height: inherit;
|
||||
background-color: #d6007b;
|
||||
}
|
||||
|
||||
#footer {
|
||||
padding: 3pt 8pt 0pt 8pt;
|
||||
margin-top: 1em;
|
||||
padding: 0px 0px 0px 8px;
|
||||
margin-top: 14px;
|
||||
border-top: thin #eee solid;
|
||||
font-size: 62.5%;
|
||||
font-size: 69.4%;
|
||||
}
|
||||
|
|
Reference in New Issue