From 6ca61ec7d9c0a5e1daca5de15396f6183c9a41c8 Mon Sep 17 00:00:00 2001 From: Rory MacQueen Date: Tue, 30 Jul 2013 00:15:47 -0700 Subject: Created article list to look like designs I modified the ArticleList widget to look like the designs. This meant modifying some of the css as well as creating a new textButton widget, which displays a text label and an icon image, which will appear on a hover. Also added the separators between the category info box and the article list [endlessm/eos-sdk#177] --- wikipedia/data/assets/category_hover_arrow.png | Bin 0 -> 3047 bytes .../assets/category_splash_separator_shadow.png | Bin 0 -> 1601 bytes wikipedia/data/assets/content_background.jpg | Bin 0 -> 16164 bytes wikipedia/data/assets/content_title_separator.png | Bin 0 -> 1555 bytes wikipedia/data/assets/image_strip_back_button.png | Bin 0 -> 2055 bytes wikipedia/data/assets/submenu_background.jpg | Bin 0 -> 16349 bytes wikipedia/data/assets/submenu_bg_hover.png | Bin 0 -> 17510 bytes wikipedia/data/assets/submenu_bg_normal.jpg | Bin 0 -> 14412 bytes wikipedia/data/assets/submenu_bg_pressed.png | Bin 0 -> 17648 bytes wikipedia/data/assets/submenu_hover_arrow.png | Bin 0 -> 1196 bytes .../data/assets/submenu_separator_shadow_a.png | Bin 0 -> 4070 bytes .../data/assets/submenu_separator_shadow_b.png | Bin 0 -> 1923 bytes wikipedia/data/css/endless_brazil.css | 27 ++++++++++++++++----- wikipedia/data/endless_brazil.gresource.xml | 9 +++++++ 14 files changed, 30 insertions(+), 6 deletions(-) create mode 100644 wikipedia/data/assets/category_hover_arrow.png create mode 100644 wikipedia/data/assets/category_splash_separator_shadow.png create mode 100644 wikipedia/data/assets/content_background.jpg create mode 100644 wikipedia/data/assets/content_title_separator.png create mode 100644 wikipedia/data/assets/image_strip_back_button.png create mode 100644 wikipedia/data/assets/submenu_background.jpg create mode 100644 wikipedia/data/assets/submenu_bg_hover.png create mode 100644 wikipedia/data/assets/submenu_bg_normal.jpg create mode 100644 wikipedia/data/assets/submenu_bg_pressed.png create mode 100644 wikipedia/data/assets/submenu_hover_arrow.png create mode 100644 wikipedia/data/assets/submenu_separator_shadow_a.png create mode 100644 wikipedia/data/assets/submenu_separator_shadow_b.png (limited to 'wikipedia/data') diff --git a/wikipedia/data/assets/category_hover_arrow.png b/wikipedia/data/assets/category_hover_arrow.png new file mode 100644 index 0000000..13a2fb0 Binary files /dev/null and b/wikipedia/data/assets/category_hover_arrow.png differ diff --git a/wikipedia/data/assets/category_splash_separator_shadow.png b/wikipedia/data/assets/category_splash_separator_shadow.png new file mode 100644 index 0000000..6ef03e0 Binary files /dev/null and b/wikipedia/data/assets/category_splash_separator_shadow.png differ diff --git a/wikipedia/data/assets/content_background.jpg b/wikipedia/data/assets/content_background.jpg new file mode 100644 index 0000000..e53a87a Binary files /dev/null and b/wikipedia/data/assets/content_background.jpg differ diff --git a/wikipedia/data/assets/content_title_separator.png b/wikipedia/data/assets/content_title_separator.png new file mode 100644 index 0000000..db7d7db Binary files /dev/null and b/wikipedia/data/assets/content_title_separator.png differ diff --git a/wikipedia/data/assets/image_strip_back_button.png b/wikipedia/data/assets/image_strip_back_button.png new file mode 100644 index 0000000..1d4787c Binary files /dev/null and b/wikipedia/data/assets/image_strip_back_button.png differ diff --git a/wikipedia/data/assets/submenu_background.jpg b/wikipedia/data/assets/submenu_background.jpg new file mode 100644 index 0000000..ccdac1d Binary files /dev/null and b/wikipedia/data/assets/submenu_background.jpg differ diff --git a/wikipedia/data/assets/submenu_bg_hover.png b/wikipedia/data/assets/submenu_bg_hover.png new file mode 100644 index 0000000..b9ed24a Binary files /dev/null and b/wikipedia/data/assets/submenu_bg_hover.png differ diff --git a/wikipedia/data/assets/submenu_bg_normal.jpg b/wikipedia/data/assets/submenu_bg_normal.jpg new file mode 100644 index 0000000..b84c375 Binary files /dev/null and b/wikipedia/data/assets/submenu_bg_normal.jpg differ diff --git a/wikipedia/data/assets/submenu_bg_pressed.png b/wikipedia/data/assets/submenu_bg_pressed.png new file mode 100644 index 0000000..d5693d5 Binary files /dev/null and b/wikipedia/data/assets/submenu_bg_pressed.png differ diff --git a/wikipedia/data/assets/submenu_hover_arrow.png b/wikipedia/data/assets/submenu_hover_arrow.png new file mode 100644 index 0000000..a286591 Binary files /dev/null and b/wikipedia/data/assets/submenu_hover_arrow.png differ diff --git a/wikipedia/data/assets/submenu_separator_shadow_a.png b/wikipedia/data/assets/submenu_separator_shadow_a.png new file mode 100644 index 0000000..d4ac1ba Binary files /dev/null and b/wikipedia/data/assets/submenu_separator_shadow_a.png differ diff --git a/wikipedia/data/assets/submenu_separator_shadow_b.png b/wikipedia/data/assets/submenu_separator_shadow_b.png new file mode 100644 index 0000000..ba79241 Binary files /dev/null and b/wikipedia/data/assets/submenu_separator_shadow_b.png differ diff --git a/wikipedia/data/css/endless_brazil.css b/wikipedia/data/css/endless_brazil.css index 7e0bde4..fc667cb 100644 --- a/wikipedia/data/css/endless_brazil.css +++ b/wikipedia/data/css/endless_brazil.css @@ -1,5 +1,5 @@ * { - font-family: "Benton Sans"; + font-family: "BentonSans Regular"; } .title { @@ -11,15 +11,29 @@ color: #a0a0a0; } +Gjs_ArticleList{ + background-image: url('resource:///com/endlessm/brazil/assets/submenu_background.jpg'); +} + Gjs_ArticleList .button { - border-top: 1px solid #555753; - padding: 10px; - background-color: #d3d7cf; - color: black; + padding-left: 25px; + padding-right: 25px; + padding-top: 10px; + padding-bottom: 10px; + font-size: 15px; + color: #464646; + background-image: url('resource:///com/endlessm/brazil/assets/submenu_bg_normal.jpg'); + background-size: cover; } Gjs_ArticleList .button:hover { color: #555753; + background-image: url('resource:///com/endlessm/brazil/assets/submenu_bg_hover.png'); +} + +Gjs_ArticleList .button:active { + color: #555753; + background-image: url('resource:///com/endlessm/brazil/assets/submenu_bg_pressed.png'); } .articles-page { @@ -37,6 +51,7 @@ Gjs_ArticleList .button:hover { } #category_title{ + font-family: "BentonSans Light"; font-size: 52px; color: rgba(255, 255, 255, 0.9); -} +} \ No newline at end of file diff --git a/wikipedia/data/endless_brazil.gresource.xml b/wikipedia/data/endless_brazil.gresource.xml index 1ca63a1..6040179 100644 --- a/wikipedia/data/endless_brazil.gresource.xml +++ b/wikipedia/data/endless_brazil.gresource.xml @@ -6,5 +6,14 @@ category_images/cuisine.jpg category_images/history.jpg assets/introduction_title_separator.png + assets/submenu_bg_hover.png + assets/submenu_bg_pressed.png + assets/submenu_bg_normal.jpg + assets/submenu_separator_shadow_a.png + assets/submenu_separator_shadow_b.png + assets/submenu_hover_arrow.png + assets/submenu_background.jpg + assets/category_splash_separator_shadow.png + assets/category_hover_arrow.png -- cgit v1.2.3