diff --git a/static/css/product.css b/static/css/product.css index d5d16cc..91bbf38 100644 --- a/static/css/product.css +++ b/static/css/product.css @@ -131,7 +131,7 @@ .heading { padding: 0.5em; - margin-top: 0.5em; + margin-top: 1em; text-align: center; } @@ -140,17 +140,44 @@ } .what_is_luminotes_area { - float: right; width: 400px; - margin-left: 20px; + margin-bottom: 1em; } .what_is_luminotes_text { text-align: left; } +.thumbnail { + border: 1px solid #999999; +} + +.thumbnail_caption { + font-size: 75%; + font-weight: bold; + margin-top: 0.5em; +} + +.thumbnail_caption_detail { + font-size: 75%; + margin-top: 0.25em; +} + +.thumbnail_cell { + text-align: center; + padding: 0.75em 0.5em 0.25em 0.5em; + width: 175px; +} + +.thumbnail_area { + background-color: #fffece; + padding-bottom: 0.5em; +} + .quotes_area { + float: right; width: 400px; + margin-left: 20px; } .quote { diff --git a/static/images/big_picture_thumb.png b/static/images/big_picture_thumb.png index 56da365..bee35c8 100644 Binary files a/static/images/big_picture_thumb.png and b/static/images/big_picture_thumb.png differ diff --git a/static/images/download_thumb.png b/static/images/download_thumb.png new file mode 100644 index 0000000..fdfd32c Binary files /dev/null and b/static/images/download_thumb.png differ diff --git a/static/images/download_thumb.xcf b/static/images/download_thumb.xcf new file mode 100644 index 0000000..1e21b99 Binary files /dev/null and b/static/images/download_thumb.xcf differ diff --git a/static/images/share_thumb.png b/static/images/share_thumb.png index 864b068..160d5cf 100644 Binary files a/static/images/share_thumb.png and b/static/images/share_thumb.png differ diff --git a/static/images/share_thumb.xcf b/static/images/share_thumb.xcf index 246b619..95579fa 100644 Binary files a/static/images/share_thumb.xcf and b/static/images/share_thumb.xcf differ diff --git a/static/images/wysiwyg_thumb.png b/static/images/wysiwyg_thumb.png index 53261ad..bd1cc2c 100644 Binary files a/static/images/wysiwyg_thumb.png and b/static/images/wysiwyg_thumb.png differ diff --git a/static/images/wysiwyg_thumb.xcf b/static/images/wysiwyg_thumb.xcf index 586d4e0..8cedf3f 100644 Binary files a/static/images/wysiwyg_thumb.xcf and b/static/images/wysiwyg_thumb.xcf differ diff --git a/view/Front_page.py b/view/Front_page.py index 7162b93..945ec82 100644 --- a/view/Front_page.py +++ b/view/Front_page.py @@ -1,5 +1,5 @@ from Product_page import Product_page -from Tags import Div, Img, A, P, Table, Td, Li, Span, I +from Tags import Div, Img, A, P, Table, Tr, Td, Li, Span, I class Front_page( Product_page ): @@ -63,40 +63,7 @@ class Front_page( Product_page ): Div( Div( - Img( - src = u"/static/images/what_is_luminotes.png", - class_ = u"heading", width = u"214", height = u"29", - alt = u"What is Luminotes?", - ), Div( - P( - u""" - Luminotes is a personal wiki notebook for organizing your notes and ideas. - You don't have to use any special markup codes or install any software. You - simply start typing. - """, - ), - P( - u""" - With Luminotes, you deal with several notes all at once on the same web page, - so you get a big-picture view of what you're working on and can easily make - links from one concept to another. - """, - A( u"Read more.", href = u"/take_a_tour" ), - ), - P( - u""" - Luminotes is open source / free software and licensed under the terms of the - GNU GPL. - """, - ), - class_ = u"what_is_luminotes_text", - ), - class_ = u"what_is_luminotes_area", - ), - - Div( - P( Img( src = u"/static/images/quotes.png", class_ = u"heading", width = u"253", height = u"31", @@ -170,6 +137,79 @@ class Front_page( Product_page ): class_ = u"quotes_area", ), + + Div( + Img( + src = u"/static/images/what_is_luminotes.png", + class_ = u"heading", width = u"214", height = u"29", + alt = u"What is Luminotes?", + ), + Div( + P( + u""" + Luminotes is a personal wiki notebook for organizing your notes and ideas. + You don't have to use any special markup codes or install any software. You + simply start typing. + """, + ), + Table( + Tr( + Td( + A( + Img( src = u"/static/images/wysiwyg_thumb.png", width = u"175", height = "100", class_ = u"thumbnail" ), + href = u"/static/images/wysiwyg.png", + target = u"_new", + ), + Div( u"Create a wiki visually", class_ = u"thumbnail_caption" ), + Div( u"Make a wiki as easily as writing a document.", class_ = u"thumbnail_caption_detail" ), + class_ = u"thumbnail_cell", + ), + Td( + A( + Img( src = u"/static/images/big_picture_thumb.png", width = u"175", height = "100", class_ = u"thumbnail" ), + href = u"/static/images/big_picture.png", + target = u"_new", + ), + Div( u"Link your notes together", class_ = u"thumbnail_caption" ), + Div( u"Connect your thoughts with links between notes.", class_ = u"thumbnail_caption_detail" ), + class_ = u"thumbnail_cell", + ), + ), + Tr( + Td( + A( + Img( src = u"/static/images/download_thumb.png", width = u"175", height = "100", class_ = u"thumbnail" ), + href = u"/static/images/screenshot.png", + target = u"_new", + ), + Div( u"Take your wiki to go", class_ = u"thumbnail_caption" ), + Div( u"Download your entire wiki with a single click.", class_ = u"thumbnail_caption_detail" ), + class_ = u"thumbnail_cell", + ), + Td( + A( + Img( src = u"/static/images/share_thumb.png", width = u"175", height = "100", class_ = u"thumbnail" ), + href = u"/static/images/share.png", + target = u"_new", + ), + Div( u"Share your thoughts", class_ = u"thumbnail_caption" ), + Div( u"Invite friends and colleagues to collaborate.", class_ = u"thumbnail_caption_detail" ), + class_ = u"thumbnail_cell", + ), + ), + class_ = u"thumbnail_area", + ), + P( + u""" + Luminotes is open source / free software and licensed under the terms of the + GNU GPL. + """, + ), + class_ = u"what_is_luminotes_text", + ), + class_ = u"what_is_luminotes_area", + ), + class_ = u"wide_center_area", ),