From a83e415ddbe74dfb64bbcb9d0a8589652e4df23f Mon Sep 17 00:00:00 2001 From: Aurélio A. Heckert Date: Mon, 17 Jun 2013 18:37:06 -0300 Subject: [PATCH] Product Catalog and Product Categories Block styles --- app/views/catalog/index.rhtml | 7 +++++-- public/designs/themes/base/style.css | 104 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ public/stylesheets/application.css | 165 ++++++++++++++------------------------------------------------------------------------------------------------------------------------------------------------------- 3 files changed, 123 insertions(+), 153 deletions(-) diff --git a/app/views/catalog/index.rhtml b/app/views/catalog/index.rhtml index 27eab6d..b67f1c8 100644 --- a/app/views/catalog/index.rhtml +++ b/app/views/catalog/index.rhtml @@ -1,11 +1,13 @@ <% extra_content = [] %> <% extra_content_list = [] %> +
+

<%= _('Products/Services') %>

<%= breadcrumb(@category) if params[:level] %> - + <%= pagination_links @products, :params => {:controller => :catalog, :action => :index, :profile => profile.identifier} %> <%= add_zoom_to_images %>
+
diff --git a/public/designs/themes/base/style.css b/public/designs/themes/base/style.css index 83a836f..7cfcbac 100644 --- a/public/designs/themes/base/style.css +++ b/public/designs/themes/base/style.css @@ -699,6 +699,110 @@ div#notice { filter:alpha(opacity=50); } + +/********************* Product Categories Block **********************/ + +.product-categories-block .catalog-home-link { + display: block; + background: rgba(0,0,0,0.08); + font-weight: bold; + text-align: center; + border-radius: 5px; + padding: 0px; + line-height: 200%; + text-decoration: none; + color: #000; +} +.product-categories-block .catalog-home-link:hover { + background: rgba(0,0,0,0.6); + color: #FFF; + text-decoration: none; +} + +.product-categories-block .catalog-categories-list { + margin-top: 0.5em; +} + +.product-categories-block ul { + list-style-type: none; + margin: 0px; + padding: 0px; + border-radius: 5px; + color: rgba(0,0,0,0.4); +} + +.product-categories-block li { + margin: 0; + padding: 0; + white-space: nowrap; +} + +.product-categories-block li li div { + padding: 0 0 0 1.5em; +} + +.product-categories-block .catalog-categories-list a { + text-decoration: none; + font-size: 120%; + line-height: 150%; + color: #333; + overflow: hidden; + text-overflow: ellipsis; + display: inline-block; + padding: 0 0.3em 0 0.5em; + border-radius: 5px; + max-width: 80%; + vertical-align: middle; +} +.product-categories-block .catalog-categories-list ul a { + text-decoration: none; + font-size: 110%; + line-height: 163.6%; +} +.product-categories-block .catalog-categories-list div:hover a:hover { + background: rgba(0,0,0,0.6); + color: #FFF; + text-decoration: none; +} + +.product-categories-block .catalog-categories-list div:hover a, +.product-categories-block .catalog-categories-list div:hover .count { + background: rgba(0,0,0,0.08); +} + +.block.product-categories-block .catalog-categories-list a { + font-weight: bold; +} + +.block.product-categories-block .catalog-categories-list ul a { + font-weight: normal; +} + +.product-categories-block a:hover { + text-decoration: underline; +} + +.product-categories-block .count { + display: inline-block; + vertical-align: middle; + margin-left: -0.2em; + padding: 0 0.2em; + line-height: 180%; + border-radius: 5px; +} + +.block.product-categories-block .count:before { + content: "("; +} +.block.product-categories-block .count:after { + content: ")"; +} + +.catalog-categories-notice { + color: rgba(0,0,0,0.3); + padding: 0.5em 1em; +} + /********************* Environment Statistics ************************/ #content .environment-statistics-block ul { diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css index c9b1782..aa92c9e 100644 --- a/public/stylesheets/application.css +++ b/public/stylesheets/application.css @@ -2509,7 +2509,13 @@ div#activation_enterprise label, div#activation_enterprise input, div#activation /* ==> @import url('products.css'); <== */ /* * * Products catalog * * * * * * * * * * * * */ +#product-catalog { + text-align: center; +} + #product-list { + display: inline-block; + text-align: left; line-height: 20px; margin: 0px; padding: 0px; @@ -2521,11 +2527,11 @@ div#activation_enterprise label, div#activation_enterprise input, div#activation list-style: none; } #product-list li.product { + display: inline-block; width: 200px; min-height: 280px; - padding: 10px 30px 10px 0; + padding: 10px 15px; margin-bottom: 10px; - display: inline-block; vertical-align: top; } #product-list .expand-box:hover { @@ -2735,132 +2741,11 @@ div#activation_enterprise label, div#activation_enterprise input, div#activation margin-top: -15px; } -.l-sidebar-right-bar ul { - list-style-type: none; - margin-left: 0; - padding: 1em 1em 0.5em 1em; -} - -.l-sidebar-right-bar ul ul { - padding-left: 1em; - margin-top: 3px; -} - -.l-sidebar-right-bar li { - margin: 3px 0px; - padding: 0px; -} - -.l-sidebar-right-bar a { - text-decoration: none; - font-size: 120%; -} - -.l-sidebar-right-bar a:hover { - text-decoration: underline; -} - -/* * * Product Categories Block * * * * * * */ - -.product-categories-block .catalog-home-link { - display: block; - background: rgba(0,0,0,0.08); - font-weight: bold; - text-align: center; - border-radius: 5px; - padding: 0px; - line-height: 200%; - text-decoration: none; - color: #000; -} -.product-categories-block .catalog-home-link:hover { - background: rgba(0,0,0,0.6); - color: #FFF; - text-decoration: none; -} - -.product-categories-block .catalog-categories-list { - margin-top: 0.5em; -} - -.product-categories-block ul { - list-style-type: none; - margin: 0px; - padding: 0px; - border-radius: 5px; - color: rgba(0,0,0,0.4); -} - -.product-categories-block li { - margin: 0; - padding: 0; - white-space: nowrap; -} - -.product-categories-block li li div { - padding: 0 0 0 1.5em; -} - -.product-categories-block .catalog-categories-list a { - text-decoration: none; - font-size: 120%; - line-height: 150%; - color: #333; - overflow: hidden; - text-overflow: ellipsis; - display: inline-block; - padding: 0 0.3em 0 0.5em; - border-radius: 5px; - max-width: 80%; - vertical-align: middle; -} -.product-categories-block .catalog-categories-list ul a { - text-decoration: none; - font-size: 110%; - line-height: 163.6%; -} -.product-categories-block .catalog-categories-list div:hover a:hover { - background: rgba(0,0,0,0.6); - color: #FFF; - text-decoration: none; -} - -.product-categories-block .catalog-categories-list div:hover a, -.product-categories-block .catalog-categories-list div:hover .count { - background: rgba(0,0,0,0.08); -} - -.block.product-categories-block .catalog-categories-list a { - font-weight: bold; -} - -.block.product-categories-block .catalog-categories-list ul a { - font-weight: normal; -} - -.product-categories-block a:hover { - text-decoration: underline; -} - -.product-categories-block .count { - display: inline-block; - vertical-align: middle; - margin-left: -0.2em; - padding: 0 0.2em; - line-height: 180%; - border-radius: 5px; -} - -.block.product-categories-block .count:before { - content: "("; -} -.block.product-categories-block .count:after { - content: ")"; -} - -.catalog-categories-notice { - color: rgba(0,0,0,0.3); - padding: 0.5em 1em; +#product-list .highlighted img.star { + position: absolute; + top: 2px; + right: 2px; + z-index: 1; } /* * * Show Product * * * * * * * * * * * * */ @@ -6290,28 +6175,12 @@ li.profile-activity-item.upload_image .activity-gallery-images-count-1 img { line-height: 1.5; } -/* Sidebar Layout */ - -.l-sidebar-left-content { - float: right; - width: 78%; -} - -.l-sidebar-right-bar { - float: right; - width: 20%; -} - -.l-sidebar-right-content { - float: left; - width: 78%; -} - /* Breadcrumb */ #breadcrumb { font-size: 16px; margin: 15px 0; + text-align: left; } .controller-profile_editor #profile-data { @@ -6363,9 +6232,3 @@ li.profile-activity-item.upload_image .activity-gallery-images-count-1 img { text-align: center; } -#product-list .highlighted img.star { - position: absolute; - top: 2px; - right: 2px; - z-index: 1; -} -- libgit2 0.21.2